.upcoming-events a,
.upcoming-events--filtered a {
  font-size: 1.5rem;
  text-decoration: none;
  color: #2d7abf; }

.upcoming-events__event {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  min-height: 320px;
  padding: 2rem;
  -ms-flex-direction: column;
  flex-direction: column;
  border: 1px solid #bbb;
  background-size: auto;
  background-position: center;
  background-repeat: no-repeat; }
  @media (min-width: 64em) {
    .upcoming-events__event {
      min-height: 375px; } }
  @media (min-width: 75em) {
    .upcoming-events__event {
      min-height: 320px; } }
  .upcoming-events__event::after {
    background-color: #f0b310;
    width: calc(100% - 2rem);
    height: 9px;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    content: ''; }
    @media (min-width: 900px) {
      .upcoming-events__event::after {
        width: calc(100% - 4rem); } }
  .upcoming-events__event time {
    font-family: 'Roboto', 'Arial', sans-serif;
    font-weight: 300;
    color: #36424a; }
    .upcoming-events__event time {
      font-size: 1.75rem; }
      @media screen and (min-width: 20rem) {
        .upcoming-events__event time {
          font-size: calc(1.75rem + 1.375 * ((100vw - 20rem) / 80)); } }
      @media screen and (min-width: 100rem) {
        .upcoming-events__event time {
          font-size: 3.125rem; } }
    .upcoming-events__event time:nth-child(2n+2) {
      display: none; }
    .upcoming-events__event time:first-child {
      font-size: 0.875rem; }

.upcoming-events--filtered {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: center;
  justify-content: center; }
  .upcoming-events--filtered .upcoming-events__event {
    width: 100%;
    min-width: 120px; }
    @media (min-width: 55em) {
      .upcoming-events--filtered .upcoming-events__event {
        width: 33.33%; } }
    @media (min-width: 64em) {
      .upcoming-events--filtered .upcoming-events__event {
        width: 16.667%; } }

.upcoming-events__title {
  text-align: center;
  padding-top: 1rem;
  text-transform: capitalize; }

.upcoming-events__pager {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 2rem 0; }

.upcoming-events__btn svg {
  fill: #FFF;
  width: 16px; }

.upcoming-events__btn:hover svg, .upcoming-events__btn:focus svg {
  fill: #9b2743; }

.upcoming-events__btn.prev {
  margin-right: 2rem; }

.upcoming-events__btn.next {
  margin-left: 2rem; }