body {
  margin: 0;
  padding: 0;
  line-height: 24px;
  font-family: 'Poppins', sans-serif;
  background: #191E23;
  font-size: 14px;
  overflow: hidden;
  height: 100vh;
}
* {
 box-sizing: border-box;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
}
img {
  width: 100%;
  display: block;
}
ul {
  padding: 0px;
  margin: 15px 0px;
}
li {
  list-style: none;
}
a {
  text-decoration: none;
}
h1 {
  text-transform: capitalize;
  font-weight: 700;
}
.preloader{position:fixed;left:0;top:0;right:0;bottom:0;background:#23282d;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;z-index:1000}.preloader.hidden{-webkit-animation:1.5s linear forwards hiddenPreloader;animation:1.5s linear forwards hiddenPreloader}@-webkit-keyframes hiddenPreloader{0%{opacity:1;z-index:1000}30%{opacity:.8}50%{opacity:.5}70%{opacity:.3}100%{opacity:0;z-index:-1}}@keyframes hiddenPreloader{0%{opacity:1;z-index:1000}30%{opacity:.8}50%{opacity:.5}70%{opacity:.3}100%{opacity:0;z-index:-1}}
.header {
  padding: 50px 0px;
  width: 864px;
  margin: 0 auto;
  top: 0;
  z-index: 299;
}
.switch-language{position:relative}
.switch-language__item{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
.switch-language__flag{display:block;width:40px;position:relative}
.switch-language__text{position:relative;color:#fff;line-height:18px}.switch-language__selected{padding-right:20px;cursor:pointer}.switch-language__selected .switch-language__icon::after{position:absolute;content:"";top:50%;width:8px;height:8px;right:20px;background-image:url(../images/check.svg);background-repeat:no-repeat;background-size:contain;-webkit-transition:.3s;-o-transition:.3s;transition:.3s;-webkit-transform:translateX(200%) translateY(-50%) rotate(0);-ms-transform:translateX(200%) translateY(-50%) rotate(0);transform:translateX(200%) translateY(-50%) rotate(0)}
.switch-language__content{display: none;
  position: absolute;
  right: 0;
  top: -10px;
  min-width: 120px;
  background-color: #23282d;
  padding: 12px 8px;
  border-radius: 5px;
  -webkit-transform: translateY(20%);
  -ms-transform: translateY(20%);
  transform: translateY(20%);
  z-index: 20;
  height: 244px;
  /* overflow-y: hidden; */
  overflow-y: scroll;
  scroll-behavior: smooth;}.switch-language__content::-webkit-scrollbar {
    width: 10px;
  }

  .switch-language__content::-webkit-scrollbar-track {
    background-color: #23282d;
    border-radius: 10px;
  }

  .switch-language__content::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #808387;
  }
  .switch-language__content .switch-language__item{
    border-top-right-radius:5px;border-bottom-right-radius:5px}
    .switch-language__content .switch-language__item:hover{background:rgba(0,0,0,.2666666667)}.switch-language__content .switch-language__item+.switch-language__item{margin-top:8px}
    .switch-language .switch-language__selected.active .switch-language__icon::after{-webkit-transform:translateX(200%) translateY(-50%) rotate(180deg);-ms-transform:translateX(200%) translateY(-50%) rotate(180deg);transform:translateX(200%) translateY(-50%) rotate(180deg)}.switch-language .switch-language__content.active{display:block}
    .wrapper {
      width: 864px;
      margin: 0 auto;
      position: relative;
      height: 100%;
      display: flex;
      flex-direction: column;
    }
    .main {
      height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
    }
    .container__flex {
      display: flex;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
    }
    .container__flex_inh {
      display: flex;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      flex-direction: row;
      align-items: center;
      flex-wrap: nowrap;
    }
    .container__flex_center {
      display: flex;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      flex-direction: row;
      align-items: center;
      justify-content: space-around;
      flex-wrap: wrap;
      position: relative;
    }
    .num {
      margin-bottom: 50px;
    }
    .num__box {
      border-radius: 6px;
      border: 1px solid #FF5A00;
      color: #fff;
      height: 24px;
      width: 90px;
      text-align: center;
      margin: 2px;
      display: flex;
      justify-content: center;
      align-items: center;
      font-weight: 600;
    }
    .num__box_yellow {
      background: #FF5C02;
      border: none;
      color: #fff;
      font-weight: 500;
    }
    .bet {
      position: relative;
      max-width: 620px;
      background: #23282D;
      border-radius: 12px;
      padding: 20px;
      margin: 20px 5px;
      z-index: 5;
    }
    .bet__topper {
      background: #2D3237;
      border-radius: 8px;
      padding: 0px 5px 0px 10px;
    }
    .bet__lower {
      gap: 5px;
    }
    .bet__number {
      color: #fff;
    }
    .bet__pl-min__wrap {
      color: #fff;
      font-size: 12px;
      border: 1px solid #BEB9FF;
      border-radius: 6px;
      width: 28px;
      height: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 5px 3px;
    }
    .bet__num {
      margin-top: 5px;
      color: #fff;
      border-radius: 6px;
      border: 1px solid #2D3237;
      width: 78px;
      height: 22px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 600;
      background: #2D3237;
      text-transform: uppercase;
    }
    .bet__button {
      width: 240px;
      height: 56px;
      background-image: linear-gradient(to right bottom, #FF6E1E, #FF6E1E, #f77e24, #f18637, #FF9B50);    border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      color: #fff;
      font-weight: 600;
      -webkit-animation: radial-pulse 1s infinite;
      animation: radial-pulse 1s infinite;
      border: none;
      cursor: pointer;
    }
    @keyframes radial-pulse {
      0% {
        -webkit-box-shadow: 0 0 0 0 rgba(239,158,18,.5);
        box-shadow: 0 0 0 0 rgba(239,158,18,.5)
      }

      100% {
        -webkit-box-shadow: 0 0 0 40px rgba(245,229,198,0);
        box-shadow: 0 0 0 40px rgba(245,229,198,0)
      }
    }
    .graphic {
      height: 328px;
      width: 647px;
    }
    .block_animate {
      position: absolute;
      bottom: 0;
      right: -15%;
      z-index: 1;
    }
    .girl-mob, .coins-mob  {
      display: none;
    }
    .girl {
      width: 385px;
      position: absolute;
      bottom: 0;
      right: 10%;
      animation: 2s ease-in-out infinite moveUpDown;
    }
    @keyframes moveUpDown {
      0%,100% {
        transform: translateY(0)
      }

      50% {
        transform: translateY(20px)
      }
    }
    .coins {
      width: 277px;
      position: absolute;
      right: 0;
      bottom: 0;
    }
    .light {
      width: 538px;
    }
    .animated-circle {
      width: 96px;
      margin: 0 auto;
    }
    .animate {
      animation: 1s linear 0s normal none infinite running rot;
      -webkit-animation: 1s linear 0s normal none infinite running rot;
    }
    @keyframes rot {
      0% {
        transform: rotate(20deg);
      }
      100% {
        transform: rotate(360deg);
      }
    }
    @-webkit-keyframes rot {
      0% {
        transform: rotate(0deg);
      }
      100% {
        transform: rotate(360deg);
      }
    }
    h1 {
      font-size: 20px;
      color: #fff;
      text-transform: uppercase;
    }
    .main {
      position: relative;
      width: 100%;
      height: 100vh;
      overflow: hidden;
    }
    .main-image {
      position: absolute;
      z-index: 1;
      top: -49%;
      left: -76%;
      width: 150%;
      z-index: -1;
    }
    .animated-pattern {
      animation: 10s linear 0s normal none infinite running rot;
      -webkit-animation: 10s linear 0s normal none infinite running rot;
    }
    .progress {
      position: absolute;
      width: 647px;
      height: 328px;
      top: 106px;
    }
    .progress__wrap {
      position: absolute;
      left: 40%;
      top: 20%;
    }
    .progress-container {
      width: 192px;
      height: 4px;
      background-color: #003333;
      border-radius: 2px;
      margin: 0 auto;
    }
    .progress-bar {
      height: 4px;
      background-color: #FF5C02;
      width: 95%;
    }
    .plane {
      position: absolute;
      bottom: 8%;
      left: 0;
    }
    .red {
      width: 562px;
      height: 240px;
    }
    .red-line {
      width: 562px;
      height: 240px;
      position: absolute;
    }
    .block {
      bottom: 0;
      position: absolute;
      width: 0;
      left: 0;
      animation: chart 6.1s linear forwards;
    }

    .chart {
      bottom: 6%;
      left: 22px;
      overflow: hidden;
    }
    @keyframes movePlane {
      0% {
        transform: translate(50, 0) rotate(0deg);
        bottom: 15px;
      }
      20% {
        transform: translate(-30, 0) rotate(-10deg);
        bottom: -26px;
      }
      40% {
        transform: translate(-40, 0) rotate(-10deg);
        bottom: -55px;
      }
      60% {
        transform: translate(-85, 0) rotate(-13deg);
        bottom: -67px;
      }
      80% {
        transform: translate(-100, 0) rotate(-15deg);
        bottom: -56px;
      }
      93% {
        transform: translate(-100, 0) rotate(-15deg);
        bottom: -30px;
      }
      100% {
        transform: translate(535px, -260px) rotate(-20deg);
        bottom: 0px;
      }
    }

    @keyframes chart {
      to {
        width: 562px;
      }
    }
    .avialor-logo {
      position: absolute;
      left: 10%;
      width: 172px;
    }
    .overlay {
      width: 100%;
      height: 100%;
      background: #191e23b8;
      position: fixed;
      top: 0;
      left: 0;
      display: none;
      z-index: 300;
    }
    .popup {
      display: none;
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 999; /* Убедитесь, что z-index выше, чем у overlay */
    }
    .timer {
      position: absolute;
      top: 22%;
      left: 50%;
      font-size: 64px;
      color: #FFFFFF;
      z-index: 999;
      font-weight: 700;
      line-height: 78px;
      width: 175px;
      z-index: 5;
    }
    .timer::after {
      content: 'x';
      position: absolute;
      right: -34px;
    }
    #newBlock {
      width: 553px;
      height: 300px;
      position: relative;
      top: 0;
      left: 0;
    }
    .popup__img {
      width: 590px;
      position: relative;
    }
    .popup__title {
      font-size: 26px;
      font-weight: 700;
      line-height: 30px;
      text-transform: uppercase;
      color: #fff;
      top: 35px;
      position: absolute;
      left: 50%;
      transform: translate(-50%, 0);
      text-transform: uppercase;
      width: 100%;
      text-align: center;
    }
    .popup__currency {
      position: absolute;
      top: 120px;
      left: 50%;
      right: 0;
      transform: translate(-50%, 0);
      text-align: center;
      text-transform: uppercase;
      line-height: 1.2;
      width: 100%;
      font-family: 'Poppins', sans-serif;
      font-weight: 900;
      font-size: 43px;
      background-image: linear-gradient(to bottom,#f8d57e,#fad97c,#fbdd7b,#fce179,#fde578,#f3d86c,#e8cb61,#debe56,#c59f40,#ab802c,#916318,#764803);
      color: transparent;
      -webkit-background-clip: text;
      text-transform: uppercase;
      background-image: linear-gradient(to bottom, #FFEEB1 , #8E5F14);
      -webkit-text-fill-color: transparent;
      -webkit-background-clip: text;
      -webkit-box-decoration-break: clone;
      text-shadow: 1px 1px 0px #e9ca44, 0 0 1em #8e5f14, 0 0 0.2em #0b0b0b;
      width: 550px;
    }
    .popup__button {
      position: absolute;
      top: 275px;
      left: 50%;
      right: 0;
      transform: translate(-50%, 0);
      width: 400px;
    }
    .popup__girl {
      position: absolute;
      width: 283px;
      bottom: 50%;
      left: 20%;
      transform: translate(-50%, 0);
      animation: 2s ease-in-out infinite moveUpDown;
    }
    .confetti {
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
      width: 80%;
      height: 100vh;
      overflow: hidden;
      margin: 0 auto;
    }
    .confetti-piece {
      position: absolute;
      width: 100px;
      height: 90px;
      background-image: url(../images/lenght2.png);
      top: 0;
      opacity: 0;
    }
    .confetti-piece:nth-child(1) {
      background-image: url(../images/tapes.png);
      width: 100%;
      height: 70vh;
      background-size: cover;
      background-repeat: repeat;
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 258ms;
      animation-delay: 258ms;
      -webkit-animation-duration: 1782ms;
      animation-duration: 2482ms;
      top: -50%;
    }
    .confetti-piece:nth-child(2) {
      background-image: url(../images/lenght3.png);
      background-size: cover;
      background-repeat: repeat;
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1200ms infinite ease-out;
      -webkit-animation-delay: 5558ms;
      animation-delay: 558ms;
      -webkit-animation-duration: 962ms;
      animation-duration: 2482ms;
    }
    .confetti-piece:nth-child(3) {
      background-image: url(../images/tapes.png);
      background-size: cover;
      background-repeat: no-repeat;
      width: 100%;
      height: 100vh;
      left: 0;
      transform: rotate(-44deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 205ms;
      animation-delay: 205ms;
      -webkit-animation-duration: 701ms;
      animation-duration: 701ms;
    }
    .confetti-piece:nth-child(4) {
      transform: rotate(4deg);
      -webkit-animation: makeItRain 500ms infinite ease-out;
      animation: makeItRain 800ms infinite ease-out;
      -webkit-animation-delay: 1000ms;
      animation-delay: 1000ms;
      -webkit-animation-duration: 749ms;
      animation-duration: 749ms;
      top: -70%;
    }
    .confetti-piece:nth-child(6) {
      background-image: url(../images/lenght4.png);
      background-size: cover;
      background-repeat: no-repeat;
      left: 42%;
      transform: rotate(-71deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 111ms;
      animation-delay: 111ms;
      -webkit-animation-duration: 1191ms;
      animation-duration: 1191ms;
    }
    .confetti-piece:nth-child(7) {
      background-image: url(../images/lenght5.png);
      background-size: cover;
      background-repeat: no-repeat;
      left: 49%;
      transform: rotate(-79deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 184ms;
      animation-delay: 184ms;
      -webkit-animation-duration: 840ms;
      animation-duration: 840ms;
    }
    .confetti-piece:nth-child(8) {
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 384ms;
      animation-delay: 384ms;
      -webkit-animation-duration: 840ms;
      animation-duration: 840ms;
    }
    .confetti-piece:nth-child(9) {
      background-image: url(../images/lenght5.png);
      background-size: cover;
      background-repeat: no-repeat;
      left: 63%;
      transform: rotate(49deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 376ms;
      animation-delay: 376ms;
      -webkit-animation-duration: 981ms;
      animation-duration: 981ms;
    }
    .confetti-piece:nth-child(10) {
      background-image: url(../images/lenght4.png);
      background-size: cover;
      background-repeat: no-repeat;
      left: 70%;
      transform: rotate(64deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 222ms;
      animation-delay: 222ms;
      -webkit-animation-duration: 1184ms;
      animation-duration: 1184ms;
    }
    .confetti-piece:nth-child(11) {
      left: 77%;
      transform: rotate(-64deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 188ms;
      animation-delay: 188ms;
      -webkit-animation-duration: 1185ms;
      animation-duration: 1185ms;
    }
    .confetti-piece:nth-child(12) {
      background-image: url(../images/lenght5.png);
      left: 84%;
      transform: rotate(-3deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 233ms;
      animation-delay: 233ms;
      -webkit-animation-duration: 1119ms;
      animation-duration: 1119ms;
    }
    .confetti-piece:nth-child(14) {
      background-image: url(../images/lenght2.png);
      left: 91%;
      transform: rotate(-26deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 340ms;
      animation-delay: 340ms;
      -webkit-animation-duration: 921ms;
      animation-duration: 921ms;
    }
    .confetti-piece:nth-child(15) {
      background-image: url(../images/lenght3.png);
      left: 91%;
      transform: rotate(-26deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 340ms;
      animation-delay: 340ms;
      -webkit-animation-duration: 921ms;
      animation-duration: 921ms;
    }
    .confetti-piece:nth-child(16) {
      background-image: url(../images/lenght3.png);
      left: 91%;
      transform: rotate(-26deg);
      -webkit-animation: makeItRain 1000ms infinite ease-out;
      animation: makeItRain 1000ms infinite ease-out;
      -webkit-animation-delay: 340ms;
      animation-delay: 340ms;
      -webkit-animation-duration: 921ms;
      animation-duration: 921ms;
    }

    .confetti-piece:nth-child(4n) {
      background-image: url(../images/tapes.png);
      background-size: cover;
      background-repeat: no-repeat;
      width: 90%;
      height: 100vh;
      -webkit-animation-duration: 2000ms;
      animation-duration: 2000ms;
    }
    .confetti-piece:nth-child(3n) {
      background-image: url(../images/lenght5.png);
      background-size: cover;
      background-repeat: no-repeat;
      width: 100px;
      height: 50px;
      -webkit-animation-duration: 2500ms;
      animation-duration: 2500ms;
      -webkit-animation-delay: 1000ms;
      animation-delay: 1000ms;
    }
    .confetti-piece:nth-child(6n) {
      background-image: url(../images/lenght3.png);
      background-size: cover;
      background-repeat: no-repeat;
      width: 100px;
      height: 50px;
      -webkit-animation-duration: 2500ms;
      animation-duration: 2500ms;
      -webkit-animation-delay: 1000ms;
      animation-delay: 1000ms;
    }
    @-webkit-keyframes makeItRain {
      from {
        opacity: 0.6;
      }
      50% {
        opacity: 1;
      }
      to {
        transform: translateY(100vh);
      }
    }

    @keyframes makeItRain {
      from {
        opacity: 0.6;
      }
      50% {
        opacity: 1;
      }
      to {
        transform: translateY(100vh);
      }
    }
    @keyframes changeImage {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }
    .image-container { 
      position: relative; 
      width: 93px;  
      height: 48px;  
    } 
    .image-container-go {
      left: 4%!important;
      animation: movePlane 6s linear forwards;
    }
    .image-container {
      position: absolute;
      left: 2%;
      bottom: 13%;
    }
    .image-container img { 
      position: absolute; 
      top: 0; 
      left: 0; 
      width: 93px;  
      height: 48px;  
    } 
    .image2 { 
      opacity: 1; 
    } 
    .image1 { 
      opacity: 0; 
      animation-delay: .2s; 
      animation: changeImage 0.2s infinite; 
    } 
    @keyframes changeImage { 
      0% { 
        opacity: 1; 
      } 
      100% { 
        opacity: 0; 
      } 
    }
  @keyframes scaleUpAndPulse {
  0% {
    transform: translate(-50%, -50%) scale(0);
    opacity: 0;
  }
  45% {
    transform: translate(-50%, -50%) scale(1.3);
    opacity: 1;
  }
  70% {
    transform: translate(-50%, -50%) scale(1.3);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(0);
    opacity: 0;
  }
}

#mega-win {
    display: none; /* Начальное состояние - не отображается */
    position: fixed; /* Используем fixed для позиционирования относительно вьюпорта */
    top: 50%; /* Центрирование по вертикали */
    left: 50%; /* Центрирование по горизонтали */
    transform: translate(-50%, -50%); /* Начальное центрирование */
    width: 400px; /* Задаем ширину */
    height: auto; /* Высота будет зависеть от содержимого */
    z-index: 1000; /* Убедитесь, что блок будет поверх других элементов */
    animation: scaleUpAndPulse 2s forwards; 
    border-radius: 50%;
    background: radial-gradient(circle, #1d1d1f 0%, rgb(40 40 44 / 0%) 35%, rgb(42 45 46 / 0%) 100%);
}
.mega-win__title {
 position: absolute;
    top: 130px;
    left: 50%;
    right: 0;
    transform: translate(-50%, 0);
    text-align: center;
    text-transform: uppercase;
    line-height: 1.2;
    width: 100%;
    font-family: 'Poppins', sans-serif;
    font-weight: 900;
    font-size: 65px;
    background-image: linear-gradient(to bottom, #f8d57e, #fad97c, #fbdd7b, #fce179, #fde578, #f3d86c, #e8cb61, #debe56, #c59f40, #ab802c, #916318, #764803);
    color: transparent;
    -webkit-background-clip: text;
    text-transform: uppercase;
    background-image: linear-gradient(to bottom, #E91E63, #8E5F14);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-box-decoration-break: clone;
    text-shadow: 3px 3px 0px #FFEB3B, 0 0 1em #F44336, 0 0 0.2em #795548;
    text-align: center;
}