.ukrain-box {
  z-index: 1000;
  width: 100%;
  color: #000;
  font-family: akzidenz-grotesk-condensed, sans-serif;
  -webkit-animation: AnimationName 28s ease infinite;
  -moz-animation: AnimationName 28s ease infinite;
  animation: AnimationName 28s ease infinite;
  background-image: url("../../assets/images/modal-wck/STOLI_UKRAINE_DOVE_BG_light.jpg");
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat; }
  .ukrain-box .ukrain-close {
    z-index: 4000;
    position: absolute;
    width: 20px;
    right: 3rem;
    top: 3rem;
    cursor: pointer;
    background: black;
    padding: 0.5rem; }
  .ukrain-box .ukrain-wrapper {
    margin-top: 4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 100%; }
    .ukrain-box .ukrain-wrapper > div {
      width: 100%;
      margin: 2rem;
      text-align: center; }
      .ukrain-box .ukrain-wrapper > div.ukrain-image {
        text-align: center; }
        .ukrain-box .ukrain-wrapper > div.ukrain-image img {
          margin: 0 auto; }
        .ukrain-box .ukrain-wrapper > div.ukrain-image p {
          width: 60%;
          margin: 3rem auto;
          font-size: 3rem;
          color: #323232; }
          .ukrain-box .ukrain-wrapper > div.ukrain-image p sup {
            font-size: 2rem; }
          @media (max-width: 600px) {
            .ukrain-box .ukrain-wrapper > div.ukrain-image p {
              font-size: 2rem; } }
      .ukrain-box .ukrain-wrapper > div.ukrain-copy {
        text-align: justify;
        overflow-y: scroll;
        max-height: 100%; }
        .ukrain-box .ukrain-wrapper > div.ukrain-copy p {
          font-size: 2rem; }
  .ukrain-box .ukrain-box--border-blue {
    position: absolute;
    width: 100%;
    height: 50%;
    top: 0;
    border-top: 2rem solid #0057b7;
    border-left: 2rem solid #0057b7;
    border-right: 2rem solid #0057b7;
    opacity: 0.96;
    background: black;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(255, 255, 255, 0) 50%); }
    @media (max-width: 768px) {
      .ukrain-box .ukrain-box--border-blue {
        border-top: 1rem solid #0057b7;
        border-left: 1rem solid #0057b7;
        border-right: 1rem solid #0057b7; } }
    @media (max-width: 960px) {
      .ukrain-box .ukrain-box--border-blue {
        display: block;
        overflow-y: scroll;
        background: black;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(255, 255, 255, 0) 10%); } }
    @media (max-width: 768px) {
      .ukrain-box .ukrain-box--border-blue {
        background: black;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(255, 255, 255, 0) 10%);
        padding: 14rem 2rem 2rem 2rem; } }
  .ukrain-box .ukrain-box--border-yellow {
    position: absolute;
    width: 100%;
    height: 50%;
    bottom: 0;
    border-bottom: 2rem solid #ffd700;
    border-left: 2rem solid #ffd700;
    border-right: 2rem solid #ffd700;
    opacity: 0.96; }
    @media (max-width: 768px) {
      .ukrain-box .ukrain-box--border-yellow {
        border-bottom: 1rem solid #ffd700;
        border-left: 1rem solid #ffd700;
        border-right: 1rem solid #ffd700; } }
  .ukrain-box .wck--wrapper {
    justify-content: space-between;
    align-items: flex-end;
    height: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 18rem 4rem 4rem 4rem;
    position: relative;
    display: block;
    overflow-y: scroll; }
    @media (max-width: 960px) {
      .ukrain-box .wck--wrapper {
        display: block;
        overflow-y: scroll; } }
    @media (max-width: 768px) {
      .ukrain-box .wck--wrapper {
        padding: 14rem 2rem 2rem 2rem; } }
    .ukrain-box .wck--wrapper > div {
      padding: 3rem;
      float: left; }
      @media (max-width: 960px) {
        .ukrain-box .wck--wrapper > div {
          float: left; } }
      @media (max-width: 450px) {
        .ukrain-box .wck--wrapper > div {
          padding: 1rem; } }
      .ukrain-box .wck--wrapper > div:nth-of-type(1) {
        width: 80%;
        font-size: 1.7rem;
        color: #013a79;
        padding-bottom: 0; }
        @media (max-width: 960px) {
          .ukrain-box .wck--wrapper > div:nth-of-type(1) {
            width: 100%;
            overflow-y: unset; } }
        @media (max-width: 700px) {
          .ukrain-box .wck--wrapper > div:nth-of-type(1) {
            margin-bottom: 0; } }
        .ukrain-box .wck--wrapper > div:nth-of-type(1) img {
          width: 200px; }
        .ukrain-box .wck--wrapper > div:nth-of-type(1) h2 {
          color: #013a79;
          font-size: 2.5rem;
          line-height: 1.1; }
          .ukrain-box .wck--wrapper > div:nth-of-type(1) h2 sup {
            font-size: 1.5rem; }
        .ukrain-box .wck--wrapper > div:nth-of-type(1) h3 {
          color: #013a79;
          font-size: 2.5rem;
          text-align: center;
          padding-bottom: 1rem;
          line-height: 1.2; }
          @media (max-width: 1030px) {
            .ukrain-box .wck--wrapper > div:nth-of-type(1) h3 {
              font-size: 2rem; } }
          .ukrain-box .wck--wrapper > div:nth-of-type(1) h3 sup {
            font-size: 1.5rem; }
        .ukrain-box .wck--wrapper > div:nth-of-type(1) p {
          text-align: justify;
          margin-bottom: 15px; }
          .ukrain-box .wck--wrapper > div:nth-of-type(1) p.wck--hashtag {
            font-size: 2rem;
            text-align: center;
            padding-top: 3rem; }
        .ukrain-box .wck--wrapper > div:nth-of-type(1) > div {
          text-align: center;
          margin-top: 2rem; }
          .ukrain-box .wck--wrapper > div:nth-of-type(1) > div .wck--link {
            background-color: #e51d2e;
            border: 2px solid #e51d2e;
            color: white;
            text-transform: uppercase;
            padding: 1.5rem 10rem 1.5rem 10rem;
            width: 150px;
            transition: 0.3s;
            border-radius: 10px;
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2); }
            @media (max-width: 1030px) {
              .ukrain-box .wck--wrapper > div:nth-of-type(1) > div .wck--link {
                padding: 1.1rem 5rem 1.1rem 5rem; } }
            @media (max-width: 540px) {
              .ukrain-box .wck--wrapper > div:nth-of-type(1) > div .wck--link {
                width: 100%;
                display: block;
                margin-bottom: 1rem; } }
            .ukrain-box .wck--wrapper > div:nth-of-type(1) > div .wck--link:hover {
              background-color: #fff;
              color: #e51d2e;
              text-decoration: none !important; }
            .ukrain-box .wck--wrapper > div:nth-of-type(1) > div .wck--link.wck--link--blue {
              background: #0057b7;
              border: 2px solid #0057b7; }
              .ukrain-box .wck--wrapper > div:nth-of-type(1) > div .wck--link.wck--link--blue:hover {
                background-color: #fff;
                color: #0057b7 !important; }
            .ukrain-box .wck--wrapper > div:nth-of-type(1) > div .wck--link.wck--link--yellow {
              background: #ffd700;
              border: 2px solid #ffd700; }
              .ukrain-box .wck--wrapper > div:nth-of-type(1) > div .wck--link.wck--link--yellow:hover {
                background-color: #fff;
                color: #ffd700 !important; }
      .ukrain-box .wck--wrapper > div:nth-of-type(2) {
        width: 20%;
        padding-left: 0; }
        @media (max-width: 960px) {
          .ukrain-box .wck--wrapper > div:nth-of-type(2) {
            width: 100%;
            align-items: center;
            padding-bottom: 0; } }
        @media (max-width: 700px) {
          .ukrain-box .wck--wrapper > div:nth-of-type(2) {
            flex-wrap: wrap;
            padding-top: 0; } }
        .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--insupport {
          text-align: center; }
          @media (max-width: 700px) {
            .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--insupport {
              width: 100%;
              padding: 0 3rem; } }
          .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--insupport p {
            font-size: 2rem;
            color: #0c7abf;
            width: 100%; }
        .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--hashtag-heading {
          color: #0057b7; }
          @media (max-width: 840px) {
            .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--hashtag-heading {
              display: none; } }
        .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--logo {
          width: 60%;
          height: auto;
          margin: 1.5rem auto; }
        @media (max-width: 960px) {
          .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoli {
            padding: 6rem; } }
        @media (max-width: 760px) {
          .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoli {
            width: 33%;
            padding: 4rem; } }
        @media (max-width: 700px) {
          .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoli {
            width: 100%;
            padding: 0 14rem; } }
        @media (max-width: 500px) {
          .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoli {
            padding: 0 9rem; } }
        .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup {
          display: flex;
          flex-wrap: wrap; }
          @media (max-width: 960px) {
            .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup {
              width: 33%; } }
          @media (max-width: 700px) {
            .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup {
              width: auto;
              max-width: 400px;
              margin: 0 auto; } }
          .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup img {
            width: 50%; }
            .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup img:nth-of-type(2) {
              padding: 2rem; }
          .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup h3, .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup h4 {
            color: #0057b7; }
          .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup h3 {
            font-size: 2.9rem;
            margin-bottom: 0; }
            .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup h3 sup {
              font-size: 2rem; }
          .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup h4 {
            font-size: 1.3rem; }
            .ukrain-box .wck--wrapper > div:nth-of-type(2) .wck--stoligroup h4 sup {
              font-size: 1rem; }

.slide-home sup {
  top: -0.2em !important; }

@media (max-width: 1200px) {
  .ukrain-box .ukrain-wrapper > div.ukrain-copy p {
    font-size: 1.7rem; } }
@media (max-width: 1024px) {
  .ukrain-box .ukrain-wrapper {
    flex-wrap: wrap;
    max-height: 100%;
    overflow-y: scroll; }
    .ukrain-box .ukrain-wrapper > div {
      width: 100%; }
      .ukrain-box .ukrain-wrapper > div.ukrain-image p {
        width: 100%; }
      .ukrain-box .ukrain-wrapper > div.ukrain-copy {
        max-height: none; } }
@media (max-width: 800px) {
  .ukrain-box .lgbt-text-1 {
    top: 10%;
    left: 10%;
    line-height: 72px;
    font-size: 2.5em; }
  .ukrain-box .lgbt-text-2 {
    top: 34%;
    left: 10%;
    font-size: 1.7em;
    z-index: 3000; }
  .ukrain-box .lgbt-text-3 {
    top: 42%;
    left: 10%;
    line-height: 52px;
    font-size: 1.5em;
    z-index: 3000; }
  .ukrain-box .lgbt-logos {
    width: 250px; } }
@media (max-width: 780px) {
  .ukrain-box {
    overflow-y: scroll; }
    .ukrain-box .lgbt-text-1 {
      position: unset;
      float: left;
      text-align: center;
      margin: 40px auto 10px auto;
      width: 100%; }
    .ukrain-box .lgbt-text-2 {
      float: left;
      position: unset;
      top: unset;
      text-align: center;
      margin: 0 auto;
      width: 100%;
      font-size: 1.5em;
      padding: 5px; }
    .ukrain-box .lgbt-text-3 {
      float: left;
      position: unset;
      text-align: center;
      margin: 0 auto;
      width: 100%;
      font-size: 1.2em;
      padding: 5px;
      line-height: 30px; }
    .ukrain-box .lgbt-flag {
      bottom: unset;
      top: 320px; }
    .ukrain-box .lgbt-botle {
      right: 50%;
      margin-right: -80px;
      top: 330px; }
    .ukrain-box .lgbt-logos {
      bottom: unset;
      top: 1020px;
      width: 100%;
      text-align: center;
      padding-bottom: 20px;
      left: unset;
      padding: 30px; }
      .ukrain-box .lgbt-logos img {
        max-width: 200px;
        margin: 0 auto !important;
        float: none !important; } }

/*# sourceMappingURL=ukrain-modal.css.map */