.BannerEvent {
  border-radius: 16px;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-shadow: 0 14px 30px 0 rgba(157, 167, 170, 0.08), 0 4px 8px 0 rgba(157, 167, 170, 0.16);
          box-shadow: 0 14px 30px 0 rgba(157, 167, 170, 0.08), 0 4px 8px 0 rgba(157, 167, 170, 0.16);
  background-color: #fff;
}

  @media screen and (max-width: 767px) {.BannerEvent {
    display: block
}
  }

  .BannerEvent-Picture {
    width: 49.019608%;
  }

  @media screen and (min-width: 768px) and (max-width: 1199px) {

  .BannerEvent-Picture {
      width: 49.127907%
  }
    }

  @media screen and (max-width: 767px) {

  .BannerEvent-Picture {
      width: 100%
  }
    }

  @media screen and (max-width: 767px) {

  .BannerEvent-Picture .Picture,
    .BannerEvent-Picture picture,
    .BannerEvent-Picture img {
        height: auto
    }
      }

  .BannerEvent-Inner {
    padding: var(--space-3xl) var(--space-4xl);
    width: 50.980392%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column;
            flex-flow: column;
  }

  @media screen and (min-width: 768px) and (max-width: 1199px) {

  .BannerEvent-Inner {
      width: 51.162791%;
      padding: var(--space-2xl);
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-flow: column;
              flex-flow: column
  }
    }

  @media screen and (max-width: 767px) {

  .BannerEvent-Inner {
      width: 100%;
      padding: var(--space-xl) var(--space-xl) var(--space-2xl)
  }
    }

  .BannerEvent-Title {
    margin-bottom: var(--space-m);
  }

  @media screen and (min-width: 768px) and (max-width: 1199px) {

  .BannerEvent-Title {
      margin-bottom: var(--space-xs)
  }
    }

  .BannerEvent-Date {
    margin-top: var(--space-3xl);
  }

  @media screen and (min-width: 768px) and (max-width: 1199px) {

  .BannerEvent-Date {
      padding-top: var(--space-2xl);
      margin-top: auto
  }
    }

  @media screen and (max-width: 767px) {

  .BannerEvent-Date {
      margin-top: var(--space-xl)
  }
    }

  .BannerEvent-Date > *:not(:first-child) {
      margin-top: var(--space-m);
    }

  @media screen and (min-width: 768px) and (max-width: 1199px) {

  .BannerEvent-Date > *:not(:first-child) {
        margin-top: var(--space-3xs)
    }
      }

  @media screen and (max-width: 767px) {

  .BannerEvent-Date > *:not(:first-child) {
        margin-top: var(--space-xs)
    }
      }

  .BannerEvent-Button {
    margin-top: auto;
    padding-top: 88px;
  }

  @media screen and (min-width: 768px) and (max-width: 1199px) {

  .BannerEvent-Button {
      margin-top: var(--space-m)
  }
    }

  @media screen and (max-width: 767px) {

  .BannerEvent-Button {
      margin-top: var(--space-xl)
  }

      .BannerEvent-Button .Button {
        width: 100%;
      }
    }
