@charset "UTF-8";

@font-face {
    font-family: "Geologica";
    font-display: swap;
    src: url("../fonts/Geologica-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}

/*@font-face {*/
/*    font-family: "Roboto_Condensed";*/
/*    font-display: swap;*/
/*    src: url("../fonts/Roboto_Condensed-ExtraLight.woff2") format("woff2");*/
/*    font-weight: 200;*/
/*    font-style: normal;*/
/*}*/

@font-face {
    font-family: "Roboto_Condensed";
    font-display: swap;
    src: url("../fonts/Roboto_Condensed-Black.woff2") format("woff2");
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: "Roboto_Condensed";
    font-display: swap;
    src: url("../fonts/Roboto_Condensed-ExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: "Roboto_Condensed";
    font-display: swap;
    src: url("../fonts/Roboto_Condensed-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "Roboto_Condensed";
    font-display: swap;
    src: url("../fonts/Roboto_Condensed-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Roboto_Condensed";
    font-display: swap;
    src: url("../fonts/Roboto_Condensed-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
}

/*@font-face {*/
/*    font-family: "Roboto_Condensed";*/
/*    font-display: swap;*/
/*    src: url("../fonts/Roboto_Condensed-Thin.woff2") format("woff2");*/
/*    font-weight: 100;*/
/*    font-style: normal;*/
/*}*/

@font-face {
    font-family: "Roboto_Condensed";
    font-display: swap;
    src: url("../fonts/Roboto_Condensed-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
}

/*@font-face {*/
/*    font-family: "Roboto_Condensed";*/
/*    font-display: swap;*/
/*    src: url("../fonts/Roboto_Condensed-Medium.woff2") format("woff2");*/
/*    font-weight: 500;*/
/*    font-style: normal;*/
/*}*/

.no-scroll {
    overflow: hidden;
}

body {
    font-family: "Roboto_Condensed";
}

.bg-block {
    border-radius: var(--section-border-radius, 12px);
    background: var(--section-bg, #3e3e3e);
    padding: 20px;
    border-radius: 12px;
}

.btn--outlined {
    background: transparent;
    border: 1px solid var(--red, #c4002d);
}

.btn--outlined:hover {
    opacity: 0.6;
}

.btn--tg {
    background: var(--telegram-blue, #50a7ea);
}

.btn--tg:hover {
    opacity: 0.6;
}

.btn--white {
    background: #f2f2f2;
    color: var(--bg, #282828)
}

.btn--white:hover {
    opacity: .6
}

h1 {
    font-size: 36px;
    line-height: 130%;
    text-transform: none;
}

.text-image._reversed .text-image__title { order: 1; }

.text-image._reversed .text-image__image { order: 10; }

.text-image._reversed .text-image__content { order: 5; }

.text-image .content-button .btn {
    width: clamp(304px, 304px, 100%);
}

.text-image__content > * {
    margin-top: 12px;
}

.text-image__content > * {
    margin-top: 18px;
}

ul:not([class]),
ul.wp-block-list {
    list-style: disc;
}

ul:not([class]) li::marker,
ol:not([class]) li::marker,
.wp-block-list li::marker {
    color: #d4d4d4;
}

ol.wp-block-list,
ol:not([class]) {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 12px;
    counter-reset: how-to-text;
    margin: 0;
    padding: 18px 0 0;
}

ol.wp-block-list .btn,
ol:not([class]) .btn {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 4px 28px;
    min-height: 41px;
    width: clamp(293px, 50%, 100%);
}

ol.wp-block-list li,
ol:not([class]) li {
    position: relative;
    padding: 12px;
    border-radius: 5px;
    background: var(--section-bg, #3e3e3e);
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 6px;
    row-gap: 12px;
    font-size: 16px;
    line-height: 110%;
}

ol.wp-block-list li:has(a:not([class])) {
    display: inline;
}

ol.wp-block-list li::before,
ol:not([class]) li::before {
    counter-increment: how-to-text;
    content: counter(how-to-text);
    border-radius: 50%;
    background: var(--green, #4caf50);
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
}

.advantages__item ol:not([class]),
.advantages__item ol.wp-block-list {
    margin-top: 1rem;
}

.tabs__item ol:not([class]) li,
.tabs__item ol.wp-block-list li,
.advantages__item ol:not([class]) li,
.advantages__item ol.wp-block-list li {
    background: #242424;
    text-align: left;
}

.wp-block-list li:has(a:not([class]))::before {
    margin-bottom: 6px;
}

ol.wp-block-list li > *,
ol:not([class]) li > * {
    grid-column: 1/-1;
}

.text-image__image img {
    border-radius: 12px;
}

.page-header__burger span {
    transition: transform 0.1s ease-in-out, -webkit-transform 0.1s ease-in-out;
}

:root {
    --telegram-blue: #50a7ea;
}

.hero-block {
    margin-top: 12px;
}

.hero-block__wrap {
    display: grid;
    grid-template-columns: minmax(0, auto) minmax(0, auto);
    column-gap: 20px;
    place-items: stretch;
}

.hero-block__wrap > *:not(:is(.hero-block__image, .hero-block__content)) {
    grid-column: 1/-1;
}

.hero-block__wrap > p {
    margin-top: 20px;
}

.hero-block__content {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
}

.hero-block__content > * {
    margin: 0;
}

.hero-block__content p:not([class]) {
    color: #e3e3e3;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
}

.hero-block__content strong,
.hero-block__content b,
.hero-block__content span {
    font-weight: 700;
}

.hero-block__title {
    margin: 0;
    color: #fff;
    font-size: 36px;
    font-weight: 900;
    line-height: 130%;
    text-transform: none;
}

.hero-block__title:only-child {
    margin-block: auto;
}

.hero-block-codes {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    padding: 12px;
    border-radius: var(--section-border-radius, 12px);
    border: 1px solid #5c5c5c;
}

.hero-block-codes__title {
    margin: 0;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 30px;
    /* 166.667% */
    display: flex;
}

.hero-block-codes__title::before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    margin-right: 9px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M23.998 6.648c-.008-1.285-.048-2.629-.643-3.799-.73-1.434-2.13-2.414-3.701-2.697-.99-.178-2.014-.15-3.016-.15H7.366c-1.004 0-2.024-.028-3.016.15C2.772.436 1.38 1.412.649 2.85.164 3.8.045 4.872.016 5.924L.004 16.491c0 1.05-.035 2.123.15 3.16.28 1.561 1.278 2.98 2.698 3.702 1.433.73 3.097.645 4.658.645h8.983c1.542 0 3.234.08 4.658-.645 1.423-.724 2.415-2.132 2.697-3.702.177-.984.15-1.995.15-2.99zm-3.13 2.956c-.033.157-.168.295-.288.392q-.321.26-.654.503l-4.198 3.05 1.603 4.935q.128.393.234.791c.05.193.1.541-.142.63-.178.064-.4-.034-.547-.13q-.347-.224-.68-.467l-4.198-3.05-4.198 3.05q-.335.242-.68.467c-.13.084-.304.171-.463.158a.28.28 0 0 1-.234-.17c-.062-.149-.033-.338.007-.489q.106-.4.234-.79l1.603-4.936-4.198-3.05a15 15 0 0 1-.654-.503c-.121-.095-.258-.236-.295-.39a.28.28 0 0 1 .089-.275c.123-.105.312-.136.468-.144q.413-.022.825-.022H9.69l1.604-4.935q.127-.392.276-.778c.056-.144.145-.317.28-.4a.28.28 0 0 1 .29 0c.138.084.225.255.28.4q.15.385.277.778l1.604 4.935h5.189q.413 0 .825.022c.155.008.346.04.468.144a.27.27 0 0 1 .085.274" fill="%234CAF50"/></svg>') 100%/contain no-repeat;
}

.hero-block-codes__slider {
    margin-top: 16px;
}

.hero-block-codes__list {
    margin: 0;
}

.hero-block-codes .swiper-slide {
    height: unset !important;
}

.hero-block-codes .swiper-slide:only-child {
    width: calc(100% - 8px) !important;
}

.hero-block-codes .swiper-grid-column > .swiper-wrapper {
    display: grid;
    grid-template-rows: 1fr 1fr;
    grid-auto-flow: column;
}

.hero-block-codes .swiper-pagination {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 7px;
}

.hero-block-codes .swiper-pagination.swiper-pagination-lock {
    display: none;
}

.hero-block-codes .swiper-pagination .swiper-pagination-bullet {
    width: 10px !important;
    height: 10px !important;
    border: none !important;
    background: #282828 !important;
    opacity: 1 !important;
    margin: 0 !important;
    transition: background 0.3s;
}

.hero-block-codes .swiper-pagination .swiper-pagination-bullet:hover {
    background: #7a7a7a !important;
}

.hero-block-codes .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #7a7a7a !important;
}

.hero-block-codes__item {
    height: 100%;
    padding: 12px;
    border-radius: var(--section-border-radius, 12px);
    background: #282828;
    display: grid;
    grid-template-columns: 50px 1fr;
    grid-template-rows: auto 1fr;
    column-gap: 8px;
    row-gap: 13px;
}

.hero-block-codes__item > .get-image,
.hero-block-codes__item > img {
    align-self: center;
}

.hero-block-codes__text {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
}

.hero-block-codes__promo {
    margin-top: auto;
    position: relative;
    min-height: 44px;
    grid-column: 1/-1;
    border-radius: 8px;
    border: 1px dashed #fff;
    padding: 4px 4px 4px 12px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.hero-block-codes__promo-text {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    margin: 0;
}

.hero-block-codes__promo > .btn {
    padding: 6px 24px;
    align-self: stretch;
}

.hero-block-codes__promo.copied > .btn {
    position: absolute;
    top: 4px;
    left: 4px;
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    opacity: 1;
    pointer-events: none;
}

.hero-block-codes__promo.copied .hero-block-codes__promo-copy-text {
    opacity: 0;
}

.hero-block-codes__btn {
    width: clamp(100px, 272px, 100%);
    margin-top: 16px;
    margin-inline: auto;
}

.loading-screen {
    display: none;
    position: relative;
    position: fixed;
    inset: 0;
    max-width: 100vw;
    margin: 0 !important;
    background: linear-gradient(19deg, #5190c5 12.34%, #72b3e3 102.69%), #3e3e3e;
    align-items: center;
    justify-content: center;
    z-index: 999;
}

.loading-screen._active {
    display: flex;
}

.loading-screen__wrap {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 328px;
    max-height: 100%;
    overflow-y: auto;
    padding-block: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 48px;
}

.loading-screen__clouds {
    position: absolute;
    bottom: -30vw;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 100vh;
    z-index: 0;
}

.loading-screen__cloud {
    width: 100%;
    position: absolute;
    z-index: 0;
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
}

.loading-screen__cloud:nth-child(1) {
    bottom: 54vw;
    aspect-ratio: 1440/312;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="312" viewBox="0 0 1440 312" fill="none"><path opacity="0.61" d="M1439.91 311.865V21.5953C1386.38 35.733 1343.14 75.2092 1323.84 126.462C1308.27 98.4457 1278.35 79.4707 1244.03 79.4707C1217.65 79.4707 1193.93 90.6714 1177.26 108.524C1152.38 45.0046 1090.59 0 1018.26 0C926.29 0 851.34 72.7329 847.683 163.807C842.212 162.569 836.511 161.878 830.666 161.878C804.176 161.878 780.853 175.354 767.147 195.826C752.347 146.618 706.709 110.769 652.692 110.769C613.734 110.769 579.153 129.399 557.327 158.25C543.449 99.1368 490.411 55.1112 427.065 55.1112C359.889 55.1112 304.288 104.608 294.671 169.106C280.764 150.274 258.42 138.037 233.197 138.037C212.033 138.037 192.856 146.646 179.035 160.583C170.369 116.787 131.756 83.7609 85.4271 83.7609C69.2162 83.7609 53.9268 87.8209 40.5665 94.9617C41.1136 91.3049 41.4015 87.5617 41.4015 83.7609C41.4015 54.2474 24.6436 28.6497 0.111328 15.9229V311.865H1440H1439.91Z" fill="%2372B3E3"/></svg>');
}

.loading-screen__cloud:nth-child(2) {
    bottom: 40vw;
    aspect-ratio: 1440/439;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="439" viewBox="0 0 1440 439" fill="none"><path d="M1439.92 438.528V207.602a121.8 121.8 0 0 0-50.42-10.884c-31.13 0-59.55 11.661-81.14 30.809-18.8-74.633-86.35-129.917-166.83-129.917-38.36 0-73.8 12.583-102.39 33.804.17-2.707.31-5.442.31-8.206 0-67.55-54.762-122.316-122.312-122.316S794.822 55.657 794.822 123.208c0 13.36 2.188 26.231 6.133 38.266-20.904-16.671-47.395-26.691-76.217-26.691-45.408 0-84.999 24.762-106.105 61.503-14.714-13.562-34.38-21.854-55.975-21.854-19.666 0-37.749 6.881-51.944 18.37-21.538-34.725-59.977-57.847-103.83-57.847-58.451 0-107.257 41.06-119.264 95.912-31.557-38.555-79.499-63.173-133.199-63.173-67.78 0-126.405 39.217-154.421 96.2v174.634z" fill="%237AB8E5"/></svg>');
}

.loading-screen__cloud:nth-child(3) {
    bottom: 30vw;
    aspect-ratio: 1440/392;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="392" viewBox="0 0 1440 392" fill="none"><path d="M1439.92 392.226V62.423c-60.47 29.168-104.01 87.821-111.98 157.3-23.93-30.118-60.87-49.467-102.34-49.467-41.46 0-79.21 19.781-103.11 50.475-22.69-47.855-71.43-80.939-127.898-80.939h-.288c.173-2.793.288-5.586.288-8.437C994.592 59.198 936.083.689 863.926.689s-129.111 57.012-130.58 127.873c-36.654-40.916-89.865-66.686-149.122-66.686-77.686 0-144.977 44.285-178.147 108.984-17.478-16.211-40.858-26.116-66.571-26.116-22.661 0-43.536 7.717-60.121 20.646-21.193-43.565-65.852-73.568-117.536-73.568-25.569 0-49.41 7.37-69.566 20.069C84.71 61.301 48.143 20.211.057 6.045v386.181H1439.94z" fill="%2382BCE7"/></svg>');
}

.loading-screen__cloud:nth-child(4) {
    bottom: 15vw;
    aspect-ratio: 1440/409;
    background-image: url('data:image/svg+xml,<svg width="1440" height="409" viewBox="0 0 1440 409" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1439.92 408.093V84.02a95.7 95.7 0 0 0-17.6-1.641c-46.18 0-84.65 32.94-93.26 76.591-17.33-18.284-41.81-29.686-68.99-29.686-19.18 0-37 5.701-51.94 15.462-14.83-64.037-72.19-111.777-140.75-111.777-48.05 0-90.611 23.467-116.87 59.574C934.673 39.044 885.177.03 826.552.03c-69.939 0-126.865 55.514-129.168 124.878-15.693-11.431-34.985-18.169-55.889-18.169-36.827 0-68.759 20.962-84.538 51.599-26.519-31.529-66.226-51.599-110.654-51.599a144.2 144.2 0 0 0-51.858 9.617c1.555-6.852 2.419-13.964 2.419-21.278C396.864 42.586 354.307 0 301.787 0c-40.052 0-74.288 24.763-88.282 59.805C187.246 23.582 144.631 0 96.459 0 59.373 0 25.569 13.965 0 36.942v371.18h1439.89z" fill="%238EC2E9"/></svg>');
}

.loading-screen__cloud:nth-child(5) {
    bottom: 5vw;
    aspect-ratio: 1440/363;
    background-image: url('data:image/svg+xml,<svg width="1440" height="363" viewBox="0 0 1440 363" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1439.83 362.945V39.735c-61.13 7.256-114.17 40.887-147.42 89.174-17.65-8.983-37.64-14.08-58.8-14.08-49.18 0-92 27.354-114.02 67.666-16.04-16.211-38.3-26.26-62.92-26.26a88.3 88.3 0 0 0-29.43 5.039 129.6 129.6 0 0 0 3.86-31.414C1031.1 58.134 972.969 0 901.243 0c-58.364 0-107.717 38.497-124.1 91.478-15.434-13.102-35.417-21.02-57.242-21.02-35.014 0-65.276 20.329-79.615 49.842-23.784-30.348-60.726-49.842-102.247-49.842-67.55 0-123.035 51.57-129.255 117.507-38.353-44.947-95.364-73.481-159.085-73.481-45.782 0-88.08 14.742-122.517 39.706C115.002 95.106 62.684 50.648 0 50.648v312.354h1439.89z" fill="%239DCBEC"/></svg>');
}

.loading-screen__cloud:nth-child(6) {
    bottom: 0vw;
    aspect-ratio: 1440/350;
    background-image: url('data:image/svg+xml,<svg width="1440" height="350" viewBox="0 0 1440 350" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1439.86 349.585V0c-35.5 18.4-59.81 55.486-59.81 98.244 0 5.5.41 10.913 1.18 16.211-19.37-10.337-41.49-16.21-64.98-16.21-67.12 0-123.01 47.826-135.56 111.229-20.04-20.155-47.77-32.623-78.44-32.623-36.51 0-68.87 17.708-89.03 44.976-13.905-93.407-94.441-165.075-191.706-165.075-91.737 0-168.559 63.75-188.657 149.353-31.615-41.75-81.688-68.759-138.094-68.759-78.233 0-144.315 51.915-165.766 123.18-19.839-29.629-53.614-49.151-91.967-49.151-17.996 0-34.984 4.319-50.015 11.949-20.818-72.243-87.36-125.08-166.312-125.08-7.026 0-13.908.46-20.703 1.267v250.074h1439.89z" fill="%23A6CFEE"/></svg>');
}

/* Modal Tg*/

.modal-tg {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    background: rgba(40, 40, 40, 0.7);
}

.modal-tg:not(.is-active) {
    display: none;
}

.modal-tg .modal-tg__content {
    position: relative;
    width: 100%;
    max-width: 328px;
    max-height: 100%;
    border-radius: 8px;
    overflow-y: auto;
    margin: auto;
    background-color: #50a7ea;
    background-image: url("../images/modal-tg-background.webp");
    background-repeat: no-repeat;
    background-position: center bottom;
}

@supports not selector(::-webkit-scrollbar) {
    .modal-tg .modal-tg__content {
        scrollbar-width: thin;
        scrollbar-color: #fff transparent;
    }
}

.modal-tg .modal-tg__content::-webkit-scrollbar {
    width: 5px;
}

.modal-tg .modal-tg__content::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background: #fff;
}

.modal-tg .modal-tg__content::-webkit-scrollbar-track {
    background: transparent;
    border-radius: 9px;
}

.modal-tg .modal-tg__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 26px;
    height: 26px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    border-radius: 50%;
    transition-property: background;
    transition-duration: 0.3s;
    transition-timing-function: ease-in-out;
    transition-delay: 0s;
    cursor: pointer;
}

.modal-tg .modal-tg__close::before {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26" fill="none"><path d="M19.19 19.19 6.808 6.81m12.38 0L6.81 19.19" stroke="%23fff" stroke-width="1.238" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    width: 26px;
    height: 26px;
    max-width: 100%;
    max-height: 100%;
}

.predictor-game {
    --delay: 10000;
    --start-color: #4ca0d1;
    --finish-color: #6921b9;
    --middle-color: #b921b1;
    --current-color: var(--start-color);
    --left-plane-final-position: 70%;
    --bottom-plane-final-position: 20%;
    --plane-width: 150px;
    --plane-height: 75px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    border-radius: var(--section-border-radius, 12px);
    background: #000;
    padding: 17px 17px 0;
    max-width: calc(var(--width-container) - var(--offsets) * 2);
}

.predictor-game:not(:first-child) {
    margin-top: 20px;
}

.predictor-game[data-phase=waiting] .predictor-game__progress-bar {
    animation: loadingBar linear forwards;
    animation-duration: calc(var(--delay) * 1ms);
}

.predictor-game[data-phase=waiting] .predictor-game__score,
.predictor-game[data-phase=waiting] .predictor-game__highlight {
    display: none;
}

.predictor-game[data-phase=waiting] .predictor-game__preloader {
    display: flex;
}

.predictor-game[data-phase=playing] .predictor-game__score,
.predictor-game[data-phase=finish] .predictor-game__score {
    display: block;
}

.predictor-game[data-phase=playing] .predictor-game__sun,
.predictor-game[data-phase=finish] .predictor-game__sun {
    animation-play-state: running;
}

.predictor-game[data-phase=playing] .predictor-game__highlight,
.predictor-game[data-phase=finish] .predictor-game__highlight {
    animation: animHighlightStart 3s 6s ease forwards, animHighlight 3s 9s ease infinite alternate;
}

.predictor-game[data-phase=playing] .predictor-game__preloader,
.predictor-game[data-phase=finish] .predictor-game__preloader {
    display: none;
}

.predictor-game[data-phase=playing] .predictor-game__controller,
.predictor-game[data-phase=finish] .predictor-game__controller {
    pointer-events: none;
}

.predictor-game[data-phase=playing] .predictor-game__controller .predictor-game__controller-value,
.predictor-game[data-phase=finish] .predictor-game__controller .predictor-game__controller-value {
    color: #767981;
}

.predictor-game[data-phase=playing] .predictor-game__plane {
    animation: planeStart 5s ease-out forwards, planeFlying 2s 5s ease-in-out infinite alternate forwards, planeAnim 0.38s steps(3) infinite;
}

.predictor-game[data-phase=finish] .predictor-game__score {
    color: #c4002d;
}

.predictor-game[data-phase=finish] .predictor-game__highlight {
    opacity: 0;
}

.predictor-game[data-phase=finish] .predictor-game__plane {
    animation: planeFinish 1s ease forwards, planeAnim 0.38s steps(3) infinite;
}

.predictor-game__main {
    position: relative;
    width: 100%;
    height: 526px;
    border-radius: var(--section-border-radius, 12px);
    border: 1px solid #2a2b2e;
    background: #000;
    overflow: hidden;
}

.predictor-game__sun {
    position: absolute;
    z-index: 0;
    left: -1370px;
    bottom: -1380px;
    width: 2760px;
    height: 2760px;
    background: url("../images/svg/predictor-game-sun.svg") center/contain no-repeat;
    animation: predictorRotateAnim 60s linear infinite;
    animation-play-state: paused;
}

.predictor-game__preloader,
.predictor-game__score,
.predictor-game__highlight {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 100%;
    max-height: 100%;
}

.predictor-game__propeller {
    width: 120px;
    height: 120px;
    display: block;
    background: url("../images/svg/propeller.svg") center/contain no-repeat;
    margin: 4px;
    animation: predictorRotateAnim 2s linear infinite;
}

.predictor-game__preloader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    z-index: 2;
    top: 50%;
}

.predictor-game__preloader-text {
    color: #fff;
    text-align: center;
    font-size: 36px;
    font-weight: 400;
    line-height: 1.16;
}

.predictor-game__preloader-rate {
    padding: 5px 6px;
    border-radius: 5px;
    background: var(--red, #c4002d);
    color: #fff;
    text-align: center;
    font-size: 36px;
    font-weight: 400;
    line-height: 36px;
    text-transform: uppercase;
}

.predictor-game__score {
    color: #fff;
    text-align: center;
    font-size: 120px;
    font-weight: 800;
    line-height: 1;
    z-index: 2;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    transition: all 0.3s ease;
}

.predictor-game__score.hiding {
    display: none;
}

.predictor-game__score.hiding + .predictor-game__hightlight {
    display: none;
}

.predictor-game__highlight {
    z-index: 0;
    width: 200px;
    height: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 150px 86px currentColor;
    color: var(--start-color);
    transition: color 1s ease, opacity 0.3s ease;
}

.predictor-game__cashout {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    padding: 12px 16px;
    border-radius: var(--section-border-radius, 12px);
    border: 1px solid var(--green, #4caf50);
    background: #282828;
    width: clamp(200px, 491px, 100% - 24px);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    opacity: 0;
}

.predictor-game__cashout.active {
    opacity: 1;
    top: 32px;
    transition: all 0.3s;
}

.predictor-game__cashout-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
    text-align: center;
}

.predictor-game__cashout-rate {
    padding: 2px 10px;
    border-radius: 5px;
    background: var(--green, #4caf50);
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    line-height: 120%;
}

.predictor-game__cashout-btn {
    padding: 12px;
    width: 262px;
    min-height: 57px;
}

.predictor-game__progress {
    position: relative;
    width: 266px;
    height: 10px;
    border-radius: 20px;
    background: #1b1c1d;
}

.predictor-game__progress.hiding {
    display: none;
}

.predictor-game__progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: #c4002d;
    border-radius: 20px;
}

.predictor-game__plane {
    position: absolute;
    z-index: 1;
    left: 10px;
    bottom: 30px;
    z-index: 1;
    width: var(--plane-width, 150px);
    height: var(--plane-height, 75px);
    background: url("../images/svg/plane-fill.svg") 0 0/auto 100% no-repeat;
    animation: planeAnim 0.38s steps(3) infinite;
}

.predictor-game__controls {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    gap: 10px;
    width: calc(100% + 34px);
    margin-left: -17px;
    margin-top: 17px;
}

.predictor-game__controls-item {
    flex: 1;
    border-radius: 10px;
    background: #1b1c1d;
    padding: 13px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 31px;
    overflow: hidden;
}

.predictor-game__controls-item:not(:first-child),
.predictor-game__controls-item.disabled {
    pointer-events: none;
    position: relative;
}

.predictor-game__controls-item:not(:first-child)::after,
.predictor-game__controls-item.disabled::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.4);
}

.predictor-game__controls-item:not(:first-child) .predictor-game__controller-value,
.predictor-game__controls-item.disabled .predictor-game__controller-value {
    color: #767981;
}

.predictor-game__controllers {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 5px;
    width: clamp(100px, 150px, 100%);
}

.predictor-game__controller {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-radius: 22px;
    border: 1px solid #333;
    background: rgba(0, 0, 0, 0.7);
    padding: 5px 11px;
    min-height: 34px;
}

.predictor-game__controller-btn {
    position: relative;
    min-width: 18px;
    min-height: 18px;
    border: 1px solid #767981;
    border-radius: 50%;
    background: transparent;
    transition: border-color 0.3s ease;
    cursor: pointer;
}

.predictor-game__controller-btn::before,
.predictor-game__controller-btn::after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transform-origin: center center;
    width: 11px;
    height: 2px;
    border-radius: 2px;
    background: #767981;
    transition: background 0.3s ease;
}

.predictor-game__controller-btn--minus::before {
    content: "";
}

.predictor-game__controller-btn--plus::before,
.predictor-game__controller-btn--plus::after {
    content: "";
}

.predictor-game__controller-btn--plus::after {
    transform: translate(-50%, -50%) rotate(-90deg);
}

.predictor-game__controller-value {
    min-width: 0;
    background: transparent;
    border: 0;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 22px;
    text-align: center;
    font-family: "Roboto_Condensed";
}

.predictor-game__bet {
    padding: 10px;
    border-radius: 20px;
    border: 1px solid #b2f2a3;
    background: #28a909;
    width: clamp(100px, 200px, 100%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-family: "Roboto_Condensed";
    color: #fff;
    text-align: center;
    text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
    font-size: 20px;
    font-weight: 400;
    line-height: 1.2;
    text-transform: uppercase;
    cursor: pointer;
    transition: filter 0.3s ease;
}

.predictor-game__bet.cashout {
    background: #d07206;
    border-color: #ffbd71;
}

.predictor-game__bet-info {
    font-family: "Roboto_Condensed";
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.predictor-game__bet-value {
    font-family: "Roboto_Condensed";
    font-size: 24px;
}

.predictor-game__bet-currency {
    font-family: "Roboto_Condensed";
    font-size: 18px;
    line-height: 1;
    margin-top: 4px;
}

@keyframes predictorRotateAnim {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes planeAnim {
    to {
        background-position-x: calc(var(--plane-width) * -3);
    }
}

@keyframes loadingBar {
    from {
        width: 0%;
    }

    to {
        width: 100%;
    }
}

@keyframes animHighlightStart {
    0% {
        color: var(--start-color);
    }

    100% {
        color: var(--finish-color);
    }
}

@keyframes animHighlight {
    0% {
        color: var(--finish-color);
    }

    100% {
        color: var(--middle-color);
    }
}

@keyframes planeStart {
    to {
        left: var(--left-plane-final-position);
        bottom: calc(var(--bottom-plane-final-position) + 20%);
    }
}

@keyframes planeFlying {
    0% {
        bottom: calc(var(--bottom-plane-final-position) + 20%);
    }

    100% {
        bottom: var(--bottom-plane-final-position);
    }
}

@keyframes planeFinish {
    from {
        left: var(--left-plane-final-position);
        bottom: calc(var(--bottom-plane-final-position) + 10%);
    }

    to {
        left: 200%;
        bottom: 80%;
    }
}

/* PROMOCODE */

/* TABS */

.tabs--vertical .tabs__header-item {
    border-bottom: none;
}

.banner-card {
    border-radius: var(--section-border-radius, 12px);
    padding: 32px;
    display: grid;
    column-gap: 24px;
}

.banner-card__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 12px;
}

.banner-card__name,
.banner-card__descr {
    color: #fff;
    margin: 0;
}

.banner-card__name {
    font-size: 25px;
    font-weight: 700;
    line-height: 116%;
    text-transform: uppercase;
}

.banner-card__descr {
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
}

.banner-card__tg {
    margin: 0;
    border-radius: 40px;
    padding: 3px 24px;
    color: var(--telegram-blue, #50a7ea);
    border: 1px solid currentColor;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
}

.banner-card img {
    max-width: 124px;
    max-height: 124px;
}

.banner-card.banner-card--tg img {
    order: -1;
}

.banner-card .btn {
    margin-top: auto;
    margin-inline: auto;
    width: 100%;
    height: max-content;
    grid-column: 1/-1;
}

.banner-card--predictor {
    flex: 1.18;
    grid-template-columns: 1fr auto;
    row-gap: 28px;
    background: linear-gradient(rgba(196, 0, 45, 0.35), rgba(196, 0, 45, 0.35)), url(../images/page-banners-predictor-bg.webp) 50%/cover no-repeat;
    background-blend-mode: color-dodge;
}

.banner-card--tg {
    flex: 1;
    grid-template-columns: auto 1fr;
    row-gap: 24px;
    background: #3e3e3e;
}

.banner-card--tg .banner-card__content {
    justify-content: center;
}

.banner-card--white {
    width: 328px;
    max-width: 100%;
}

.banner-card--white .banner-card__content {
    gap: 10px;
}

.banner-card--white .banner-card__descr {
    margin-top: 4px;
}

.banner-card--white,
.banner-card--modal {
    background: #fff;
    grid-template-columns: 1fr;
    padding: 32px 26px;
    grid-template-columns: 1fr;
}

.banner-card--white img,
.banner-card--white .get-image,
.banner-card--modal img,
.banner-card--modal .get-image {
    place-self: center;
}

.banner-card--white .banner-card__content,
.banner-card--modal .banner-card__content {
    align-items: center;
}

.banner-card--white .banner-card__name,
.banner-card--white .banner-card__descr,
.banner-card--modal .banner-card__name,
.banner-card--modal .banner-card__descr {
    text-align: center;
}

.banner-card--white .banner-card__name,
.banner-card--white .banner-card__descr,
.banner-card--modal .banner-card__name,
.banner-card--modal .banner-card__descr {
    color: #282828;
}

.banner-card--white .banner-card__info,
.banner-card--modal .banner-card__info {
    margin: 0;
    color: #000;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
}

.banner-card--white .btn,
.banner-card--modal .btn {
    width: clamp(212px, 212px, 100%);
}

.banner-card--modal {
    background: transparent;
}

.banner-card--modal .banner-card__name,
.banner-card--modal .banner-card__descr,
.banner-card--modal .banner-card__info {
    color: #fff;
}

.banner-card--modal .banner-card__info {
    font-size: 20px;
    font-weight: 600;
    line-height: 115%;
}

.banner-card--modal .banner-card__tg {
    color: #fff;
}

.benefits-block {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    list-style-type: none;
}

.benefits-block__item {
    position: relative;
    padding: 16px 62px 16px 16px;
    border-radius: 5px;
    background: var(--section-bg, #3e3e3e);
    overflow: hidden;
}

.benefits-block__item-title,
.benefits-block__item-text {
    margin: 0;
    color: #fff;
}

.benefits-block__item-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 110%;
}

.benefits-block__item-text {
    margin-top: 12px;
    font-size: 16px;
    font-weight: 400;
    line-height: 120%;
}

.benefits-block__item svg {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 16px;
    right: 16px;
    border-radius: 5px;
    padding: 8px;
    background-color: var(--green, #4caf50);
}

.benefits-block__item::before {
    content: "";
    position: absolute;
    z-index: 0;
    opacity: 0.1;
    top: 12px;
    right: -25px;
    transform-origin: top right;
    transform: scale(6.9583333333);
}

.benefits-block__item--place::before {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M18 6c0-3.309-2.691-6-6-6S6 2.691 6 6a6.01 6.01 0 0 0 5 5.916V23a1 1 0 0 0 2 0V11.916A6.01 6.01 0 0 0 18 6" fill="%23fff"/></svg>');
}

.benefits-block__item--performance::before {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M11.24 24a2.3 2.3 0 0 1-.948-.212 2.18 2.18 0 0 1-1.2-2.622L10.653 16H6.975A3 3 0 0 1 4.1 12.131l3.024-10A2.98 2.98 0 0 1 10 0h3.693a2.6 2.6 0 0 1 2.433 3.511L14.443 8H17a3 3 0 0 1 2.483 4.684l-6.4 10.3A2.2 2.2 0 0 1 11.24 24" fill="%23fff"/></svg>');
}

.benefits-block__item--bonuses::before {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M20.5 5.00021H18.565C18.766 4.64221 18.907 4.25021 18.966 3.83121C19.093 2.94321 18.866 2.06021 18.329 1.34321C17.791 0.625214 17.006 0.160213 16.118 0.0332135C15.233 -0.0917865 14.347 0.133213 13.63 0.670213C12.934 1.19221 12.404 1.86621 12 2.55221C11.596 1.86721 11.066 1.19221 10.37 0.671213C9.653 0.133213 8.769 -0.0907865 7.882 0.0342135C6.994 0.161213 6.209 0.626214 5.672 1.34321C5.134 2.06021 4.907 2.94421 5.034 3.83121C5.094 4.25021 5.234 4.64421 5.433 5.00021H3.5C1.57 5.00021 0 6.57021 0 8.50021V9.00021C0 10.1032 0.897 11.0002 2 11.0002H22C23.103 11.0002 24 10.1032 24 9.00021V8.50021C24 6.57021 22.43 5.00021 20.5 5.00021ZM14.829 2.27121C15.118 2.05421 15.477 1.96121 15.835 2.01421C16.193 2.06521 16.511 2.25321 16.729 2.54321C16.947 2.83321 17.038 3.19021 16.987 3.54821C16.936 3.90721 16.748 4.22421 16.426 4.46621C16.389 4.49521 16.056 4.74421 15.408 4.99921H13.1C13.322 4.24221 13.85 3.00521 14.83 2.27021L14.829 2.27121ZM7.542 4.44221C7.253 4.22421 7.064 3.90721 7.014 3.54821C6.963 3.19021 7.054 2.83321 7.273 2.54221C7.49 2.25221 7.807 2.06421 8.166 2.01321C8.52 1.96121 8.882 2.05321 9.172 2.27121C10.152 3.00621 10.679 4.24221 10.902 5.00021H8.594C7.946 4.74521 7.61 4.49421 7.544 4.44221H7.542ZM13.324 17.6452C13.031 17.3962 12.924 16.9912 13.057 16.6302C13.189 16.2692 13.533 16.0292 13.917 16.0292H16.668L17.642 13.2972C17.775 12.9382 18.118 12.7002 18.501 12.7002C18.884 12.7002 19.227 12.9382 19.36 13.2972L20.334 16.0292H23.085C23.47 16.0292 23.814 16.2702 23.946 16.6312C24.078 16.9932 23.97 17.3992 23.675 17.6472L21.506 19.4142L22.403 22.1462C22.526 22.5162 22.401 22.9232 22.092 23.1602C21.783 23.3972 21.358 23.4142 21.032 23.2022L18.508 21.5582L16.026 23.2192C15.872 23.3222 15.694 23.3742 15.516 23.3742C15.322 23.3742 15.129 23.3132 14.966 23.1912C14.654 22.9582 14.525 22.5532 14.641 22.1822L15.503 19.4172L13.324 17.6442V17.6452ZM13.049 24.0002H7C4.239 24.0002 2 21.7612 2 19.0002V13.0002H15.624L15.257 14.0292H13.917C12.697 14.0292 11.597 14.7992 11.18 15.9392C10.759 17.0822 11.1 18.3802 12.062 19.1972L13.191 20.1152L12.733 21.5852C12.473 22.4142 12.609 23.2932 13.049 24.0002Z" fill="white"/></svg>');
}

.benefits-block__item--support::before {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M24 15.9997V20.9997C24 22.6567 22.657 23.9997 21 23.9997H16C13.045 23.9997 10.465 22.3847 9.08 19.9957L9.12 19.9557C10.924 19.8177 12.619 19.3047 14.112 18.5007L16.086 20.4147C16.478 20.8067 16.991 21.0007 17.504 21.0007C18.013 21.0007 18.521 20.8097 18.903 20.4257L21.696 17.7187C22.092 17.3347 22.102 16.7007 21.717 16.3047C21.332 15.9087 20.699 15.8997 20.303 16.2837L17.489 18.9907L15.827 17.3797C18.187 15.5267 19.757 12.8367 19.972 9.79374C19.989 9.55974 19.982 9.32774 19.984 9.09474L19.997 9.08174C22.386 10.4667 24.001 13.0467 24.001 16.0017L24 15.9997ZM8.138 17.9997H3.661C1.642 17.9997 0 16.3547 0 14.3337V9.29574C0 4.58874 3.823 0.342739 8.349 0.0227394C10.964 -0.167261 13.519 0.791739 15.363 2.63474C17.207 4.47774 18.161 7.03674 17.976 9.65074C17.646 14.3327 13.325 17.9997 8.138 17.9997ZM10.25 13.2497C10.25 12.5597 9.69 11.9997 9 11.9997C8.31 11.9997 7.75 12.5597 7.75 13.2497C7.75 13.9397 8.31 14.4997 9 14.4997C9.69 14.4997 10.25 13.9397 10.25 13.2497ZM11.953 6.46474C11.74 5.25274 10.745 4.25874 9.536 4.04774C8.65 3.88674 7.753 4.12874 7.073 4.70074C6.391 5.27274 6.001 6.11074 6.001 6.99974C6.001 7.55274 6.449 7.99974 7.001 7.99974C7.553 7.99974 8.001 7.55274 8.001 6.99974C8.001 6.70274 8.131 6.42374 8.359 6.23274C8.589 6.03974 8.885 5.96174 9.191 6.01674C9.582 6.08474 9.916 6.41774 9.984 6.80974C10.077 7.34074 9.772 7.71674 9.482 7.87574C9.039 8.11974 8.001 8.69074 8.001 9.99874C8.001 10.5517 8.449 10.9987 9.001 10.9987C9.553 10.9987 10.001 10.5517 10.001 9.99874C10.001 9.94574 10.001 9.87374 10.448 9.62774C11.572 9.00674 12.177 7.73574 11.954 6.46374L11.953 6.46474Z" fill="white"/></svg>');
}

.casino-listing {
    width: 100%;
}

.casino-listing:not(:first-child) .casino-listing__title:first-child {
    margin-top: 20px;
}

.casino-listing:not(:first-child) .casino-listing__table:first-child {
    margin-top: 26px;
}

.casino-listing__title {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #e3e3e3;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    line-height: 150%;
    margin: 0;
    margin-bottom: 12px;
}

.casino-listing__title::before,
.casino-listing__title::after {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="25" height="24" viewBox="0 0 25 24" fill="none"><path d="M12.5 4v12m-5-5 5 5 5-5" stroke="%23FFBA00" stroke-width="2"/></svg>');
    display: block;
    width: 25px;
    height: 24px;
}

.casino-listing__list {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 16px;
}

.casino-listing__table {
    width: 100%;
}

.casino-listing__table tr {
    display: flex;
    flex-direction: stretch;
}

.casino-listing__table tr:nth-child(-n+3) .casino-listing__item {
    border: 1px solid transparent;
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(#464646, #464646), linear-gradient(146deg, #e4b431 0%, #ffe59d 25%, #b58d21 53%, #ffe08d 76%, #886811 100%);
}

.casino-listing__table tr:nth-child(1) .casino-listing__item {
    box-shadow: 0px 0px 20px 0px rgba(229, 182, 54, 0.2);
}

.casino-listing__table tr:nth-child(1) .casino-listing__place {
    background: linear-gradient(146deg, #e4b431 0%, #ffe59d 25%, #b58d21 53%, #ffe08d 76%, #886811 100%);
}

.casino-listing__table tr:nth-child(2) .casino-listing__item {
    box-shadow: 0px 0px 20px 0px rgba(255, 255, 255, 0.2);
    background-image: linear-gradient(#464646, #464646), linear-gradient(146deg, #dcdcdc 0%, #f9f9f9 25%, #d7d7d7 53%, #fff 76%, #cfcfcf 100%);
}

.casino-listing__table tr:nth-child(2) .casino-listing__place {
    background: linear-gradient(146deg, #b5b5b5 0%, #e7e7e7 25%, #949494 53%, #c0c0c0 76%, #cfcfcf 100%);
}

.casino-listing__table tr:nth-child(3) .casino-listing__item {
    box-shadow: 0px 0px 20px 0px rgba(250, 167, 71, 0.2);
    background-image: linear-gradient(#464646, #464646), linear-gradient(146deg, #ac6f29 0%, #ffb120 25%, #b97b25 53%, #ffa454 76%, #a96e1c 100%);
}

.casino-listing__table tr:nth-child(3) .casino-listing__place {
    background: linear-gradient(146deg, #ac6f29 0%, #ffb120 25%, #b97b25 53%, #ffa454 76%, #a96e1c 100%);
}

.casino-listing__item {
    width: 100%;
    position: relative;
    display: grid;
    grid-template-columns: 200px 139px 1fr 200px;
    place-items: flex-start;
    gap: 20px;
    padding: 20px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.1);
    box-shadow: 4px 4px 16px 0px rgba(0, 0, 0, 0.32);
}

.casino-listing__img {
    display: flex;
    border-radius: 4px;
    overflow: hidden;
    max-width: 100%;
}

.casino-listing__img img {
    max-width: 100%;
}

.casino-listing__info {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    flex-wrap: wrap;
}

.casino-listing__place {
    border-radius: 3px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 24px;
    background: #ffba00;
    margin: 0;
    padding: 4px;
    text-align: center;
    color: var(--white, #fff);
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
}

.casino-listing__name {
    margin: 0;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    text-transform: uppercase;
}

.casino-listing__rate {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 5px;
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    --percent: calc(var(--rating, 4.5) / 5 * 100%);
}

.casino-listing__rate::after {
    content: "★★★★★";
    display: block;
    font-size: 21px;
    line-height: 19px;
    height: 21px;
    letter-spacing: 0px;
    font-weight: 300;
    background: linear-gradient(90deg, #ffba00 var(--percent), #8d8d8d var(--percent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.casino-listing__btns {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 8px;
    grid-column: -2/-1;
}

.casino-listing__btns .btn {
    width: 100%;
    color: #fff;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    text-transform: uppercase;
}

.listing-bonus {
    position: relative;
    width: 100%;
    padding: 12px;
    border-radius: 4px;
    background: #282828;
    display: grid;
    grid-template-columns: 40px 1fr 1.2fr;
    row-gap: 12px;
}

.listing-bonus::before {
    content: url('data:image/svg+xml,<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="40" height="40" rx="5" fill="%23FFBA00"/><path d="M28.5 13H26.565C26.766 12.642 26.907 12.25 26.966 11.831C27.093 10.943 26.866 10.06 26.329 9.34303C25.791 8.62503 25.006 8.16003 24.118 8.03303C23.233 7.90803 22.347 8.13303 21.63 8.67003C20.934 9.19203 20.404 9.86603 20 10.552C19.596 9.86703 19.066 9.19203 18.37 8.67103C17.653 8.13303 16.769 7.90903 15.882 8.03403C14.994 8.16103 14.209 8.62603 13.672 9.34303C13.134 10.06 12.907 10.944 13.034 11.831C13.094 12.25 13.234 12.644 13.433 13H11.5C9.57 13 8 14.57 8 16.5V17C8 18.103 8.897 19 10 19H30C31.103 19 32 18.103 32 17V16.5C32 14.57 30.43 13 28.5 13ZM22.829 10.271C23.118 10.054 23.477 9.96103 23.835 10.014C24.193 10.065 24.511 10.253 24.729 10.543C24.947 10.833 25.038 11.19 24.987 11.548C24.936 11.907 24.748 12.224 24.426 12.466C24.389 12.495 24.056 12.744 23.408 12.999H21.1C21.322 12.242 21.85 11.005 22.83 10.27L22.829 10.271ZM15.542 12.442C15.253 12.224 15.064 11.907 15.014 11.548C14.963 11.19 15.054 10.833 15.273 10.542C15.49 10.252 15.807 10.064 16.166 10.013C16.52 9.96103 16.882 10.053 17.172 10.271C18.152 11.006 18.679 12.242 18.902 13H16.594C15.946 12.745 15.61 12.494 15.544 12.442H15.542ZM21.324 25.645C21.031 25.396 20.924 24.991 21.057 24.63C21.189 24.269 21.533 24.029 21.917 24.029H24.668L25.642 21.297C25.775 20.938 26.118 20.7 26.501 20.7C26.884 20.7 27.227 20.938 27.36 21.297L28.334 24.029H31.085C31.47 24.029 31.814 24.27 31.946 24.631C32.078 24.993 31.97 25.399 31.675 25.647L29.506 27.414L30.403 30.146C30.526 30.516 30.401 30.923 30.092 31.16C29.783 31.397 29.358 31.414 29.032 31.202L26.508 29.558L24.026 31.219C23.872 31.322 23.694 31.374 23.516 31.374C23.322 31.374 23.129 31.313 22.966 31.191C22.654 30.958 22.525 30.553 22.641 30.182L23.503 27.417L21.324 25.644V25.645ZM21.049 32H15C12.239 32 10 29.761 10 27V21H23.624L23.257 22.029H21.917C20.697 22.029 19.597 22.799 19.18 23.939C18.759 25.082 19.1 26.38 20.062 27.197L21.191 28.115L20.733 29.585C20.473 30.414 20.609 31.293 21.049 32Z" fill="white"/></svg>');
    display: block;
    width: 40px;
    height: 40px;
}

.listing-bonus > .btn {
    width: 100%;
    grid-column: 1/-1;
}

.listing-bonus__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 8px;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    line-height: 18px;
    text-transform: uppercase;
    margin: 0;
    margin-inline: 10px 5px;
}

.listing-bonus__text span {
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    text-transform: none;
}

.listing-bonus__winners {
    grid-column: 1/-1;
    grid-row: 1/2;
    order: -1;
    list-style-type: none;
    border-radius: 4px;
    background: #ffba00;
    padding: 4px 8px;
    min-height: 36px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.listing-bonus__winners-wrap {
    flex: 1;
    position: relative;
    align-self: stretch;
    min-height: 28px;
    overflow: hidden;
}

.listing-bonus__winners-list {
    width: calc(100% - 6px);
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 4px;
    position: absolute;
}

.listing-bonus__winners-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    width: 100%;
    flex: 1;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.listing-bonus__winners-item::before {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="25" viewBox="0 0 24 25" fill="none"><path d="M4 22.83a8 8 0 1 1 16 0zm8-9c-3.315 0-6-2.685-6-6s2.685-6 6-6 6 2.685 6 6-2.685 6-6 6" fill="%23fff"/></svg>');
    vertical-align: middle;
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-bottom: 2px;
}

.listing-bonus__winners-content {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.listing-bonus__winners-text,
.listing-bonus__winners-name,
.listing-bonus__winners-sum {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    margin: 0;
}

.listing-bonus__winners-sum {
    margin: 0;
    margin-left: auto;
    padding: 4px 12px;
    border-radius: 40px;
    background: #54bc02;
    color: var(--white, #fff);
    font-weight: 700;
    min-width: max-content;
}

.listing-bonus__promo {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 8px;
    align-self: center;
}

.listing-bonus__promo-text {
    height: max-content;
    margin: 0;
    color: #787878;
    font-size: 15px;
    font-weight: 400;
    line-height: 18px;
}

.listing-bonus__promo-copy {
    align-self: start;
    position: relative;
    width: 100%;
    min-height: 44px;
    border-radius: 8px;
    border: 1px dashed #fff;
    padding: 4px 4px 4px 12px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.listing-bonus__promo-copy.copied .listing-bonus__promo-copy-btn {
    position: absolute;
    top: 4px;
    left: 4px;
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    opacity: 1;
    pointer-events: none;
}

.listing-bonus__promo-copy.copied .listing-bonus__promo-copy-text {
    opacity: 0;
}

.listing-bonus__promo-copy-text {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    margin: 0;
}

.listing-bonus__promo-copy-btn {
    padding: 6px 24px;
    align-self: stretch;
}

.text-image .listing-bonus {
    grid-column: 1/-1;
    grid-template-columns: 1fr 40px;
}

.text-image .listing-bonus::before {
    grid-column: unset;
}

.text-image .listing-bonus__text {
    order: -1;
    margin-inline: 0 10px;
    grid-column: unset;
}

.text-image .listing-bonus .listing-bonus__promo-copy {
    grid-column: 1/-1;
    margin-top: -4px;
}

.loader-el {
    width: 100%;
    --loader-duration: 3.5s;
    --loader-timing-func: linear;
    --loader-delay: 1s;
}

.loader-el__status {
    text-align: center;
    color: #fff;
    text-align: center;
    font-size: 25px;
    font-weight: 700;
    line-height: 36px;
    /* 144% */
    text-transform: uppercase;
    margin: 0;
}

.loader-el__progress {
    position: relative;
    height: 24px;
    margin-top: 16px;
    border-radius: 20px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.65);
}

.loader-el__progress-bar {
    position: relative;
    width: 0%;
    height: inherit;
    border-radius: inherit;
    overflow: hidden;
    background: #115184;

}

.loading-screen._active .loader-el__progress-bar {
    animation: loadingBar var(--loader-duration) var(--loader-delay) var(--loader-timing-func) forwards;
}


@keyframes loadingBar {
    0% {
        width: 0%;
    }

    10% {
        width: 5%;
    }

    20% {
        width: 15%;
    }

    30% {
        width: 20%;
    }

    31% {
        width: 26%;
    }

    35% {
        width: 29%;
    }

    39% {
        width: 33%;
    }

    45% {
        width: 40%;
    }

    48% {
        width: 42%;
    }

    52% {
        width: 49%;
    }

    55% {
        width: 52%;
    }

    70% {
        width: 54%;
    }

    75% {
        width: 70%;
    }

    80% {
        width: 71%;
    }

    83% {
        width: 74%;
    }

    84% {
        width: 80%;
    }

    85% {
        width: 85%;
    }

    87% {
        width: 98%;
    }

    90% {
        width: 100%;
    }

    100% {
        width: 100%;
    }
}

.mob-btn {
    position: sticky;
    left: 0;
    bottom: 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 5px;
    z-index: 80;
    padding: 10px;
    border-radius: var(--section-border-radius, 12px);
}

.mob-btn:not(.active) {
    display: none
}

.mob-btn--red {
    background: linear-gradient(90deg, #c4002d 0%, #3e3e3e 65.69%);
}

.mob-btn--tg {
    background: linear-gradient(90deg, #0079c4 0%, #3e3e3e 65.69%);
}

.mob-btn .get-image,
.mob-btn > img {
    max-width: 40px;
    max-height: 40px;
}

.mob-btn__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
    margin: 0;
    margin-right: 5px;
    color: rgba(255, 255, 255, 0.87);
    font-size: 12px;
    font-weight: 600;
    line-height: 120%;
    /* 14.4px */
}

.mob-btn__text span {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 17.6px;
    /* 125.714% */
    text-transform: uppercase;
}

.mob-btn__text:first-child {
    gap: 8px;
}

.mob-btn__signal {
    color: #fff;
    text-align: center;
    font-size: 12px;
    font-weight: 400;
    line-height: 150%;
    /* 150% */
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
}

.mob-btn__timer {
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.16;
    letter-spacing: 1.8px;
}

.mob-btn > .btn {
    padding: 12px 25px;
    margin-left: auto;
}

.page-banners {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    gap: 26px;
}

.page-banners:not(:first-child) {
    margin-top: 20px;
}

.promo-card {
    width: 100%;
    padding: 12px;
    border-radius: var(--section-border-radius, 12px);
    background: #282828;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 12px;
}

.promo-card__body {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 12px;
}

.promo-card__header {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    column-gap: 8px;
}

.promo-card__header:has(.promo-card__app) .get-image,
.promo-card__header:has(.promo-card__app) .promo-card__img,
.promo-card__header:has(.promo-card__app) > img {
    grid-row: 1/3;
}

.promo-card__header .get-image,
.promo-card__header .promo-card__img,
.promo-card__header > img {
    max-width: 50px;
    max-height: 50px;
}

.promo-card__header .get-image img,
.promo-card__header .promo-card__img img,
.promo-card__header > img img {
    max-width: 50px;
    max-height: 50px;
}

.promo-card__title {
    margin: 0;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    /* 120% */
}

.promo-card__descr {
    margin: 0;
    margin-top: 6px;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    /* 128.571% */
    grid-column: 1/-1;
}

.promo-card__app {
    margin-top: 6px;
}

.promo-card__app-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    column-gap: 24px;
    row-gap: 6px;
    overflow: hidden;
}

.promo-card__app tr:not(:first-child) td {
    position: relative;
}

.promo-card__app tr:not(:first-child) td::before {
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    left: -12px;
    top: 0;
    background: #464646;
}

.promo-card__app-info {
    position: relative;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

.promo-card__app-info--rate {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    --percent: calc(var(--rating, 4.5) / 5 * 100%);
}

.promo-card__app-info--rate::after {
    content: "★★★★★";
    display: block;
    font-size: 21px;
    line-height: 19px;
    height: 21px;
    letter-spacing: 0px;
    font-weight: 300;
    background: linear-gradient(90deg, #ffba00 var(--percent), #8d8d8d var(--percent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.promo-card__promo {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 4px;
    padding-top: 16px;
    border-top: 1px solid #464646;
}

.promo-card__promo-text {
    margin: 0;
    color: #fff;
    font-size: 20px;
    font-weight: 400;
    line-height: 24px;
    flex: 1;
}

.promo-card__promo-copy {
    position: relative;
    flex: 1.05;
    border-radius: 8px;
    border: 1px dashed #fff;
    padding: 4px 4px 4px 12px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 44px;
}

.promo-card__promo-copy > .btn {
    align-self: stretch;
    padding: 6px 24px;
}

.promo-card__promo-copy.copied > .btn {
    position: absolute;
    top: 4px;
    left: 4px;
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    opacity: 1;
    pointer-events: none;
}

.promo-card__promo-copy.copied .promo-card__promo-copy-text {
    opacity: 0;
}

.promo-card__promo-copy-text {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    margin: 0;
}

.promo-card__signal {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 6px;
    margin-block: 12px;
}

.promo-card__timer {
    color: #fff;
    font-size: 40px;
    font-weight: 700;
    letter-spacing: 4px;
    line-height: 1.175;
}

.promo-card__row {
    width: 100%;
    display: flex;
}

.promo-card__row > td {
    width: 100%;
    display: flex;
}

.promo-card__row > td > .btn {
    width: 100%;
    padding: 3px 20px;
    min-height: 41px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.promo-card > .btn {
    width: 100%;
    padding: 3px 20px;
    min-height: 41px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.promo-card--gray {
    background: var(--section-bg, #3e3e3e);
}

.promo-card--gray .promo-card__promo {
    flex-direction: column;
    align-items: stretch;
    padding-top: 0;
    border-top: 0;
}

.promo-card--signal {
    background: linear-gradient(180deg, #282828 0%, #005689 100%);
}

.promo-card--signal .promo-card__title {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

@media (min-width: 576px) {
    .listing-bonus__winners-wrap {
        margin-left: 6px;
        padding-left: 6px;
        border-left: 1px solid rgba(0, 0, 0, 0.05);
    }

    .mob-btn {
        display: none;
    }
}

@media (min-width: 992px) {
    .page-banners .banner-card--tg:only-child {
        grid-template-columns: auto 1fr 302px;
        align-items: center;
    }

    .page-banners .banner-card--tg:only-child .btn {
        grid-column: auto;
        width: clamp(100px, 302px, 100%);
        margin-block: auto;
    }

    .page-banners .banner-card--tg:only-child .banner-card__content {
        display: grid;
        grid-template-columns: auto auto;
        align-items: center;
        column-gap: 20px;
        row-gap: 12px;
        justify-content: flex-start;
    }
}

@media (min-width: 1240px) {
    .listing-bonus::before {
        grid-row: 1/3;
        grid-column: 1/2;
    }

    .listing-bonus__text {
        grid-row: 1/3;
        grid-column: 2/3;
    }

    .listing-bonus__text:last-child {
        grid-column: 2/4;
    }

    .listing-bonus:has(.casino-listing__promo) {
        grid-template-columns: 40px 1fr 1.2fr;
    }

    .listing-bonus:has(.listing-bonus__promo-text, .listing-bonus__promo-copy) {
        grid-template-rows: auto 1fr;
    }

    .listing-bonus:has(.listing-bonus__winners) .listing-bonus__text {
        grid-row: 2/4;
    }

    .listing-bonus:has(.listing-bonus__winners)::before {
        grid-row: 2/4;
    }
}

@media (max-width: 1279px) {
    .tabs--vertical .tabs__header {
        padding: 24px 16px 32px;
    }

    .tabs--vertical .tabs__header-item {
        border-bottom: 1px solid #c4002d;
    }

    .tabs--vertical .tabs__content {
        padding: 16px;
    }
}

@media (max-width: 1239.9px) {
    .hero-block__wrap {
        grid-template-columns: minmax(0, 50%) minmax(0, 50%);
    }

    .casino-listing__item {
        grid-template-columns: 150px 139px 1fr 150px;
    }

    .listing-bonus {
        grid-template-columns: 1fr 40px;
    }

    .listing-bonus__promo-copy {
        grid-column: 1/-1;
        margin-top: -4px;
    }

    .listing-bonus__text {
        order: -1;
        margin-inline: 0 10px;
    }
}

@media (max-width: 1023px) {
    .text-image._reversed .text-image__title,
    .text-image._reversed .text-image__image,
    .text-image._reversed .text-image__content { order: unset; }

    .text-image__title {
        margin-bottom: 14px;
    }

    /*.main-nav span.main-nav__link {*/
    /*    position: absolute;*/
    /*    top: 0;*/
    /*    pointer-events: none;*/
    /*}*/

    /*.main-nav span.main-nav__link + .main-nav__item-arrow {*/
    /*    height: 45px;*/
    /*    align-items: center;*/
    /*    cursor: pointer;*/
    /*}*/
}

@media (max-width: 991.9px) {
    .hero-block__wrap {
        gap: 16px;
        grid-template-columns: 100%;
    }

    .hero-block__wrap > p {
        margin-top: 0;
    }

    .hero-block .get-image,
    .hero-block > img {
        width: 100%;
    }

    .hero-block .get-image img,
    .hero-block > img img {
        width: 100%;
    }

    .predictor-game__controls-item:not(:first-child) {
        display: none;
    }

    .casino-listing__item {
        grid-template-columns: 200px auto 200px;
    }

    .casino-listing__info {
        grid-column: 2/-1;
    }

    .casino-listing .listing-bonus {
        grid-column: 1/3;
    }

    .page-banners {
        flex-direction: column;
        gap: 20px;
    }
}

@media (max-width: 900px) {
    .loading-screen__clouds {
        width: 900px;
        bottom: 0;
    }

    .loading-screen__cloud:nth-child(1) {
        bottom: 475px;
    }

    .loading-screen__cloud:nth-child(2) {
        bottom: 351px;
    }

    .loading-screen__cloud:nth-child(3) {
        bottom: 259px;
    }

    .loading-screen__cloud:nth-child(4) {
        bottom: 129px;
    }

    .loading-screen__cloud:nth-child(5) {
        bottom: 34px;
    }

    .loading-screen__cloud:nth-child(6) {
        bottom: 0;
    }
}

@media (max-width: 767.9px) {
    .predictor-game__cashout-btn {
        width: 200px;
    }

    .benefits-block {
        grid-template-columns: 1fr;
    }

    .casino-listing__item {
        column-gap: 8px;
        row-gap: 16px;
        grid-template-columns: 200px 1fr;
    }

    .casino-listing__btns {
        grid-column: 1/-1;
    }

    .casino-listing .listing-bonus {
        grid-column: 1/-1;
    }
}

@media (max-width: 575.9px) {
    .bg-block {
        padding: 16px;
    }

    h2:not([class]) {
        font-size: 25px;
        line-height: 36px;
    }

    .text-image .content-button .btn {
        width: 100%;
    }

    ol.wp-block-list .btn,
    ol:not([class]) .btn {
        width: 100%;
    }

    .hero-block__content p:not([class]) {
        font-size: 14px;
    }

    .hero-block__title {
        font-size: 26px;
        font-weight: 900;
    }

    .hero-block .casino-listing:not(:first-child) .casino-listing__title:first-child {
        margin-top: 4px;
    }

    .hero-block-codes__title {
        font-size: 16px;
    }

    .hero-block-codes__btn {
        width: 100%;
    }

    .predictor-game {
        --left-plane-final-position: 60%;
        --bottom-plane-final-position: 10%;
        --plane-width: 100px;
        --plane-height: 50px;
        padding: 10px;
        margin-inline: 6px;
        width: calc(100% - 12px);
    }

    .predictor-game__main {
        height: 300px;
    }

    .predictor-game__propeller {
        width: 65px;
        height: 65px;
    }

    .predictor-game__preloader-text {
        font-size: 18px;
    }

    .predictor-game__preloader-rate {
        padding: 2px 6px;
        font-size: 20px;
    }

    .predictor-game__score {
        font-size: 70px;
    }

    .predictor-game__cashout-text {
        font-size: 14px;
    }

    .predictor-game__cashout-bet {
        font-size: 18px;
        line-height: 24px;
    }

    .predictor-game__cashout-btn {
        width: 124px;
    }

    .predictor-game__progress {
        width: 133px;
        height: 6px;
    }

    .predictor-game__controls-item {
        flex-direction: column;
        gap: 10px;
    }

    .predictor-game__controls {
        margin-left: 0;
        margin-top: 10px;
        width: 100%;
    }

    .banner-card {
        grid-template-columns: 1fr;
        grid-template-columns: 1fr;
    }

    .banner-card img,
    .banner-card .get-image {
        place-self: center;
    }

    .banner-card .banner-card__content {
        align-items: center;
    }

    .banner-card .banner-card__name,
    .banner-card .banner-card__descr {
        text-align: center;
    }

    .banner-card--tg .banner-card__content,
    .banner-card--modal .banner-card__content {
        gap: 10px;
    }

    .banner-card--tg .banner-card__descr,
    .banner-card--modal .banner-card__descr {
        margin-top: 4px;
    }

    .banner-card--tg .btn,
    .banner-card--modal .btn {
        width: clamp(212px, 212px, 100%);
    }

    .casino-listing:not(:first-child) .casino-listing__title:first-child {
        margin-top: 24px;
    }

    .casino-listing:not(:first-child) .casino-listing__table:first-child {
        margin-top: 20px;
    }

    .casino-listing__item {
        padding: 16px;
        grid-template-columns: 88px 1fr;
    }

    .listing-bonus__winners {
        flex-direction: column;
        padding: 8px;
    }

    .listing-bonus__winners-list {
        width: 100%;
    }

    .listing-bonus__winners-text {
        width: 100%;
        text-align: center;
        padding-bottom: 4px;
        margin-bottom: 4px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    }

    .promo-card__header:has(.promo-card__app) .get-image,
    .promo-card__header:has(.promo-card__app) .promo-card__img,
    .promo-card__header:has(.promo-card__app) > img {
        grid-row: 1/2;
    }

    .promo-card__header .get-image,
    .promo-card__header > img {
        grid-row: 1/2;
    }

    .promo-card__title {
        grid-row: 1/2;
    }

    .promo-card__app {
        grid-column: 1/-1;
        margin-top: 16px;
    }

    .promo-card td:has(.promo-card__app) {
        grid-column: 1/-1;
    }

    .promo-card__promo {
        flex-direction: column;
        align-items: stretch;
    }

    .promo-card__signal {
        margin-block: 4px;
    }
}

@media (max-width: 360px) {
    .modal-tg .modal-tg__content {
        max-width: calc(100% - 32px);
    }
}

@media (any-hover: hover) {
    .modal-tg .modal-tg__close:hover {
        background-color: rgba(0, 0, 0, 0.1);
    }

    .predictor-game__controller-btn:hover {
        border-color: #fff;
    }

    .predictor-game__controller-btn:hover::before,
    .predictor-game__controller-btn:hover::after {
        background: #fff;
    }

    .predictor-game__bet:hover {
        filter: brightness(125%);
    }
}

/* Author */
div.author{
    margin-top: 1rem;
}

.author-block {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    text-decoration: none;
    padding: 0 var(--offsets);
    border-radius: 3px;
}

a.author-block:hover .author-block__inner{
    outline: 1px solid #c4002d;
    background-color: #202020;
}

@media (max-width: 767px) {
    .author-block {
        flex-direction: column;
        gap: 10px;
    }

    body.author .author-block__content {
        margin-left: 0;
    }
}

.author-block_outlined {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 0 1rem;
    border: 1px solid #c4002d;
    padding: 1rem
}

.author-block__avatar {
    min-width: 200px;
    width: 200px;
    height: 200px
}

.author-block__avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center
}

.author-block__avatar_scaled {
    width: 150px;
    height: 150px
}

.author-block__content {
    /*margin-left: 1rem;*/
    /*max-width: 600px*/
    flex: 1 1 100%;
    color: #fff;
}

.author-block__name,
.author-block__description{
    color: #fff;
}

.author-block__social {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    list-style: none;
    margin: .5rem -5px -5px;
    padding-left: 0
}

.author-block__social li {
    margin: 5px;
    width: 25px;
    height: 25px
}

.author-block__social li:hover {
    opacity: .7
}

/* Pros & cons */
.difference__title {
    margin-bottom: 24px
}

.difference__wrapper {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns:(1fr) [ 2 ];
    grid-template-columns:repeat(2, 1fr);
    gap: 20px
}

.difference__element {
    border: 1px solid var(--bg-table);
    border-radius: 16px;
    padding: 3px
}

.difference__element--plus .difference__item-title {
    color: #fff;
    background-color: var(--highlight-color)
}

.difference__element--plus .difference__item-title::after {
    content: "+";
    margin-left: 4px;
    font-weight: 800;
    font-size: 20px;
    line-height: 28px
}

.difference__element--plus .difference__list-item::before {
    content: "+";
    color: #fff;
    background-color: var(--highlight-color)
}

.difference__element--minus .difference__item-title {
    background-color: #c4002d
}

.difference__element--minus .difference__item-title::after {
    content: "-";
    margin-left: 4px;
    font-weight: 800;
    font-size: 20px;
    line-height: 28px
}

.difference__element--minus .difference__list-item::before {
    content: "-";
    background-color: #c4002d
}

.difference__item-title {
    margin-bottom: 16px;
    border-radius: 12px 12px 2px 2px;
    padding: 4px 12px;
    font-size: 20px;
    line-height: 28px
}

.difference__list {
    list-style: none;
    margin: 0;
    padding: 0 0 12px 12px
}

.difference__list-item {
    position: relative;
    padding-left: 32px
}

.difference__list-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 4px;
    width: 24px;
    height: 24px
}

.difference__list-item:not(:last-child) {
    margin-bottom: 12px
}

/* Tables */
.table-image {
    display: flex;
    align-items: center;
    gap: 10px;
}

.table-image img {
    width: auto;
    max-height: 44px;
}

/* FAQ */
details {
    list-style: none;
}

details summary::-webkit-details-marker {
    display: none;
}

details summary::marker {
    display: none;
    content: none;
}

.faq {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.faq__item {
    background-color: #c4002d;
}

.faq__item:not(:last-child) {
    margin-bottom: 20px
}

.faq__item-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    outline: 0;
    padding: 16px;
    font-family: inherit;
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    color: #fff;
    cursor: pointer
}

.faq__item-title {
    margin: 0;
}

.faq__item-header svg {
    z-index: 10;
    flex-shrink: 0;
    margin-left: 30px;
    width: 36px;
    height: 36px;
}

.faq__item[open] .faq__item-header .line {
    opacity: 0;
}

.faq__body {
    border: 2px solid #c4002d30;
    background-color: var(--block-bg);
    color: var(--text-color);
    padding: 16px;
    width: 100%;
}

.faq__body > :first-child {
    margin-top: 0
}

@media (max-width: 767px) {
    .faq__item-title svg {
        margin-left: 8px
    }
}

/* Advantages */
.advantages__list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 24px;
    list-style: none;
}

.advantages__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--section-bg, #3e3e3e);
    text-align: center;
    padding: var(--offsets);
    border-radius: 12px;
}

.advantages__item img {
    width: auto;
    max-height: 150px
}

.advantages__title {
    color: #FFF;
    font-size: 18px;
    line-height: 24px;
    margin-top: 1rem
}

/* Game */
.game {
    border-radius: 0 0 20px 20px;
}

.game__title {
    margin-bottom: 32px;
    color: #fff
}

.game__box {
    overflow: hidden;
    border-radius: 12px;
    background-color: var(--header-bg-color);
}

.game__box-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 12px
}



.game__box-iframe {
    position: relative;
    overflow: hidden;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    aspect-ratio: 64/27;
    overflow: hidden;
    border-radius: 12px;
}

.game__box-iframe::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: hsla(0, 0%, 100%, .1);
    opacity: .7;
}

.game__box-iframe iframe {
    border: none;
    width: 100%;
    aspect-ratio: 64/27
}

.game__box-iframe.hide::after {
    display: none
}

.game__demo-link {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 10;
    min-width: 200px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.game__demo-link.hide {
    opacity: 0;
    visibility: hidden;
    pointer-events: none
}

@media (max-width: 767px) {
    .game .game__box-iframe {
        aspect-ratio: unset;
        min-height: 400px;
        background-size: cover;
    }

    .game .game__box-iframe iframe {
        aspect-ratio: unset;
        min-height: 85vh;
    }
}

.game__header-button {
    align-self: center;
}

.game__header-button + .demo-listing {
    margin-left: 12px;
}

@media (max-width: 1024px) {
    .game__box-header:has(.game__header-button) {
        flex-direction: column;
    }

    .game__header-button + .demo-listing {
        margin: 12px 0 0 0;
    }
}

.demo-listing {
    padding: 12px;
    border-radius: 12px;
    background: #282828;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 24px;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    text-align: left
}

@media (max-width: 767.9px) {
    .demo-listing {
        padding: 16px
    }
}

@media (max-width: 575.9px) {
    .demo-listing {
        text-align: center;
        padding: 12px;
        gap: 12px;
        flex-wrap: wrap
    }
}

.demo-listing__list {
    margin: 0;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    gap: 12px
}

@media (max-width: 575.9px) {
    .demo-listing__list {
        width: 100%;
        display: grid;
        grid-template-columns:repeat(auto-fit, minmax(91px, 1fr));
        justify-content: center;
        gap: 8px
    }
}

.demo-listing__item {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 6px;
    border-radius: 5px;
    padding: 4px;
    background: #464646
}

.demo-listing__item img {
    min-width: 106px;
    width: 106px;
    max-width: 100%;
    height: 50px;
    max-width: 100%;
    object-fit: cover;
    border-radius: 5px
}

.demo-listing__item .btn {
    width: 100%;
    padding: 6px 14px
}

@media (max-width: 575.9px) {
    .demo-listing__item img {
        width: 100%;
        min-width: unset
    }
}

@media (max-width: 575.9px) {
    .game__box-header .demo-listing {
        margin: -6px;
        width: calc(100% + 12px);
        max-width: calc(100% + 12px)
    }

    .game__header-button + .demo-listing {
        margin: 12px -6px -6px -6px;
    }
}

/* Promo use */
.promo-use {
    align-self: start;
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 5px
}

.hero-block-codes .promo-use {
    grid-column: 1/-1;
}

.promo-use.copied .promo-use__copy {
    position: absolute;
    top: 4px;
    left: 4px;
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    opacity: 1;
    pointer-events: none;
    background: var(--green, #4caf50)
}

.promo-use.copied .promo-use__copy svg {
    display: none
}

.promo-use.copied .promo-use__active {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase
}

.promo-use__text {
    flex: 1;
    position: relative;
    min-height: 46px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    margin: 0;
    border: 1px dashed #fff;
    padding: 3px;
    border-radius: 8px
}

.promo-use__code {
    margin: 0;
    padding-left: 8px;
    font-size: 16px;
    font-weight: 700
}

.promo-use__copy {
    padding: 2px;
    width: 38px;
    height: 38px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    font-size: 10px;
    font-weight: 500;
    line-height: 1;
    color: #4caf50;
    border-radius: 4px;
    text-transform: none
}

.promo-use__btn {
    min-width: 79px;
    padding: 6px 24px;
    align-self: stretch
}

/* Listing edits */
.casino-listing__table tr:nth-child(-n+3) .casino-listing__item {
    box-shadow: none;
    background-image: none;
    background: hsla(0, 0%, 100%, .1);
    box-shadow: 4px 4px 16px 0px rgba(0, 0, 0, .32)
}

.casino-listing:not(.casino-listing--grid) .casino-listing__table tr {
    display: flex;
    flex-direction: stretch
}

.casino-listing:not(.casino-listing--grid) .casino-listing__table tr:nth-child(-n+3) .casino-listing__item {
    border: 1px solid rgba(0, 0, 0, 0);
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    background-image: linear-gradient(#464646, #464646), linear-gradient(146deg, #e4b431 0%, #ffe59d 25%, #b58d21 53%, #ffe08d 76%, #886811 100%)
}

.casino-listing:not(.casino-listing--grid) .casino-listing__table tr:nth-child(1) .casino-listing__item {
    box-shadow: 0px 0px 20px 0px rgba(229, 182, 54, .2)
}

.casino-listing:not(.casino-listing--grid) .casino-listing__table tr:nth-child(1) .casino-listing__place {
    background: linear-gradient(146deg, #e4b431 0%, #ffe59d 25%, #b58d21 53%, #ffe08d 76%, #886811 100%)
}

.casino-listing:not(.casino-listing--grid) .casino-listing__table tr:nth-child(2) .casino-listing__item {
    box-shadow: 0px 0px 20px 0px hsla(0, 0%, 100%, .2);
    background-image: linear-gradient(#464646, #464646), linear-gradient(146deg, #dcdcdc 0%, #f9f9f9 25%, #d7d7d7 53%, #fff 76%, #cfcfcf 100%)
}

.casino-listing:not(.casino-listing--grid) .casino-listing__table tr:nth-child(2) .casino-listing__place {
    background: linear-gradient(146deg, #b5b5b5 0%, #e7e7e7 25%, #949494 53%, #c0c0c0 76%, #cfcfcf 100%)
}

.casino-listing:not(.casino-listing--grid) .casino-listing__table tr:nth-child(3) .casino-listing__item {
    box-shadow: 0px 0px 20px 0px rgba(250, 167, 71, .2);
    background-image: linear-gradient(#464646, #464646), linear-gradient(146deg, #ac6f29 0%, #ffb120 25%, #b97b25 53%, #ffa454 76%, #a96e1c 100%)
}

.casino-listing:not(.casino-listing--grid) .casino-listing__table tr:nth-child(3) .casino-listing__place {
    background: linear-gradient(146deg, #ac6f29 0%, #ffb120 25%, #b97b25 53%, #ffa454 76%, #a96e1c 100%)
}

.casino-listing__table {
    width: 100%
}

.casino-listing--grid .casino-listing__list {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    gap: 20px
}

.casino-listing--grid .casino-listing__item {
    padding: 12px;
    grid-template-columns:77px 1fr;
    grid-template-rows:auto 1fr auto;
    height: 100%;
    column-gap: 8px;
    row-gap: 13px
}

.casino-listing--grid .casino-listing__item .casino-listing__rate {
    font-size: 20px
}

.casino-listing--grid .casino-listing__item .casino-listing__info {
    grid-column: 2/-1;
    align-self: center
}

.casino-listing--grid .casino-listing__item .casino-listing__btns {
    grid-column: 1/-1
}

.casino-listing--grid .casino-listing__item .listing-bonus {
    grid-column: 1/-1;
    grid-template-columns:1fr 40px;
    column-gap: 10px
}

.casino-listing--grid .casino-listing__item .listing-bonus__promo-copy, .casino-listing--grid .casino-listing__item .listing-bonus .promo-use {
    grid-column: 1/-1;
    margin-top: -4px
}

.casino-listing--grid .casino-listing__item .listing-bonus::before {
    grid-row: 1/2;
    grid-column: 2/3;
    align-self: center
}

.casino-listing--grid .casino-listing__item .listing-bonus__text {
    grid-row: 1/2;
    grid-column: 1/2;
    margin: 0;
    justify-content: center
}

@media (max-width: 991.9px) {
    .casino-listing--grid .casino-listing__list {
        grid-template-columns:repeat(2, 1fr)
    }
}

@media (max-width: 767.9px) {
    .casino-listing--grid .casino-listing__list {
        grid-template-columns:1fr
    }
}

@media (min-width: 1240px) {
    .listing-bonus:has(.listing-bonus__promo-text,.listing-bonus__promo-copy,.promo-use) {
        grid-template-rows:auto 1fr
    }
}

@media (max-width: 1239.9px) {
    .listing-bonus__promo-copy, .listing-bonus .promo-use {
        grid-column: 1/-1;
        margin-top: -4px
    }
}

.text-image .listing-bonus .listing-bonus__promo-copy, .text-image .listing-bonus .promo-use {
    grid-column: 1/-1;
    margin-top: -4px
}

/* Predictor improvements */
.predictor-game__sun {
    pointer-events: none
}

.predictor-game__cashout {
    z-index: 3;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    opacity: 0;
    pointer-events: none
}

.predictor-game__cashout.active {
    pointer-events: all
}

.predictor-game__cashout-text {
    flex-wrap: wrap;
    font-size: 14px
}

.predictor-game__cashout-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    flex-wrap: wrap
}

.predictor-game__cashout-rate {
    font-size: 18px;
    line-height: 24px
}

.predictor-game__cashout-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    padding-left: 12px;
    border-left: 1px solid #464646
}

.predictor-game__cashout-btn {
    width: 250px;
    min-height: unset
}

.predictor-game__cashout-btn img {
    vertical-align: middle;
    margin-left: 5px;
    max-width: 55px;
    max-height: 30px;
    object-fit: contain
}

.predictor-game__cashout-win {
    color: #fff;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    line-height: 17px;
    text-transform: uppercase
}

@media (max-width: 575.9px) {
    .predictor-game__cashout {
        flex-direction: column;
        padding: 12px 8px
    }

    .predictor-game__cashout-btn {
        width: 100%
    }

    .predictor-game__cashout-block {
        width: 100%;
        padding-top: 12px;
        padding-left: 0;
        border-left: 0;
        border-top: 1px solid #464646
    }
}

.hero-block .promo-use {
    grid-column: 1/-1
}

.hero-block__btn {
    width: clamp(100px, 295px, 100%)
}
