@media screen and (max-width: 3000px) and (min-width: 1921px) and (min-height: 1200px) {
  .content {
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) and (min-height: 1100px) and (max-height: 1368px) {
  .content {
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }
}

@media screen and (max-height: 950px) and (min-width: 1024px) and (max-width: 1600px) {
  .content {
    padding: 20px 1vw 20px 2vw;
  }

  .container {
    gap: 40px;
  }

  .timeline-item {
    width: 200px;
  }

  .timeline-item p,
  .timeline-item span {
    font-size: 14px;
  }

  .rules h4 {
    margin-top: 16px;
  }

  .rules h4 {
    font-size: 14px;
  }

  .logo {
    max-height: 50px;
  }

  .redirect-link {
    padding: 12px 20px;
    font-size: 24px;
  }

  .language-select {
    right: 60px;
    top: 30px;
  }

  .footer {
    max-width: 650px;
    height: auto;
  }
}

@media screen and (max-height: 750px) and (min-width: 1024px) {
  .content {
    padding-top: 4vh;
    gap: 20px;
  }
}

@media screen and (max-height: 750px) and (min-width: 1024px) and (max-width: 1600px) {
  .timeline-item p,
  .timeline-item span {
    font-size: 12px;
  }

  .redirect-link {
    font-size: 18px;
    margin-bottom: 4px;
  }

  .logo {
    max-width: 200px;
  }
}

@media screen and (max-height: 650px) {
  .popup {
    height: calc(100vh - 20px);
  }

  .popup-text {
    height: calc(100vh - 80px);
  }
}

@media screen and (max-height: 650px) and (min-width: 1024px) and (max-width: 1600px) {
  .content {
    min-height: unset;
  }

  .footer {
    height: 24px;
  }
}

@media screen and (max-width: 1480px) {
  .timeline-item__inner span,
  .timeline-item__inner p {
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.9), 0 0 4px rgba(0, 0, 0, 0.9);
  }
}

@media screen and (max-width: 1200px) {
  .content {
    padding: 24px 24px 32px;
    margin: 0 auto;
  }

  .footer {
    left: 45px;
    bottom: 20px;
  }

  .language-select {
    top: 20px;
    right: 20px;
  }
}

@media screen and (max-width: 1024px), screen and (max-device-width: 1024px) {
  .main,
  body {
    height: auto !important;
    background-color: #000 !important;
    background-image: none !important;
  }

  .content {
    width: unset;
    height: auto;
    padding: 24px 16px;
    -webkit-box-pack: unset;
    -ms-flex-pack: unset;
    justify-content: unset;
    gap: 80px;
  }

  .uz.content {
    gap: 81px;
  }

  .hu.content {
    gap: 79px;
  }

  .container {
    display: contents;
  }

  .tablet-banner {
    display: block;
    width: 100%;
    margin: 0 auto;
  }

  .desktop {
    display: none;
  }

  .tablet {
    display: block;
  }

  .logo {
    position: absolute;
    width: 178.56px;
    height: 55px;
    margin: 24px 0 0 24px;
  }

  .active-lang {
    gap: 6px;
    padding: 0 7px;
  }

  .language-select {
    right: 24px;
    top: 24px;
  }

  .language-select button {
    padding: 2px;
  }

  .footer {
    display: none;
  }

  .footer-tablet {
    display: block;
    max-width: 736px;
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .timeline {
    gap: 16px;
  }

  /* MAIN */
  .footer {
    max-width: 704px;
    width: 100%;
    height: auto;
  }

  .timeline-item {
    width: 214px;
  }

  .redirect-link {
    padding: 16px 48px;
    font-size: 32px;
    margin-bottom: 24px;
  }

  /* POPUP */
  .popup-link {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
  }

  .popup-headline {
    font-size: 3vh;
    padding: 10px 20px 10px 0;
  }

  .popup-close-img {
    width: 30px;
    height: 30px;
  }

  .popup-text p {
    font-size: 14px;
    line-height: 20px;
  }

  .modal-button {
    font-size: 16px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
  }

  .modal-link {
    margin-top: 24px;
  }

  .popup-text-title {
    font-size: 16px;
  }

  .modal-button {
    font-size: 7vw;
  }

  .popup .redirect-link {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 6vw;
  }

  .popup-text .popup__title {
    font-size: 18px;
  }

  .popup-btn__wrap {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
  }

  .popup .redirect-link {
    padding: 10px 100px;
  }

  .popup__title {
    font-size: 24px;
  }

  .popup-close {
    top: 10px;
    right: 10px;
  }

  .popup {
    padding: 16px 30px 16px 16px;
  }

  .popup-text {
    padding-inline: 0 6px;
  }

  .popup-text p {
    font-size: 16px;
    line-height: 20px;
  }

  .popup-text ol li,
  .popup-text ol li span,
  .popup-text ol li a {
    font-size: 14px;
    line-height: 30px;
  }

  .accent-color {
    font-size: 18px;
  }

  .popup .redirect-link {
    cursor: pointer;
    width: 259px;
    height: 48px;
    font-size: 20px;
    padding: 10px 0;
  }
}

@media screen and (max-width: 580px) {
  .timeline {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 36px;
  }

  .timeline-item img {
    width: 100px;
    height: 100px;
  }

  .arrow {
    width: 15px;
    height: 25.53px;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
  }

  .footer {
    display: none;
  }

  .footer-tablet {
    display: none;
  }

  .footer-mob {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
  }

  /* orders */

  .headline {
    order: 1;
  }

  .container-buttons {
    order: 2;
  }

  .timeline {
    order: 3;
  }

  .footer-mob {
    order: 4;
  }
}

@media screen and (max-width: 440px) {
  .main-btn,
  .redirect-link {
    width: 100%;
  }

  .redirect-link {
    padding: 15px 32px;
    font-size: 28px;
  }

  .tablet {
    display: none;
  }

  .mobile {
    display: block;
  }

  .logo {
    width: 162.33px;
    height: 50px;
  }

  .language-select {
    right: 24px;
    top: 24px;
  }

  .lang-list {
    gap: 8px;
  }

  .lang-list li button {
    font-size: 14px;
  }

  .tablet-banner {
    display: none;
  }

  .phone-banner {
    display: block;
    width: 100%;
  }
  .content {
    padding: 24px 16px 24px;
    gap: 31px;
  }

  .container-buttons {
    width: 100%;
  }

  /* orders */

  .headline {
    order: 2;
  }

  .container-buttons {
    order: 1;
  }
}
@media screen and (max-width: 375px) {
  .timeline {
    gap: 11px;
  }

  .timeline-item {
    width: 100%;
  }

  .lang-list li button {
    font-size: 14px;
  }

  .footer-mob {
    max-width: 343px;
    width: 100%;
    margin: 30px 0 0;
  }
}

@media screen and (max-width: 360px) {
  .redirect-link {
    font-size: 20px;
  }
}
