body {     display: flex;     flex-direction: column;     min-height: 100vh;     min-width: 320px;     font-family: 'Roboto', sans-serif;     font-weight: 400;     font-size: 14px;     line-height: 1.5;     color: #f5f5f5;     background-color: #121a1c;     scroll-behavior: smooth;     text-rendering: optimizeSpeed;     overflow-x: hidden;     margin: 0;     padding: 0; }  .container {     position: relative;     margin: 0 auto;     padding: 0 15px;     width: 100%;     max-width: 954px; }  *, *::before, *::after {     box-sizing: border-box;     outline: 0; }  a {     color: #d3e512;     cursor: pointer;     outline: none; }  img {     max-width: 100%;     display: block; }  .header {     width: 100%;     position: fixed;     z-index: 100;     transition: all .3s linear;     border: none;     border-radius: 0;     padding-top: 15px;     padding-bottom: 10px;     overflow: visible;     background-color: #042f29 !important; }  .header__inner {     display: flex;     justify-content: space-between; }  @media (min-width: 900px) {     .header__wrapper {         padding-bottom: 0 !important;         height: auto;         overflow: visible !important;     } }  .logo {     display: flex;     align-items: stretch;     width: auto;     justify-content: center;     padding: 0; }  .buttons-wrapper {     display: flex;     width: 100%;     max-width: 100px;     min-width: 70px;     justify-content: space-between;     align-items: center;     margin-left: 25px; }  @media (min-width: 900px) {     .buttons-wrapper {         display: none;     }      .logo {         width: 100%;     } }  .header .lang {     display: flex;     flex-direction: row;     justify-content: end;     align-items: center;     cursor: pointer;     background: none;     border: none; }  .header__inner .lang {     display: flex;     color: #d3e512;     padding: 0; }  @media (min-width: 900px) {     .header__inner .lang {         display: none;     } }  .header .lang-toggle-icon {     width: 18px;     height: 8px;     transition: all .3s linear;     transform: rotate(180deg);     margin-left: 5px; }  .menu__burger-btn {     position: relative;     height: 100%;     display: flex;     align-items: center;     justify-content: center;     gap: 3px;     cursor: pointer;     transition: all .3s linear;     background: none;     border: none;     padding-right: 0; }  .menu__burger-btn .menu__burger-btn-ellipse {     display: inline-block;     width: 6px;     height: 6px;     border-radius: 50%;     background-color: #f5f5f5;     transition: all .3s linear; }  .menu__wrapper {     position: absolute;     top: 35px;     left: 0;     width: 100%;     height: 0;     overflow: auto;     transition: all .3s linear;     display: flex;     flex-direction: column;     justify-items: center;     gap: 15px;     width: 100%;     background-color: #042f29; }  .menu__wrapper.open {     padding-top: 20px;     height: 100vh;     padding-left: 15px;     padding-right: 15px; }  .menu-item.football {     padding-bottom: 70px;     border-bottom: none; }  .menu-item.airplane-item {     border-bottom: none; }  .airplane-link {     justify-content: center; }  @media (min-width: 900px) {     .menu__wrapper {         position: relative;         top: 0;         padding-bottom: 0 !important;         height: auto;         flex-direction: row;         justify-content: center;         overflow: visible;         margin-top: 0;     }      .menu-item.football {         padding-bottom: 0;     } }  .no-scrollbar {     -ms-overflow-style: none;     scrollbar-width: none; }  .menu__list {     display: flex;     justify-content: flex-start;     align-items: flex-start;     flex-direction: column;     gap: 18px;     list-style: none;     margin: 0;     padding: 0; }  .menu-item {     position: relative;     transition: all .3s linear;     border-bottom: 1px solid rgb(245 245 245 / 20%);     width: 100%; }  .menu-item:hover a {     color: #d3e512; }  .menu-item:hover {     border-bottom: 1px solid #d3e512; }  .menu-item-link, .menu-item a {     text-decoration: none;     cursor: pointer;     color: #f5f5f5;     width: 100%;     text-wrap: nowrap;     font-weight: 600;     font-size: 18px;     padding: 10px; }  @media (min-width: 900px) {     .menu__list {         flex-direction: row;         align-items: center;         justify-content: space-between;         width: 100%;     }      .menu-item a {         font-weight: 400;         font-size: 14px;         padding: 5px 0;         transition: all .3s linear;     }      .menu-item {         width: auto;         border-bottom: 1px solid transparent;     } }  .mob-lang .sub-menu {     position: absolute;     z-index: 100;     top: 100%;     left: 0;     padding: 0 0;     color: transparent;     line-height: 0;     border-top: 1px solid transparent;     background-color: transparent;     overflow: hidden;     transition: all .1s linear;     height: 0;     padding: 0; }  .mob-lang .menu-item:hover .sub-menu {     position: absolute;     top: 100%;     left: 0;     padding: 15px 0;     color: inherit;     line-height: inherit;     border-top: 1px solid #d3e512;     border-radius: 0 0 16px 16px;     background-color: #292b27;     height: 100px; }  .mob-lang .menu-item:hover .sub-menu .menu-item a {     display: block;     padding: 10px 15px; }  @media (min-width: 900px) {     .sub-menu .menu-item {         border-bottom: 0;     } }  .sub-menu {     padding-top: 10px;     padding-left: 10px; }  .sub-menu .menu-item {     border-bottom: 0; }  .sub-menu .menu-item>a {     font-weight: 400;     font-size: 14px;     color: #f5f5f5 !important;     width: 100%;     padding: 5px 0;     text-wrap: nowrap;     transition: all .3s linear; }  .menu-item.lang-desc {     display: none; }  .sub-menu .menu-item>a:hover {     color: #d3e512 !important; }  @media (min-width: 900px) {     .sub-menu .menu-item a {         padding: 0 15px;         transition: all .2s linear;     }      .header__inner {         display: block;     } }  .menu-item-link {     display: flex;     align-items: center;     gap: 5px; }  .menu-item-link svg {     display: none; }  .lang .menu-item-link svg {     display: block; }  .lang .menu-item {     border-bottom: none; }  @media (min-width: 900px) {     .menu-item-link svg {         display: block;     } }  .airplane-item:hover {     border-bottom: 1px solid transparent; }  .airplane-item .airplane {     animation: airplaneRotate 2.5s ease-in-out infinite; }  @keyframes airplaneRotate {     0% {         transform: translateY(-15%) rotate(0);     }      40% {         transform: translateY(-15%) rotate(45deg);     }      50% {         transform: translateY(-15%) rotate(45deg);     }      0% {         transform: translateY(-15%) rotate(0);     } }  .airplane-item * {     transition: all .3s linear; }  .airplane-item:hover .aviator {     transform: scale(1.2); }  .lang-toggle-icon {     width: 18px;     height: 8px;     transition: all .3s linear;     transform: rotate(180deg);     margin-left: 5px; }  .menu-item:hover .menu-item-link .lang-toggle-icon {     transform: rotate(0); }  .menu-item {     display: block;     align-items: center;     gap: 5px;     cursor: pointer; }  .menu-item:hover svg path {     stroke: #d3e512; }  .menu-item:hover div {     color: #d3e512; }  @media (min-width: 900px) {     .menu-item {         display: flex;         align-items: center;         gap: 5px;         cursor: pointer;     } }  @media (min-width: 900px) {     .sub-menu {         position: absolute;         z-index: 100;         top: 100%;         left: 0;         padding: 0 0;         color: transparent;         line-height: 0;         border-top: 1px solid transparent;         background-color: transparent;         overflow: hidden;         transition: all .1s linear;     }      .menu-item:hover .sub-menu {         position: absolute;         top: 100%;         left: 0;         padding: 15px 0;         color: inherit;         line-height: inherit;         border-top: 1px solid #d3e512;         border-radius: 0 0 16px 16px;         background-color: #292b27;     }      .menu-item:hover .sub-menu .menu-item a {         display: block;         padding: 10px 15px;     }      .menu-item.lang-desc {         display: flex;     } }  .main {     margin-top: 56px;     min-height: 100vh;     /* або потрібна висота */     background: linear-gradient(to top, #000 0%, transparent 100%); }  .btn {     width: 100%;     max-width: 288px;     height: 40px;     border-radius: 16px;     overflow: hidden;     backdrop-filter: blur(6px);     transition: all .3s linear;     font-size: 16px;     font-weight: 600;     line-height: 1;     text-transform: uppercase;     text-decoration: none;     display: flex;     align-items: center;     justify-content: center;     gap: 10px;     padding: 5px 20px; }  .bonuses {     background-color: #121a1c;     border: 2px solid #d3e512;     color: #d3e512; }  .bonuses:hover {     box-shadow: 0 0 13.1px #d3e512, 0 0 7.6px #d3e512; }  .bonuses img {     transform: rotate(0);     transition: all .3s linear; }  .bonuses:hover img {     transform: rotate(180deg); }  .login {     background-color: #d3e512;     color: #292b27; }  .registration {     background-color: #af00d8;     color: #f5f5f5; }  .login:hover {     box-shadow: 0 0 13.1px #d3e512, 0 0 7.6px #d3e512; }  .registration:hover {     box-shadow: 0 0 10px #af00d8, 0 0 7.6px #af00d8; }  .content-buttons {     margin-top: 30px;     display: flex;     flex-direction: column;     align-items: center;     gap: 15px;     justify-content: center; }  @media (min-width: 900px) {     .content-buttons {         flex-direction: row;     }      .main {         margin-top: 129px;     } }  .toc-title {     text-align: left;     margin: 30px 0;     text-transform: capitalize;     font-size: 20px;     color: #f5f5f5; }  .toc-list {     padding: 0 30px;     height: 100%;     display: grid;     gap: 0 0;     grid-template-columns: 1fr;     list-style: none;     padding: 0;     margin: 0; } @media (min-width: 500px) {     .toc-list {         padding: 0px;         grid-template-columns: 1fr 1fr;     } } @media (min-width: 800px) {     .toc-list {         padding: 0px;         grid-template-columns: repeat(3, 1fr);     } } .toc-list>li {     border: 1px transparent solid;     transition-property: all;     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);     transition-duration: 150ms; }  .toc-item>a {     display: block;     width: 100%;     height: 100%;     color: #f5f5f5;     font-weight: 300;     font-size: 16px;     text-decoration: none; }   @media (min-width: 500px) {     .toc-item>a {         padding: 10px;         padding-left: 50px;         font-weight: 400;         border-right: 1px #d3e512 solid;         transition-property: all;         transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);         transition-duration: 150ms;     }     .toc-item:nth-child(2n)>a {         border-right: none;     } } @media (min-width: 800px) {     .toc-item:nth-child(2n)>a {         border-right: 1px #d3e512 solid;     }     .toc-item:nth-child(2n-1)>a {         padding-left: 50px;     }     .toc-item:nth-child(3n-2)>a {         padding-left: 0px;     }     .toc-item:nth-child(3n)>a {         border-right: none;     } }  table {     border-collapse: collapse;     width: 100%;     table-layout: fixed;     width: 100%;     margin: 10px 0; }  td, th {     border: 1px solid;     padding: .5em; } img {     max-width: 100%;     height: auto;     margin: 10px; }  h2 {     margin-top: 50px;     font-weight: 400;     font-size: 20px;     color: #d3e512; } ul li::marker, ol li::marker {     color: #d3e512; }  .faq {     margin: 20px auto;     border-radius: 16px;     color: #f5f5f5; } .faq h2 {     margin-bottom: 30px; } .faq-item {     margin-bottom: 20px; } .faq-question {     position: relative;     font-weight: 400;     font-size: 18px;     color: #f5f5f5;     padding: 20px 60px 20px 10px;     border: 1px solid #af00d8;     border-radius: 16px;     background: radial-gradient(500px at left, #292B27, #9747ff);     overflow: hidden;     cursor: pointer;     font-size: 20px;     padding: 30px 100px 30px 15px;     position: relative;     width: 100%;     text-align: left; }  .faq-answer {     max-height: 0;     overflow: hidden;     transition: max-height .3s ease;     border-radius: 0 0 8px 8px;     padding: 0 15px;     color: #f5f5f5; } .faq-item.active .faq-answer {     max-height: 200px;     padding: 20px 30px;     margin-bottom: 10px; }  .footer {     margin-top: auto;     margin-bottom: 0; } .footer__description {     background-color: #042f29;     padding: 30px 0; } .footer__description div {     display: flex ;     flex-direction: column;     justify-content: center;     row-gap: 35px;     padding: 30px 15px; } .footer__social-list {     display: flex ;     align-items: center;     column-gap: 17px;     margin: 0 auto;     list-style: none;     padding: 0; } .footer__social-list .footer__social-item img {     width: 24px;     height: 24px; } .footer__logo-wrapper {     position: relative;     display: flex ;     flex-direction: column;     justify-content: center;     row-gap: 60px;     padding: 30px 15px;     max-width: 1300px;     margin: 0 auto; } @media (min-width: 800px) {     .footer__logo-wrapper {         padding: 40px 15px;     } } .custom-logo-link {     flex-shrink: 0; } .footer__logo-wrapper .custom-logo-link img {     width: 100%;     max-width: 300px;     height: auto;     margin: 0 auto; } .footer__rights {     text-align: center; } @media (min-width: 800px) {     .footer__rights {         position: absolute;         right: 15px;         bottom: 15px;     } }