@charset "UTF-8";
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*         o°        o°        o°                                         °o        °o        °o         */
/*        O         O         O                 EVENTS LIST                 O         O         O        */
/* ><(((°>   ><(((°>   ><(((°>                                               <°)))><   <°)))><   <°)))>< */
/* _-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_ */
.eventsList {
  padding: 45px 45px 0 45px;
  text-align: left; }
  .eventsList li {
    display: inline-block;
    width: 320px;
    padding: 0 75px 45px 0;
    position: relative;
    vertical-align: top; }
    .eventsList li:nth-child(3n) {
      padding-right: 0; }
    .eventsList li p {
      position: absolute;
      top: 0;
      left: 0;
      text-align: left;
      font: 600 14px/118% "HelveticaNeue", sans-serif;
      color: #fff;
      text-transform: uppercase;
      overflow: hidden;
      width: 308px;
      height: 60px;
      padding: 12px 0 0 12px; }
      .eventsList li p span {
        position: relative;
        z-index: 2; }
      .eventsList li p::after {
        content: '';
        position: absolute;
        bottom: 73px;
        right: 86px;
        z-index: 1;
        display: block;
        width: 250px;
        height: 200px;
        background: rgba(0, 0, 0, 0.3);
        -webkit-transform: rotate(-17deg);
        -ms-transform: rotate(-17deg);
        transform: rotate(-17deg);
        transform-origin: right bottom; }
    .eventsList li .img {
      width: 320px;
      height: 320px;
      overflow: hidden;
      position: relative;
      transition: all 0.2s ease-in-out; }
      .eventsList li .img img {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 100%;
        transition: all 0.2s ease-in-out; }
    .eventsList li a {
      display: block;
      width: 320px;
      overflow: hidden; }
      .eventsList li a:hover p {
        border-top-left-radius: 15px; }
      .eventsList li a:hover .img {
        border-radius: 15px;
        background: #000; }
        .eventsList li a:hover .img img {
          width: 110%;
          opacity: 0.9; }
    .eventsList li h3 {
      height: 68px;
      text-align: center;
      display: block;
      padding: 10px 0 0 0;
      font: 600 18px/118% "HelveticaNeue", sans-serif;
      color: #000;
      text-transform: uppercase; }

/* nununununununununununununununununununununununununununununununununununu */
/* .o° .o° .o° .o° .o° .o° Events list responsive °o. °o. °o. °o. °o. °o. */
/* nununununununununununununununununununununununununununununununununununu */
@media all and (max-width: 1220px) {
  .eventsList {
    text-align: center; }
    .eventsList li {
      padding: 0 75px 45px 0px; }
      .eventsList li:nth-child(3n) {
        padding: 0 75px 45px 0px; }
      .eventsList li:nth-child(2n) {
        padding-right: 0; }
      .eventsList li h3 {
        font-size: 17px; } }
@media all and (max-width: 920px) {
  .eventsList {
    padding: 45px 0 0 0; }
    .eventsList li {
      padding: 0 0 30px 0;
      display: block;
      margin: 0 auto; }
      .eventsList li:nth-child(2n), .eventsList li:nth-child(3n) {
        padding: 0 0 30px 0; } }
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*         o°        o°        o°                                         °o        °o        °o         */
/*        O         O         O                  EVENT PAGE                 O         O         O        */
/* ><(((°>   ><(((°>   ><(((°>                                               <°)))><   <°)))><   <°)))>< */
/* _-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_-_ */
.eventContent {
  padding: 65px 45px 0 45px; }
  .eventContent p {
    font: 400 19px/118% "HelveticaNeue", sans-serif;
    color: #000;
    padding: 0 0 40px 0; }
    .eventContent p strong {
      font-weight: 600; }
    .eventContent p .italic {
      font-style: italic; }
    .eventContent p a {
      font-weight: 600;
      color: #3090A6;
      text-decoration: underline;
      /* button */ }
      .eventContent p a:hover {
        text-decoration: none; }
      .eventContent p a.eventButton {
        display: inline-block;
        background: #9BD5E2;
        color: #3B91A3;
        border-radius: 4px;
        padding: 5px 10px 5px 35px;
        text-decoration: none;
        font-size: 17px;
        font-variant: small-caps;
        line-height: 22px;
        position: relative; }
        .eventContent p a.eventButton::before {
          content: '';
          display: inline-block;
          position: absolute;
          top: 5px;
          left: 10px;
          width: 15px;
          height: 21px;
          margin: 0 10px 0 0;
          background: url("../img/fileIcon.svg") no-repeat 0 0/100% auto; }
        .eventContent p a.eventButton::after {
          content: '\25b6 ';
          display: inline-block;
          padding: 0 0 0 10px; }
        .eventContent p a.eventButton:hover {
          background: #3B91A3;
          color: #fff; }

/* images */
.event-flex {
  display: flex;
  justify-content: space-between;
  gap: 45px;
  padding: 0 0 40px 0; }
  .event-flex img,
  .event-flex div {
    flex-grow: 1;
    max-width: 100%;
    min-width: 1%; }
  .event-flex div {
    display: flex;
    flex-direction: column;
    gap: 45px 0; }
  .event-flex.legend {
    flex-wrap: wrap;
    gap: 5px 45px; }
    .event-flex.legend p {
      font-size: 15px;
      width: 100%;
      text-align: center; }

/* video */
.event-video {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  height: 0;
  margin: 0 0 45px 0; }
  .event-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

/* prev/next navigation */
.eventNav {
  display: flex;
  justify-content: space-between;
  gap: 0 45px;
  padding: 40px 0 45px 0; }
  .eventNav a {
    position: relative;
    flex-grow: 1;
    height: 100px;
    overflow: hidden;
    max-width: 50%;
    border-radius: 15px 0 0 15px; }
    .eventNav a:nth-child(2) {
      border-radius: 0 15px 15px 0; }
    .eventNav a p {
      position: absolute;
      top: 0;
      left: 0;
      padding: 15px;
      font: 600 14px/118% "HelveticaNeue", sans-serif;
      color: #fff;
      text-transform: uppercase; }
      .eventNav a p span {
        position: relative;
        z-index: 2; }
        .eventNav a p span .eventNavTitle {
          font: 400 13px/118% "HelveticaNeue", sans-serif;
          text-transform: none;
          padding: 10px 0 0 0;
          display: inline-block;
          text-shadow: 0 0 10px rgba(0, 0, 0, 0.6); }
        .eventNav a p span .arrows {
          font-family: Arial, Helvetica, sans-serif; }
      .eventNav a p::after {
        content: '';
        position: absolute;
        top: -96px;
        left: -12px;
        z-index: 1;
        display: block;
        width: 600px;
        height: 200px;
        background: rgba(0, 0, 0, 0.3);
        -webkit-transform: rotate(-17deg);
        -ms-transform: rotate(-17deg);
        transform: rotate(-17deg);
        transform-origin: left bottom; }
    .eventNav a:hover p::after {
      background: rgba(155, 213, 226, 0.5); }
  .eventNav img {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }

/* nunununununununununununununununununununununununununununununununununun */
/* .o° .o° .o° .o° .o° .o° Event page responsive °o. °o. °o. °o. °o. °o. */
/* nunununununununununununununununununununununununununununununununununun */
@media all and (max-width: 1220px) {
  .eventContent p {
    font-size: 16px;
    padding: 0 0 30px 0; } }
@media all and (max-width: 920px) {
  .eventContent {
    padding: 40px 30px 0 30px; }
    .eventContent p {
      padding: 0 0 20px 0; }

  /* images */
  .event-flex {
    flex-direction: column;
    gap: 20px 0;
    padding: 0 0 20px 0; }
    .event-flex img,
    .event-flex div {
      width: 100%; }

  /* prev/next navigation */
  .eventNav {
    flex-direction: column;
    gap: 20px 0; }
    .eventNav a {
      max-width: none;
      width: 100%; } }

/*# sourceMappingURL=events.css.map */