* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Gotham Pro', sans-serif;
}

html {
    font-size: 16px;
}

body {
    --primaryText: #FFFFFF;
    --secondaryText: #8186BD;
    --bgMainColor: #181A32;
    --baseColor: #1C1F3E;
    --secondaryBtn: #2B2F5B;
    background-color: var(--color-background);
    overflow-y: auto;
    overflow-x: hidden;
}
body.light {
    background-color: #F8F8FA;
    --primaryText: #2C2B63;
    --secondaryText: #9996B1;
    --bgMainColor: #F3F4FC;
    --baseColor: #E3E5F3;
    --secondaryBtn: #D2D4E9;
}

.flex { display: flex; }
.wrap { flex-wrap: wrap; }
.column { flex-direction: column; }
.jc-sb { justify-content: space-between; }
.jc-sa { justify-content: space-around; }
.jc-center { justify-content: center; }
.jc-fe { justify-content: flex-end; }
.ai-center { align-items: center; }
.ai-fs { align-items: flex-start; }
.ai-fe { align-items: flex-end; }

.w-3 { width: 3rem; }
.w-4 { width: 4rem; }
.w-5 { width: 5rem; }
.w-6 { width: 6rem; }
.w-7 { width: 7rem; }
.w-8 { width: 8rem; }
.w-9 { width: 9rem; }
.w-10 { width: 10rem; }
.w-15 { width: 15rem; }
.w-20 { width: 20rem; }
.w-25 { width: 25rem; }
.w-30 { width: 30rem; }
.w-auto { width: auto; }
.w-50 { width: 50%; }
.w-100 { width: 100%; }

.mt-05 { margin-top: .5rem; }
.mt-1 { margin-top: 1rem; }
.mt-2 { margin-top: 2rem; }
.mt-3 { margin-top: 3rem; }
.mt-4 { margin-top: 4rem; }

.mb-05 { margin-bottom: .5rem; }
.mb-1 { margin-bottom: 1rem; }
.mb-2 { margin-bottom: 2rem; }
.mb-3 { margin-bottom: 3rem; }
.mb-4 { margin-bottom: 4rem; }

.ml-05 { margin-left: .5rem; }
.ml-1 { margin-left: 1rem; }
.ml-2 { margin-left: 2rem; }
.ml-3 { margin-left: 3rem; }
.ml-4 { margin-left: 4rem; }

.mr-05 { margin-right: .5rem; }
.mr-1 { margin-right: 1rem; }
.mr-2 { margin-right: 2rem; }
.mr-3 { margin-right: 3rem; }
.mr-4 { margin-right: 4rem; }

.m-05 { margin: .5rem; }
.m-1 { margin: 1rem; }
.m-2 { margin: 2rem; }
.m-3 { margin: 3rem; }
.m-4 { margin: 4rem; }

.pl-05 { padding-left: .5rem; }
.pl-1 { padding-left: 1rem; }
.pl-2 { padding-left: 2rem; }
.pl-3 { padding-left: 3rem; }
.pl-4 { padding-left: 4rem; }

.pr-05 { padding-right: .5rem; }
.pr-1 { padding-right: 1rem; }
.pr-2 { padding-right: 2rem; }
.pr-3 { padding-right: 3rem; }
.pr-4 { padding-right: 4rem; }

.pt-05 { padding-top: .5rem; }
.pt-1 { padding-top: 1rem; }
.pt-2 { padding-top: 2rem; }
.pt-3 { padding-top: 3rem; }
.pt-4 { padding-top: 4rem; }

.pb-05 { padding-bottom: .5rem; }
.pb-1 { padding-bottom: 1rem; }
.pb-2 { padding-bottom: 2rem; }
.pb-3 { padding-bottom: 3rem; }
.pb-4 { padding-bottom: 4rem; }

.p-05 { padding: .5rem; }
.p-1 { padding: 1rem; }
.p-2 { padding: 2rem; }
.p-3 { padding: 3rem; }
.p-4 { padding: 4rem; }

.ml-auto { margin-left: auto; }
.mr-auto { margin-right: auto; }
.grow { flex-grow: 1; }

.absolute-bc{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

.overflow-hidden {
    overflow: hidden;
}

.text-bold{
    font-weight: 600;
}

.text-smallest{
    font-size: .65rem;
}
.text-smaller{
    font-size: .75rem;
}
.text-small{
    font-size: .875rem;
}
.text-large{
    font-size: 1.2rem;
}
.text-largest{
    font-size: 1.6rem;
}
.text-nowrap{
    white-space: nowrap;
}

.hide-scrollbar{
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.hide-scrollbar::-webkit-scrollbar {
    display: none;
}
.hide-scrollbar::-webkit-scrollbar-corner {
    background: none;
}
::-webkit-scrollbar-corner {
    background: none;
}

.layout-message {
    background-color: #fff;
    padding: 3rem;
    border-radius: 1rem;
    display: flex;
    flex-direction: column;
}

.layout-message__text {
    text-align: center;
    font-size: 1.15rem;
    font-weight: 700;
    color: #0B0D31;
}

.layout-message__button {
    margin: 2rem auto 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3rem;
    padding: 0 2rem;
    border-radius: 0.75rem;
    background-color: var(--color-blue);
    color: #fff;
    font-weight: 700;
    cursor: pointer;
}



.webim-html-button-main {
    background-color: #fff !important;
    border: none !important;
}

.scroll-hidden{
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.unselectable {
    user-select: none;
}

.hidden{
    display: none !important;
}

body .fullscreen-el{
    width: 100dvh !important;
    height: 100dvw !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
}

#game-frame.fullscreen-el{
    height: 100dvh !important;
    width: 100dvh !important;
}

.fullscreen-el{
    width: 100dvh !important;
    height: 100dvw !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
}

@media (max-width: 600px) {
    .webim-html-button-container {
        bottom: 4rem !important;
        right: 0.5rem !important;
    }
}

@media (max-width: 1080px) {
    .mobile-hidden {
        display: none !important;
    }
}

body.chat-hidden #supportTrigger{
    display: none !important;
}
body.chat-hidden .mobile-trigger-menu-wrapper{
    visibility: hidden !important;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}


body {
    color: #fff;
    font-family: "Gotham Pro";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    /*line-height: 1.25rem;*/
}

a {
    color: inherit;
    transition: color 0.3s;
    text-decoration: none;
}

.invisible{
    visibility: hidden;
}

.relative{
    position: relative;
}

.back-blur{
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.no-padding{
    padding: 0;
}

.absolute-center{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.test-item{
    border: #c67a1c 2px dashed;
}

:root {
    --color-blue: #787bf7;
    --color-red: #EF8E8B;
    --color-orange: #F29B49;
    --color-green: #a3dc8e;
    --color-gray: #8283C0;
    --color-gray-dark: #2B2F5B;
    --color-background: #14142FFA;
    --color-overlay-background: #14142F;
    --color-green-light: #34C759;
    --color-disabled-background: #CCCCCC;
}

.money {
    display: flex;
}

.money__int {
    color: #fff;
    word-break: keep-all;
    white-space: pre;
    font-family: Roboto, sans-serif;
}
body.light .money__int {
    color: #1A1944;
}
.money__rest {
    color: #8283C0;
    word-break: keep-all;
    white-space: pre;
    font-family: Roboto, sans-serif;
}


.text-green .money__int,
.text-green .money__rest,
.text-green {
    color: var(--color-green);
}
.text-red .money__int,
.text-red .money__rest,
.text-red {
    color: var(--color-red);
}
.text-orange .money__int,
.text-orange .money__rest,
.text-orange {
    color: var(--color-orange);
}

.text-white {
    color: #FFF;
}
.text-gray {
    color: #999;
}

.text-title{
    color: #FFF;
}
body.light .text-title{
    color: #000;
}
.text-subtitle{
    color: #8C90CA;
}
body.light .text-subtitle{
    color: #8C90CA;
}


body.light img.invert-white{
    filter: invert(1);
}

.grayscale{
    filter: grayscale(1);
}

/* Montserrat */
@font-face {
    font-family: "Montserrat";
    src: url("/fonts/Montserrat/Montserrat-Regular.ttf");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "Montserrat";
    src: url("/fonts/Montserrat/Montserrat-Italic.ttf");
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: "Montserrat";
    src: url("/fonts/Montserrat/Montserrat-SemiBold.ttf");
    font-weight: 600;
    font-style: normal;
}



/* Gotham Pro */
@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro.ttf");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-Italic.ttf");
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-Medium.ttf");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-MediumItalic.ttf");
    font-weight: 500;
    font-style: italic;
}

/* Benzin */
@font-face {
    font-family: "Benzin";
    src: url("/fonts/Benzin/Benzin-Regular.ttf");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "Benzin";
    src: url("/fonts/Benzin/Benzin-Medium.ttf");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: "Benzin";
    src: url("/fonts/Benzin/Benzin-Semibold.ttf");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: "Benzin";
    src: url("/fonts/Benzin/Benzin-Bold.ttf");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "Benzin";
    src: url("/fonts/Benzin/Benzin-ExtraBold.ttf");
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-Bold.ttf");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-Bold.ttf");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-Black.ttf");
    font-weight: 900;
    font-style: normal;
}

@charset "UTF-8";

/* Fonts */

@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro.woff2") format("woff2"), url("/fonts/GothamPro/GothamPro.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-Bold.woff2") format("woff2"), url("/fonts/GothamPro/GothamPro-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-Italic.woff2") format("woff2"), url("/fonts/GothamPro/GothamPro-Italic.woff") format("woff");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-Medium.woff2") format("woff2"), url("/fonts/GothamPro/GothamPro-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Gotham Pro";
    src: url("/fonts/GothamPro/GothamPro-MediumItalic.woff2") format("woff2"), url("/fonts/GothamPro/GothamPro-MediumItalic.woff") format("woff");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}


.text-page h1 {
    color: #fff;
    font-size: 2rem;
    margin: 1rem 0 2rem 0;
}
body.light .text-page h1 {
    color: #55549b;
}
.text-page h2 {
    font-size: 1.5rem;
    color: #9aa2d4;
    margin-bottom: 1rem;
    margin-top: 1.5rem;
}
body.light .text-page h2 {
    color: #55549b;
}
.text-page p {
    font-size: 0.875rem;
    color: #7a82b4;
    margin: 0.5rem 0;
    line-height: 1.35;
}
body.light .text-page p{
    color: #55549b;;
}
.text-page .info__title {
    font-weight: 700;
    color: #b3bae7;
    margin-top: 2rem;
}
body.light .text-page .info__title{
    color: #55549b;;
}
.text-page ul {
    margin: 1rem 0;
}
.text-page ul li {
    list-style: none;
    font-size: 0.75rem;
    color: #7a82b4;
    margin: 0.35rem 0;
}
body.light .text-page ul li{
    color: #55549b;;
}
.text-page ul li:before {
    content: '';
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 0.75rem;
    background-color: var(--color-orange);
    margin-right: 0.5rem;
}
.text-page td, td a {
    color: #fff;
}
body.light .text-page td, td a {
    color: #55549b;
}


.svg-box {
    display:inline-block;
    position: relative;
    width:150px;
}

.green-stroke {
    stroke:#7CB342;
}

.red-stroke {
    stroke: #FF6245;
}

.yellow-stroke {
    stroke: #FFC107;
}


.circular circle.path {
    stroke-dasharray: 330;
    stroke-dashoffset: 0;
    stroke-linecap: round;
    opacity: 0.4;
    animation: 0.7s draw-circle ease-out;
}

/*------- Checkmark ---------*/
.checkmark{
    stroke-width: 6.25;
    stroke-linecap: round;
    position:absolute;
    top: 56px;
    left: 49px;
    width: 52px;
    height: 40px;
}

.checkmark path {
    animation: 1s draw-check ease-out;
}

@keyframes draw-circle {
    0% {
        stroke-dasharray: 0,330;
        stroke-dashoffset: 0;
        opacity: 1;
    }

    80% {
        stroke-dasharray: 330,330;
        stroke-dashoffset: 0;
        opacity: 1;
    }

    100%{
        opacity: 0.4;
    }
}

@keyframes draw-check {
    0% {
        stroke-dasharray: 49,80;
        stroke-dashoffset: 48;
        opacity: 0;
    }

    50% {
        stroke-dasharray: 49,80;
        stroke-dashoffset: 48;
        opacity: 1;
    }

    100% {
        stroke-dasharray: 130,80;
        stroke-dashoffset: 48;
    }
}

/*---------- Cross ----------*/

.cross {
    stroke-width:6.25;
    stroke-linecap: round;
    position: absolute;
    top: 54px;
    left: 54px;
    width: 40px;
    height: 40px;
}

.cross .first-line {
    animation: 0.7s draw-first-line ease-out;
}

.cross .second-line {
    animation: 0.7s draw-second-line ease-out;
}

@keyframes draw-first-line {
    0% {
        stroke-dasharray: 0,56;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 0,56;
        stroke-dashoffset: 0;
    }

    100% {
        stroke-dasharray: 56,330;
        stroke-dashoffset: 0;
    }
}

@keyframes draw-second-line {
    0% {
        stroke-dasharray: 0,55;
        stroke-dashoffset: 1;
    }

    50% {
        stroke-dasharray: 0,55;
        stroke-dashoffset: 1;
    }

    100% {
        stroke-dasharray: 55,0;
        stroke-dashoffset: 70;
    }
}

.alert-sign {
    stroke-width:6.25;
    stroke-linecap: round;
    position: absolute;
    top: 40px;
    left: 68px;
    width: 15px;
    height: 70px;
    animation: 0.5s alert-sign-bounce cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.alert-sign .dot {
    stroke:none;
    fill: #FFC107;
}

@keyframes alert-sign-bounce {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    50% {
        transform: scale(0);
        opacity: 1;
    }

    100% {
        transform: scale(1);
    }
}

.currency-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 100%;
    position: relative;
    flex-shrink: 0;
    margin-bottom: 2px;
}

.currency-icon::before {
    content: '';
    display: block;
    position: absolute;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 100%;
    left: 0.2rem;
    top: 0.2rem;
}


.currency-icon_uah {
    background-color: #FCC339;
}
.currency-icon_uah::before {
    background-color: #FFC660;
    background-image: linear-gradient(to bottom, #d39c17, transparent);
}

.currency-icon_rub {
    background-color: #EF8E8B;
}
.currency-icon_rub::before {
    background-color: #e68683;
    background-image: linear-gradient(to bottom, #dd706d, transparent);
}

.currency-icon_usd {
    background-color: #A2DC8D;
}
.currency-icon_usd::before {
    background-color: #9cd587;
    background-image: linear-gradient(to bottom, #83c66a, transparent);
}

.currency-icon_eur {
    background-color: #787BF7;
}
.currency-icon_eur::before {
    background-color: #6f72f0;
    background-image: linear-gradient(to bottom, #5c5fd1, transparent);
}

.currency-icon_inr {
    background-color: #b000db;
}
.currency-icon_inr::before {
    background-color: #c200f2;
    background-image: linear-gradient(to bottom, #8000a0, transparent);
}

.currency-icon_btc {
    background-color: #FD9C0D;
}
.currency-icon_btc::before {
    background-color: #FD9C0D;
    background-image: linear-gradient(to bottom, #b16d09, transparent);
}
.currency-icon_mbtc {
    background-color: #FD9C0D;
}
.currency-icon_mbtc::before {
    background-color: #FD9C0D;
    background-image: linear-gradient(to bottom, #b16d09, transparent);
}

.currency-icon_usdt {
    background-color: #81b070;
}
.currency-icon_usdt::before {
    background-color: #749e64;
    background-image: linear-gradient(to bottom, #5a7b4e, transparent);
}

.currency-icon_kzt {
    background-color: #00a8c9;
}
.currency-icon_kzt::before {
    background-color: #0097b4;
    background-image: linear-gradient(to bottom, #007890, transparent);
}

.currency-icon_uzs {
    background-color: #5ccbec;
}
.currency-icon_uzs::before {
    background-color: #107fa0;
    background-image: linear-gradient(to bottom, #17b6e5, transparent);
}

.currency-color_uah {
    color: #FCC339;
}
.currency-color_rub {
    color: #EF8E8B;
}
.currency-color_usd {
    color: #A2DC8D;
}
.currency-color_eur {
    color: #787BF7;
}
.currency-color_inr {
    color: #b000db;
}
.currency-color_btc {
    color: #FD9C0D;
}
.currency-color_mbtc {
    color: #FD9C0D;
}
.currency-color_usdt {
    color: #81b070;
}
.currency-color_kzt {
    color: #00a8c9;
}
.currency-color_uzs {
    color: #5ccbec;
}

.currency-icon:after {
    z-index: 0;
    color: #fff;
    font-weight: 600;
    font-size: 0.95rem;
    font-family: 'Gotham Pro', sans-serif;
    line-height: 1rem;
}

.currency-icon_uah:after {
    content: '₴';
}
.currency-icon_rub:after {
    content: '₽';
}
.currency-icon_usd:after {
    content: '$';
}
.currency-icon_eur:after {
    content: '€';
}
.currency-icon_inr:after {
    content: '₹';
}
.currency-icon_btc:after {
    content: '₿';
}
.currency-icon_mbtc:after {
    content: '₿';
}
.currency-icon_usdt:after {
    content: '₮';
}
.currency-icon_kzt:after {
    content: '₸';
}
.currency-icon_uzs:after {
    content: 'S';
}

input[type=password]::-ms-reveal,
input[type=password]::-ms-clear {
    display: none;
}

.input {
    border-radius: 0.5rem;
    background-color: #2C2B63;
    border: none;
    height: 3rem;
}



.input__wrap_modal {
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
}


.input__label_modal {
    font-family: 'Gotham Pro', sans-serif;
    font-size: 0.75rem;
    color: #8283C0;
}

.input__field_modal {
    display: flex;
    height: 2.5rem;
    font-family: 'Gotham Pro', sans-serif;
    outline: none;
    flex-grow: 1;
    border-radius: 0.925rem;
    background-color: #1C1F3E;
    border: #2C2B64 1px solid;
    color: #8C90CA;
    padding: .5rem 2rem .5rem 1rem;
    font-size: .925rem;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0;
    text-align: left;
    transition: box-shadow 0.4s ease-in-out;
}
body.light .input__field_modal {
    background-color: #FFFFFF;
    border: #CCCCCC 1px solid;
    color: #444;
}
.input__field_modal.flashed-red{
    box-shadow: 0 0 5px #bd1f1f;
    color: #bd1f1f;
}
.input__label_modal{
    font-size: .8rem;
    line-height: 1rem;
    color: #8C90CA;
    margin-bottom: .2rem;
    font-weight: 600;
}
.input__eye-icon{
    height: 1.5rem;
}


.option__field_modal {
    display: flex;
    height: 2.5rem;
    border-radius: 10px;
    border: none;
    padding: 0;
    font-family: 'Gotham Pro', sans-serif;
    outline: none;
    font-size: 0.875rem;
    flex-grow: 1;
    margin-bottom: 15px;
    background-color: #f4f5fe;
}

.input__wrap_modal.has-error .input__field_modal {
    border-bottom-color: var(--color-red);
}
.input__field_modal::placeholder {
    color: #c5c6e2;
    font-size: 0.875rem;
}

.input__field_modal:focus {
    border-color: #787BF7;
}

.input__icon_modal {
    position: absolute;
    left: 1rem;
    bottom: 0.8rem;
}

.select__field {
    height: 3rem;
    width: 100%;
    border-radius: 0.625rem;
    border: 1px solid #55657E;
    background-color: transparent;
    outline: none;
    padding: 0 2rem 0 0.75rem;
    color: #fff;
    font-size: 0.875rem;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.input__field-wrap {
    display: flex;
    width: 100%;
}
.input__field-prefix {
    border: none;
    border-bottom: 2px solid #d0d1e7;
    outline: none;
    /*-webkit-appearance: none;*/
}
.input__field-prefix + .input__field_modal {
    padding-left: 0.5rem;
}
.select__arrow {
    position: absolute;
    right: 1rem;
    top: 1.1rem;
    opacity: 0.5;
}


.input__field {
    height: 3rem;
    width: 100%;
    border-radius: 0.625rem;
    border: 1px solid #2C2B64;
    background-color: transparent;
    outline: none;
    padding: 0 1rem 0 1rem;
    color: #fff;
    font-size: 0.875rem;
}
.input__field:focus{
    border: 2px solid #5A4CF1;
}
body.light .input__field {
    border: 1px solid #cecdd9;
    color: #666;
}
body.light .input__field:focus{
    border: 2px solid #aaa;
}
.input__field_icon-both {
    padding: 0 2.5rem 0 2.5rem;
}
.input__field_icon-left {
    padding: 0 1rem 0 2.5rem;
}
.input__field_icon-right {
    padding: 0 2.5rem 0 1rem;
}
.input__field::placeholder {
    color: #8283C0;
}
.input__wrap {
    display: flex;
    flex-direction: column;
    position: relative;
}
.input__icon {
    position: absolute;
    height: 1rem;
    left: 1rem;
    top: 1rem;
    width: auto;
}
.input__icon_right {
    position: absolute;
    right: 1rem;
    top: 1rem;
    height: 1rem;
    width: auto;
}
.input__icon_left {
    position: absolute;
    left: .5rem;
    top: 0.8rem;
    height: 1.2rem;
    width: auto;
}
.input__eye-icon {
    position: absolute;
    bottom: 1.025rem;
    right: 0.75rem;
    opacity: 0.25;
    cursor: pointer;
}
body.light .input__eye-icon {
    filter: invert(1);
}
.input__eye-icon:hover {
    opacity: 0.5;
}

.input__eye-icon_visible,
.input__eye-icon_visible:hover {
    opacity: 1;
}

.input__file {
    display: none;
}

.input__file-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #32316B;
    border: 1px dashed #8283C0;
    border-radius: 0.625rem;
    padding: 1rem 2rem;
    min-height: 100%;
    cursor: pointer;
}
.input__file-area.highlighted{
    border-color: #2DDC4B;
}
.input__file-icon{
    max-width: 100px;
    max-height: 80px;
}
body.light .input__file-area {
    background-color: #fff;
}
.input__file-area:hover {
    background-color: #343372;
    border: 1px dashed #a3a4ec;
}
body.light .input__file-area:hover {
    background-color: #fff;
}
.input__error {
    font-size: 0.75rem;
    margin-top: 0.25rem;
    color: var(--color-red);
}
input[type="date" i]::-webkit-calendar-picker-indicator {
    display: none;
}

.select {
    border-radius: 0.5rem;
    background-color: #2C2B63;
    border: none;
    height: 3rem;
    padding: 0 1rem;
    color: #8283C0;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
}

/*.tabs {*/
/*    display: flex;*/
/*    border-bottom: 1px solid #3E3D77;*/
/*    margin-bottom: 1rem;*/
/*}*/

.tabs__tab {
    display: flex;
    align-items: center;
    height: 3.5rem;
    padding: 0 1rem;
    font-size: 0.95rem;
    color: #8283C0;
    margin-bottom: -1px;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    user-select: none;
    transition: 150ms;
    background-image: linear-gradient(to top, transparent, transparent);
    background-position: 0 2px;
    background-repeat: no-repeat;
    position: relative;
}

.tabs__tab_active {
    border-color: #4E7CFF;
    color: #fff;
}
body.light .tabs__tab_active {
    border-color: #3e3d77;
    color: #1a1944;
}
.tabs__tab:hover {
    background-image: linear-gradient(to top, rgba(255,255,255,0.025), transparent);
}

.tabs__tab_active:hover {
    background-image: linear-gradient(to top, transparent, transparent);
}
.tabs_small .tabs__tab {
    font-size: 0.75rem;
}


.tabs__right-link {
    display: flex;
    align-items: center;
    margin-left: auto;
    color: #6769ae;
    font-weight: 700;
    font-size: 0.875rem;
    cursor: pointer;
}
.tabs__right-link:hover {
    color: #8386d7;
}
.tabs__tab_badged::after {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 4px;
    background-color: #ff3f3f;
    position: absolute;
    top: 16px;
    right: 6px;
}

.tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    margin-bottom: 2rem;
    background-color: #1C1F3E;
    border-radius: 0.5rem;
    padding: 4px;
    border: none;
    grid-auto-flow: column;
}
body.light .tabs {
    background-color: #EEEEEE;
}

.tabs__tab {
    color: #8C90CA;
    font-weight: 500;
    justify-content: center;
    height: 2.5rem;
    font-size: 0.875rem;
    margin-bottom: -2px;
    border-radius: 0.5rem;
    border: none;
}
.tabs__tab_active {
    background-color: #2B2F5B;
    color: #ffffff;
}
body.light .tabs__tab_active {
    background-color: #CCCCCC;
    color: #000;
}

.tabs__tab .amount{
    position: absolute;
    right: .5rem;
    border-radius: 50%;
    background: #2B2F5B;
    padding: 0 .5rem;
    line-height: 1.4rem;
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1;
    color: #FFF;
}
.tabs__tab_active .amount{
    background: #1C1F3E;
}

.rank-icon {
    width: 1.25rem;
    height: 1.25rem;
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: center;
}


.rank-icon_1 {
    background-image: url("/img/ui/ranks/rank_1.png");
}

.rank-icon_2 {
    background-color: #0f0;
}

.arrow-down {
    width: 0.5rem;
    height: 0.5rem;
    transform: rotate(45deg);
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    margin-left: 1rem;
    margin-bottom: 0.25rem;
}
body.light .arrow-down {
    border-bottom: 2px solid #7e7ead;
    border-right: 2px solid #7e7ead;
}
.arrow-down.smaller{
    border-bottom: 2px solid #7e7ead;
    border-right: 2px solid #7e7ead;
    width: 0.4rem;
    height: 0.4rem;
}
.arrow-down.small{
    border-bottom: 1px solid #7e7ead;
    border-right: 1px solid #7e7ead;
    width: 0.3rem;
    height: 0.3rem;
}

.arrow-right {
    width: 0.5rem;
    height: 0.5rem;
    transform: rotate(-45deg);
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    margin-left: 1rem;
    margin-bottom: 0.25rem;
}
body.light .arrow-right {
    border-bottom: 2px solid #7e7ead;
    border-right: 2px solid #7e7ead;
}
.arrow-right.small{
    border-bottom: 1px solid #7e7ead;
    border-right: 1px solid #7e7ead;
    width: 0.3rem;
    height: 0.3rem;
}

.arrow-left {
    width: 0.5rem;
    height: 0.5rem;
    transform: rotate(135deg);
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    margin-left: 1rem;
    margin-bottom: 0.25rem;
}
.arrow-left.grey {
    border-bottom: 2px solid #7e7ead;
    border-right: 2px solid #7e7ead;
}
body.light .arrow-left {
    border-bottom: 2px solid #7e7ead;
    border-right: 2px solid #7e7ead;
}

.modal:has(> .wallet){
    width: clamp(18rem, calc(100vw - 2rem), 25rem);
}

.modal-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    visibility: hidden;
    opacity: 0;
    z-index: 500;
    overflow-y: auto;
    align-items: flex-start;
    /*background-color: var(--color-overlay-background);*/
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
.modal-wrap.shown {
    visibility: visible;
}
.modal-wrap .modal {
    min-width: 20rem;
    max-width: calc(100% - 2rem);
    position: relative;
    margin-top: 10rem;
    z-index: 1;
    margin-bottom: 1rem;
}
.modal-wrap .veil {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    pointer-events: none;
}

.modal-wrap .content {
    /*background-color: var(--color-overlay-background);*/
    /*padding: 1rem;*/
    /*border-radius: 1rem;*/
    /*max-width: 800px;*/
}

.modal-wrap .modal > .close-button {
    display: flex;
    font-family: "Gotham Pro", "sans-serif";
    justify-content: center;
    align-items: center;
    width: 1.5rem;
    height: 1.5rem;
    position: absolute;
    right: 1rem;
    top: 1rem;
    font-weight: 600;
    border-radius: 100%;
    cursor: pointer;
    z-index: 15;
    font-size: 1.4rem;
    line-height: 1.4rem;
    color: #545884;
    border: 2px #545884 solid;
}

@media (max-width: 800px) {
    .modal-wrap .modal.mobile-popup > .close-button {
        position: fixed;
        top: initial;
        bottom: 1rem;
        left: 50%;
        width: 3.125rem;
        height: 3.125rem;
        border-radius: 3rem;
        background-color: var(--color-green);
        box-shadow: 0 0 1rem #a3dc8ea6;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 1.8rem;
        line-height: 2rem;
        font-weight: 500;
        cursor: pointer;
        flex-shrink: 0;
        transform: translateX(-50%);
        border: none;
        color: #FFF;
    }

    .modal-wrap .modal.mobile-popup{
        margin-top: auto;
        margin-bottom: 6rem;
    }

    .modal-wrap .modal.mobile-popup .content{
        max-height: calc(100dvh - 6rem);
        overflow: auto;
    }

}

.modal-wrap .modal > .close-button:hover {
    border-color: #AAAAAA;
    color: #AAAAAA;
}
.modal-wrap .modal > .close-button.white {
    background-color: rgba(255,255,255,0.5);
}
.modal-wrap .modal > .close-button.white:hover {
    background-color: rgba(255,255,255,1);
}

.modal-wrap .content .modal-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem;
    background-color: #edf2f7;
    border-radius: 0.15rem 0.15rem 0 0;
}
.modal-wrap .content .modal-header h2 {
    font-weight: 300;
    font-size: 1.25rem;
}

.modal__button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    background-color: #787BF7;
    color: #fff;
    font-weight: 700;
    font-size: 0.75rem;
    height: 2.5rem;
    border-radius: 0.35rem;
    padding: 0 2rem;
    cursor: pointer;
    outline: none;
    border: none;
    flex-shrink: 0;
}
.modal__button.btn-danger{
    background-color: #e71d0c;
}
.modal__button_outlined {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    border: 2px solid #787BF7;
    background-color: transparent;
    color: #333;
    font-weight: 700;
    font-size: 0.75rem;
    height: 2.5rem;
    border-radius: 0.35rem;
    padding: 0 2rem;
    cursor: pointer;
    outline: none;
    flex-shrink: 0;
}
.modal__button_outlined.btn-danger {
    border: 2px solid #e71d0c;
}

.modal-title{
    font-size: 1.2rem;
    line-height: 1.4rem;
    font-weight: 600;
    color: #FFF;
    font-style: italic;
}

body.light .modal-title{
    color: #0B0D31;
}

.toast {
    position: fixed;
    background-color: #fff;
    color: #000000;
    z-index: 50000;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    border-radius: 0.25rem;
    box-shadow: 0 2px 15px #00000040;
}

.pad-surface{
    background: #2C2B64;
    border-radius: 1rem;
}
.pad-surface p{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
}


@media (max-width: 800px) {
    .modal-wrap .content {
        /*margin-top: 1rem;*/
    }
}
@media (max-width: 600px) {
    .modal-wrap .content {
        min-width: 20rem;
    }
    .modal-wrap .modal {
        margin-top: 1rem;
    }
    .modal-wrap .modal>.close-button {
        position: fixed;
    }
}

@media (max-width: 400px) {
    .modal-wrap .modal {
        margin-top: 1rem;
    }
    .modal-wrap .modal>.close-button {
        top: 1rem;
        right: 1rem;
    }
}

.spinner {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-width: 100vw;
    /*max-height: 100vh;*/
    visibility: hidden;
    opacity: 0;
    z-index: 5;
}
.spinner.shown {
    visibility: visible;
}

.spinner .message {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 50%;
    margin-left: -9rem;
    width: 18rem;
    height: 80px;
    color: #3D3E6D;
    font-size: 1.5rem;
    text-align: center;
    visibility: hidden;
    opacity: 0;
    font-weight: 700;
    transform: scale(0);
    transition: 0.25s;
}
.spinner .message.shown {
    visibility: visible;
    opacity: 1;
    transform: scale(1);
}

.spinner .roller {
    display: inline-block;
    left: 50%;
    margin-left: -40px;
    position: absolute;
    width: 80px;
    height: 80px;
    transform: scale(1);
    opacity: 1;
    transition: 0.25s;
}
.spinner .roller.hidden {
    transform: scale(0);
    opacity: 0;
}
.spinner .roller div {
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    transform-origin: 40px 40px;
}
.spinner .roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--color-blue);
    margin: -4px 0 0 -4px;
}
.spinner .roller div:nth-child(1) {
    animation-delay: -0.036s;
}
.spinner .roller div:nth-child(1):after {
    top: 63px;
    left: 63px;
}
.spinner .roller div:nth-child(2) {
    animation-delay: -0.072s;
}
.spinner .roller div:nth-child(2):after {
    top: 68px;
    left: 56px;
}
.spinner .roller div:nth-child(3) {
    animation-delay: -0.108s;
}
.spinner .roller div:nth-child(3):after {
    top: 71px;
    left: 48px;
}
.spinner .roller div:nth-child(4) {
    animation-delay: -0.144s;
}
.spinner .roller div:nth-child(4):after {
    top: 72px;
    left: 40px;
}
.spinner .roller div:nth-child(5) {
    animation-delay: -0.18s;
}
.spinner .roller div:nth-child(5):after {
    top: 71px;
    left: 32px;
}
.spinner .roller div:nth-child(6) {
    animation-delay: -0.216s;
}
.spinner .roller div:nth-child(6):after {
    top: 68px;
    left: 24px;
}
.spinner .roller div:nth-child(7) {
    animation-delay: -0.252s;
}
.spinner .roller div:nth-child(7):after {
    top: 63px;
    left: 17px;
}
.spinner .roller div:nth-child(8) {
    animation-delay: -0.288s;
}
.spinner .roller div:nth-child(8):after {
    top: 56px;
    left: 12px;
}
@keyframes lds-roller {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}



.custom-select {
    display: flex;
    align-items: center;
    height: 3rem;
    position: relative;
    border: 1px solid #55657E;
    border-radius: 0.625rem;
    padding: 0 0 0 1rem;
    cursor: pointer;
    user-select: none;
}
.custom-select_expanded,
.custom-select:hover {
    border: 1px solid #3c3b8c;
}


.custom-select__icon-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1rem;
    height: 2rem;
    margin-right: 0.75rem;
}
.custom-select__value {
    color: #fff;
    font-size: 0.875rem;
    padding-right: 0.75rem;
}
body.light .custom-select__value {
    color: #2c2c81;
}

.custom-select__counter {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #5B4CF1;
    font-size: 0.75rem;
    color: #fff;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 2rem;
    margin-right: 2.25rem;
    visibility: hidden;
}

.custom-select__arrow {
    position: absolute;
    right: 1rem;
    top: 1.05rem;
}


.custom-select__dropdown {
    width: 20rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
    grid-gap: 0.2rem 1rem;
    position: absolute;
    left: 0;
    top: 3.5rem;
    padding: 1rem;
    background-color: #2A3159;
    border-radius: 0.625rem;
    visibility: hidden;
    opacity: 0;
    transition: opacity 150ms;
    z-index: 50;
}

.custom-select__dropdown.scrollable{
    display: flex;
    flex-flow: column;
}
body.light .custom-select__dropdown {
    background-color: #fff;
    box-shadow: 0 0 1rem #0000000d;
}
.custom-select__dropdown_single {
    grid-template-columns: 1fr;
    width: 100%;
}
.custom-select__dropdown_wide {
    width: 51.75rem;
}
.custom-select_expanded .custom-select__dropdown {
    visibility: visible;
    opacity: 1;
}

.custom-select__option {
    display: flex;
    align-items: center;
    color: #8283C0;
    font-size: 0.75rem;
    position: relative;
    word-break: break-word;
    cursor: pointer;
    width: 100%;
}
.custom-select__option_selected {
    color: #b1b1fa;
}

.custom-select__option::before {
    content: '';
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1rem;
    height: 1rem;
    border-radius: 0.25rem;
    border: 1px solid #464697;
    margin-right: 0.5rem;
    flex-shrink: 0;
}

.option-icon.custom-select__option::before {
    display: none;
}

.option-icon.custom-select__option_selected::after {
    display: none;
}


.custom-select__option_selected::before {
    border-color: #5B4CF1;
}
.custom-select__option_selected::after {
    content: '';
    display: block;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 0.15rem;
    background-color: #5B4CF1;
    position: absolute;
    left: calc(0.25rem + 1px);
}
.custom-select__dd-close-btn {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.5rem;
    height: 1.5rem;
    right: 1rem;
    top: 1rem;
    font-weight: 600;
    border-radius: 100%;
    cursor: pointer;
    z-index: 15;
    font-size: 1.4rem;
    color: #545884;
    border: 2px #545884 solid;
}
.custom-select__dd-close-btn.white{
    color: #ffffff;
    border: 2px #ffffff solid;
}

/*body.light .custom-select__dd-close-btn {*/
/*    border: 1px solid #e6e6ef;*/
/*    color: #383765;*/
/*}*/

.show-more {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.show-more__progress-track {
    width: 10rem;
    max-width: 100%;
    height: 0.5rem;
    background-color: #383F75;
    border-radius: 0.5rem;
    margin-bottom: 0.5rem;
}
body.light .show-more__progress-track {
    background-color: #ffffff;
    border: 1px solid #ccc;
}
.show-more__progress-bar {
    height: 0.5rem;
    border-radius: 0.5rem;
    background-color: #4E7CFF;
}
body.light .show-more__progress-bar {
    position: relative;
    top: -1px;
}
.show-more__text {
    font-size: 0.625rem;
    color: #5C6290;
}

.show-more__button {
    display: flex;
    align-items: center;
    height: 2.5rem;
    margin-top: 0.75rem;
    padding: 0 2rem;
    border: 1px solid #787BF7;
    border-radius: 0.5rem;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
}
body.light .show-more__button {
    color: #383f75;
}

.status-circle {
    width: 10px;
    height: 10px;
    border-radius: 0.6rem;
    position: relative;
    flex-shrink: 0;
}
.status-circle::before {
    content: '';
    display: block;
    width: 1rem;
    height: 1rem;
    position: absolute;
    left: -3px;
    top: -3px;
    opacity: 0.25;
    border-radius: 1rem;
}
.status-circle::after {
    content: '';
    display: block;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 0.6rem;
    filter: blur(5px);
}


.status-circle_green {
    background-color: var(--color-green);
}

.status-circle_green::before {
    background-color: var(--color-green);
}

.status-circle_green::after {
    background-color: var(--color-green);
}



.status-circle_orange {
    background-color: var(--color-orange);
}

.status-circle_orange::before {
    background-color: var(--color-orange);
}

.status-circle_orange::after {
    background-color: var(--color-orange);
}


.status-circle_gray {
    background-color: #999;
}

.status-circle_gray::before {
    background-color: #999;
}

.status-circle_gray::after {
    background-color: #999;
}


.progress-bar {
    width: 100%;
    height: 0.5rem;
    border-radius: 0.5rem;
    background-color: #1E1D4E;
}
body.light .progress-bar {
    background-color: #f3f3fc;
}
.progress-bar__track {
    height: 0.5rem;
    border-radius: 0.5rem;
    min-width: 0.5rem;
}

.progress-bar__track_green {
    background-color: var(--color-green);
}

.progress-bar__track_blue {
    background-color: var(--color-blue);
}

.user-avatar {
    position: relative;
    width: 72px;
    height: 72px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}
.user-avatar__progress {
    position: absolute;
    left: -4px;
    top: -4px;
}
.user-avatar__image-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 70px;
    height: 70px;
    /*background-color: #5B4CF1;*/
    flex-shrink: 0;
    position: absolute;
    left: 0px;
    top: 0px;
    border-radius: 50px;
}
.user-avatar__image {
    max-width: 100%;
    max-height: 100%;
    min-width: 45px;
}

.wallet {
    display: flex;
    flex-direction: column;
    background-color: #181A32;
    padding: 1rem 0;
    border-radius: .5rem;
    width: 100%;
    max-width: 25rem;
    position: relative;
    flex-grow: 1;
    height: 1px;
}

body.light .wallet {
    background-color: #FFFFFF;
}

.wallet .spinner {
    border-radius: 1rem;
    background-color: rgba(255, 255, 255, 0.75);
}

#wallet__deposit,
#wallet__payout {
    display: flex;
    flex-direction: column;
    max-height: 100%;
    padding: 1rem;
}

#wallet-payout-fields{
    overflow: auto;
}

.wallet__title {
    text-align: center;
    font-weight: 700;
    font-size: 1.15rem;
    margin-bottom: 1.5rem;
}

.wallet__sub-title {
    font-weight: 700;
    margin-bottom: 1rem;
    font-size: .75rem;
    line-height: 1rem;
}

.wallet__payment-systems {
    display: grid;
    grid-gap: 0.5rem;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    overflow-y: auto;
    flex-grow: 1;
    /*padding: 0 1rem;*/
    min-height: 5rem;
    /*max-height: 20rem;*/
}

.wallet__payment-system {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 2rem;
    /*background-color: #f4f5fe;*/
    border: 2px solid transparent;
    cursor: pointer;
}

.wallet__payment-system_active {
    /*border: 2px solid #787bf7;*/
}

.wallet__payment-system input {
    display: none;
}

.currency-plate-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2rem;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all .5s;
}
.currency-plate input:checked+.currency-plate-icon {
    transform: scale(1.2);
    box-shadow: #999AE2 0 0 2px;
}

.currency-plate input {
    display: none;
}

.wallet__payment-logo {
    max-width: 80%;
    max-height: 2rem;
    object-fit: contain;
}

.wallet__fast-sums {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 0 0.5rem;
}

.wallet__fast-sum {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.5rem;
    border-radius: 0.5rem;
    background-color: #2B2F5B;
    margin: 1rem 0;
    font-size: 0.75rem;
    font-weight: 700;
    color: #FFF;
    cursor: pointer;
}
body.light .wallet__fast-sum{
    background-color: #EEEEEE;
    color: #000;
}

.wallet__fast-sum:hover {
    background-color: #ebecff;
}

.wallet__hint {
    font-size: 0.75rem;
    color: #8283C0;
    margin-bottom: 1rem;
}

.wallet__button {
    display: flex;
    justify-content: center;
    align-items: center;
    /*width: auto;*/
    /*margin-right: auto;*/
    background-color: var(--color-green);
    color: #000;
    font-weight: 700;
    font-size: 0.75rem;
    height: 2.5rem;
    border-radius: 0.35rem;
    padding: 0 2rem;
    cursor: pointer;
    outline: none;
    border: none;
    flex-shrink: 0;
}

.wallet__button.disabled{
    background-color: #2B2F5B;
    color: #8C90CA;
}

.wallet__button_outlined {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    margin-right: auto;
    border: 2px solid #787BF7;
    background-color: transparent;
    color: #333;
    font-weight: 700;
    font-size: 0.75rem;
    height: 2.5rem;
    border-radius: 0.35rem;
    padding: 0 2rem;
    cursor: pointer;
    outline: none;
    flex-shrink: 0;
}

.wallet__button_text {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    background-color: transparent;
    color: #8283C0;
    font-size: 0.75rem;
    height: 2.5rem;
    border-radius: 0.35rem;
    padding: 0 2rem;
    cursor: pointer;
    outline: none;
    border: none;
    flex-shrink: 0;
    font-style: normal;
    font-weight: 500;
    line-height: 110%;
}

.wallet__no-payout-title {
    text-align: center;
    font-size: 1.15rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.wallet__no-payout-desc {
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.25;
    margin-bottom: 1.5rem;
}

.wallet__no-payout-providers {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
    grid-gap: 0.5rem;
}

.wallet__no-payout-provider {
    display: flex;
    width: 100%;
    height: 4rem;
    justify-content: center;
    align-items: center;
    border: 2px solid #eaeaf8;
    border-radius: 0.5rem;
    padding: 0.5rem;
}

.wallet__no-payout-provider:hover {
    border: 2px solid #c3c3ea;
}

.wallet__no-payout-provider-img {
    max-width: 100%;
    max-height: 100%;
}

.wallet__paysystem {
    cursor: pointer;
    border-radius: 10px;
    background-color: #2B2F5B;
    height: 5rem;
    display: flex;
    justify-content: center;
    flex-flow: column;
    align-items: baseline;
}

.wallet__paysystem:last-child {
    border-bottom: none;
}

.wallet__paysystem_name {
    display: flex;
    flex-flow: row;
    justify-content: flex-start;
    font-size: 14px;
    font-weight: bold;
    margin: 3px 0;
}

.wallet__paysystem_limits {
    font-family: "Gotham Pro", "sans-serif";
    font-size: 10px;
    font-weight: 400;
    line-height: 10px;
    text-align: center;
    color: #8C90CA;
}

.wallet__paysystem_commission {
    font-size: .6rem;
    color: #8C90CA;
}

.wallet__verification-required {
    display: flex;
    flex-flow: column;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #dddddd;
    margin-bottom: 1.5rem;
    font-weight: 500;
}
body.light .wallet__verification-required{
    color: #444444;
}
.wallet__verification-required li {
    margin-top: 5px;
}

.wallet__verification-required a {
    margin-top: 20px;
    justify-content: center;
}

.wallet-money-available {
    display: flex;
    flex-flow: row;
    justify-content: space-between;
}

.wallet-money-available > div {
    font-weight: 700;
    font-size: 0.875rem;
    line-height: 1.5rem;
    margin-bottom: 1rem;
    display: flex;
    flex-flow: row;
}

.max-amount-btn {
    position: absolute;
    right: 5px;
    top: 22px;
    padding: 0.5rem;
    border-radius: 0.5rem;
    border: none;
    background-color: #A7DA94;
    color: #000;
}

.deposit-bonuses {
    display: flex;
    flex-flow: column;
    margin-top: 0.5rem;
}

.deposit-bonuses > * {
    margin-bottom: 0.5rem;
}

.deposit-bonus {
    display: grid;
    grid-template-columns: 2rem 3fr 2fr 1rem;
    padding: 0.5rem;
    border: #FFF6E7 1px solid;
    border-radius: 0.5rem;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.deposit-bonus.selected {
    background-color: #FFF6E7;
}

.deposit-bonus img {
}

.deposit-bonus .bonus-name {
    font-family: 'Montserrat';
    font-weight: bold;
    font-size: 0.75rem;
    line-height: 1rem;
    color: #3D3E6D;
}

.deposit-bonus .deposit-sum {
    display: flex;
    justify-content: flex-end;
    padding-right: 0.5rem;
    font-style: normal;
    font-weight: 800;
    font-size: 0.75rem;
    line-height: 1rem;
    letter-spacing: 0.5px;
    color: #FFC660;
}

.money-value {
    font-family: "Gotham Pro", sans-serif;
    font-weight: 800;
    font-size: 1rem;
    line-height: 1.1rem;
    color: #fff;
    margin-right: auto;
}

body.light .money-value {
    color: #252560;
}

body.light .wallet-selector {
    background-color: #ffffff;
}

body.light .wallet-selector__dropdown {
    background-color: #ffffff;
}

body.light .wallet-selector__balance-name {
    color: #252560;
}

.money-value-rest {
    font-family: "Gotham Pro", sans-serif;
    font-weight: 800;
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.5);
}

body.light .money-value-rest {
    color: #444485;
}

.deposit__fields{
    overflow: auto;
}

.additional-payin-req{
    display: none;
}

.additional-requisites .additional-payin-req{
    display: block;
    overflow: auto;
}


.additional-payin-req > * {
    margin-bottom: .5rem;
}

#wallet__deposit{
    /*height: 100%;*/
    /*overflow: auto;*/
}

#wallet__deposit .deposit-amount-label {
    display: none;
}

/*#wallet__deposit.additional-requisites .deposit-amount-label {*/
/*    display: block;*/
/*}*/

/*#wallet__deposit.additional-requisites .wallet__fast-sums {*/
/*    display: none;*/
/*}*/

/*#wallet__deposit.additional-requisites .dep-amount-input {*/
/*    display: none;*/
/*}*/

/*#wallet__payout .payout-amount-label {*/
/*    display: none;*/
/*}*/

/*#wallet__payout.additional-requisites .payout-amount-label {*/
/*    display: block;*/
/*}*/

/*#wallet__payout.additional-requisites .out-amount-input {*/
/*    display: none;*/
/*}*/


.dep-amount-sums{
    display: none;
}
.wallet.group-selected .dep-amount-sums{
    /*display: block;*/
}

#wallet__deposit.additional-requisites .dep-amount-sums{
    display: block;
}

.wallet-pad{
    width: 100%;
    background-color: #1C1F3E;
    padding: 0 -1rem;
    font-weight: 500;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
}

.wallet-pad img{
    max-width: 4rem;
    object-fit: contain;
}

#current-group,
#current-system{
    margin-top: -1rem;
}

#current-group .label,
#current-system .label{
    max-width: 60%;
}

.desktop #current-group .label,
.desktop  #current-system .label{
    max-width: 60%;
    padding-right: 2.5rem;
}

#current-group .label .text-subtitle,
#current-system .label .text-subtitle{
    display: flex;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

@media (max-width: 600px) {
    .wallet__title {
        margin-bottom: 0.5rem;
    }

    #wallet__deposit, #wallet__payout {
        display: flex;
        flex-direction: column;
        overflow: auto;
    }
}


.payout-confirm-modal,
.payout-success-modal
{
    background-color: #181A32;
    border-radius: 1rem;
    padding: 1.5rem;
    text-align: center;
    width: 25rem;
}
.payout-confirm-modal > img,
.payout-success-modal > img{
    margin-top: 2rem;
    width: 96px;
    height: 96px;
}

.payout-confirm-modal .hidden-menu__first-link{
    width: 100%;
}
.payout-success-modal .hidden-menu__first-link{
    width: 100%;
    background-color: #211F5E;
}

@media (max-width: 600px) {
    .payout-confirm-modal,
    .payout-success-modal
    {
        width: 100%;
        padding: 1rem;
    }

    .payout-confirm-modal > img,
    .payout-success-modal > img{
        margin-top: .5rem;
        width: 96px;
        height: 96px;
    }
}


.cursor-pointer{
    cursor: pointer;
}

.wallet[data-group="4"] .wallet__paysystem{
    height: 3.5rem;
    border: 2px solid transparent;
}

.wallet[data-group="4"] .wallet__payment-system{
    height: auto;
}

.wallet[data-group="4"] .wallet__paysystem_name{
    margin: 0 5px;
    flex-flow: column;;
}

.wallet[data-group="4"] .wallet__paysystem_name small{
    font-weight: 400;
    color: #8c90ca;
}

.wallet[data-group="4"] .wallet__paysystem_limits{
    margin-top: 5px;
}

.wallet[data-group="4"] .wallet__payment-logo{
    max-height: 1.5rem;
}

.wallet[data-group="4"] .input__title{

}

.wallet[data-group="4"] .input__field{
    background-color: #1c1f3e;
    font-size: 1.25rem;
    border: 2px solid transparent;
}

.wallet[data-group="4"] .wallet__paysystem:has(> div.wallet__payment-system_active),
.wallet[data-group="4"] .input__field:focus{
    border-color: #7582F2;
}

.wallet[data-group="4"] .input__ddd{
    position: relative;
    margin-top: 5px;
}

.wallet[data-group="4"] .input__ddd .wallet__payment-logo{
    width: auto;
    height: 1.6rem;
    max-height: 1.6rem;
    max-width: 100%;
}

.wallet[data-group="4"] .text-limit{
    color: #424673;
    font-size: .7rem;
    font-weight: bold;
}

.wallet[data-group="4"] .input__wrap .wallet-crypto-group-data{
    position: absolute;
    right: 0;
    bottom: 0;
    top: 0;
    display: flex;
    align-items: center;
    padding: 0 1rem;
}

.wallet[data-group="4"] .input__wrap .wallet-crypto-group-data span{
    margin-left: .5rem;
}

/*.wallet[data-group="4"] .wallet__payment-system{
    border: 2px solid #1c1f3e;
}*/

.wallet[data-group="4"] .crypt_wallet__address{

}

.wallet[data-group="4"] .input__value{
    background-color: #1c1f3e;
    padding: 1rem;
    border-radius: 10px;
    overflow-wrap: break-word;
    margin-right: .5rem;
    max-width: 70%;
}

.wallet[data-group="4"] .input__value span{
    font-size: .8rem;
}

.wallet[data-group="4"] .address-value{
    display: flex;
    margin-top: 5px;
}

.wallet[data-group="4"] .qr-img{
    width: 30%;
    height: auto;
}

.wallet[data-group="4"] .wallet__payment-system-calc{
    padding-bottom: 2rem;
}

.wallet[data-group="4"] .warning-info{
    color: #F79E1B;
    background: rgba(247, 158, 27, .15);
    padding: .75rem;
    font-size: .75rem;
    border-radius: .75rem;
    line-height: 1rem;
}

.wallet[data-group="4"] .wallet__button{
    background-color: #181A32;
    color: #8C90CA;
    position: relative;
}

.wallet[data-group="4"] .wallet__button span{
    margin-left: .25rem;
}

.wallet[data-group="4"] .wallet-crypto-group-data button{
    margin-right: .25rem;
}

.dep-bonus-info .title{
    font-family: Gotham Pro;
    font-weight: 600;
    font-size: 18px;
    line-height: 16px;
}

.dep-bonus-info .switcher-label{
    font-family: Gotham Pro;
    font-weight: 400;
    font-size: 11px;
    line-height: 14px;
    color: #8186BD;
}

.dep-bonus-info .dep-bonus-wrapper{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    border: 2px solid #32D54B;
    border-radius: 1rem;
    background-color: #2E2461;
    height: 6rem;
    overflow: visible;
}
.dep-bonus-info .dep-bonus-wrapper .bonus-title{
    font-family: Gotham Pro;
    font-weight: 700;
    font-size: 12px;
    line-height: 19px;
    vertical-align: middle;
}
.dep-bonus-info .dep-bonus-wrapper .dep-amount{
    font-family: Gotham Pro;
    font-weight: 400;
    font-size: 11px;
    line-height: 14px;
    color: #8186BD;
}
.dep-bonus-info .dep-bonus-wrapper .bonus-timer{
    font-family: Gotham Pro;
    font-weight: 700;
    font-size: 10px;
    line-height: 14px;
    background: #64599A;
    border-radius: 0.5rem;
    color: #FFFFFF;
    padding: .1rem .8rem;
}

.dep-bonus-info .dep-bonus-content{
    position: absolute;
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    right: 0;
    left: 0;
    bottom: 0;
    width: 75%;
    height: 100%;
    background: linear-gradient(90deg, #2E2461A0, #2E246100);
    z-index: 1;
    padding: 0.5rem 1rem;
    border-bottom-left-radius: 1rem;
    border-top-left-radius: 1rem;
}

.dep-bonus-info .dep-bonus-img img{
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    object-fit: contain;
    border-radius: 1rem;
    z-index: 0;
    -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0.1), rgba(0,0,0,1));
    mask-image: linear-gradient(to right, rgba(0,0,0,0.1), rgba(0,0,0,1));
}

.dep-bonus-info .dep-bonus-wrapper .check-icon{
    position: absolute;
    top: -7px;
    right: -7px;
    z-index: 2;
}


.info-icon-white::after {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "serif";
    content: "i";
    font-size: .75rem;
    line-height: .75rem;
    font-weight: 500;
    height: 1rem;
    width: 1rem;
    border-radius: 50%;
    color: #F57D00;
    background-color: #FFFFFF;
}


.no-records {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 2rem;
    border-radius: 1rem;
    text-align: center;
    /*border: 1px solid #33346a;*/
    /*background-color: #2c2b63;*/
    margin: 0 auto;
}
body.light .no-records {
    border: none;
    /*background-color: #ffffff;*/
}
.no-records__title {
    color: #fff;
    font-weight: 700;
    font-size: 1.15rem;
}
body.light .no-records__title {
    color: #2c2b63;
}

.no-records__hint {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    color: #9996b1;
}

@media (max-width: 600px) {
    .no-records {
        padding: 1.5rem;
    }
    .no-records__title {
        font-size: 0.875rem;
    }
    .no-records__hint {
        font-size: 0.75rem;
    }
}

.confirm-modal {
    background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem;
    border-radius: 1rem;
}
.confirm-modal__msg {
    max-width: 17rem;
    font-size: 1.315rem;
    font-weight: 700;
    color: #3D3E6D;
    margin-bottom: 2rem;
    text-align: center;
}
.confirm-modal__buttons {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}
.confirm-modal__no-btn {
    background-color: #EF8E8B;
    min-width: 7rem;
    height: 2.75rem;
    border: none;
    padding: 0 2rem;
    border-radius: 0.5rem;
    color: #fff;
    font-size: 0.875rem;
    font-weight: 700;
    cursor: pointer;
    outline: none;
}
.confirm-modal__no-btn:hover {
    background-color: #f5837f;
}
.confirm-modal__yes-btn {
    margin-left: 1rem;
    padding: 0 2rem;
    min-width: 7rem;
    height: 2.75rem;
    border-radius: 0.5rem;
    background-color: transparent;
    border: 2px solid #787BF7;
    color: #787BF7;
    font-weight: 700;
    font-size: 0.875rem;
    outline: none;
    cursor: pointer;
}
.confirm-modal__yes-btn:hover {
    border-color: #6367ff;
    color: #6367ff;
}

.lang-selector {
    display: flex;
    align-items: center;
    height: 2.5rem;
    position: relative;
    padding: 0 1rem 0 0.5rem;
    border-radius: 0.5rem;
    background-color: transparent;
    transition: 250ms;
    cursor: pointer;
}
#layout-wrap.collapsed .lang-selector {
    justify-content: center;
    padding: 0 0.5rem 0 0.5rem;
}
.lang-selector.expanded,
.lang-selector:hover {
    background-color: #1e1d4b;
}
body.light .lang-selector.expanded,
body.light .lang-selector:hover {
    background-color: #d5d5e8;
}
.lang-selector__flag {
    width: 1.5rem;
    /*border-radius: 1.5rem;*/
}
.lang-selector__dropdown {
    display: none;
    flex-direction: column;
    opacity: 0;
    transform: scale(0);
    position: absolute;
    bottom: 3rem;
    left: 0;
    width: 10rem;
    border-radius: 0.5rem;
    background-color: #28285f;
    z-index: 10;
}
body.light .lang-selector__dropdown {
    background-color: #ffffff;
    box-shadow: 0 0 1rem #00000030;
}
#layout-wrap.collapsed .lang-selector__dropdown {
    width: 10rem;
}
.lang-selector__dropdown::before {
    content: '';
    display: block;
    width: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #28285f;
    position: absolute;
    bottom: -10px;
    left: calc(50% - 5px);
}
body.light .lang-selector__dropdown::before {
    border-top: 10px solid #fff;
}
#layout-wrap.collapsed .lang-selector__dropdown::before {
    left: 0.6rem;
}
.lang-selector__value {
    margin-left: 0.5rem;
    color: #8283C0;
    font-size: 0.75rem;
    font-weight: 700;
    margin-right: auto;
}
#layout-wrap.collapsed .lang-selector__value,
#layout-wrap.collapsed .arrow-down {
    display: none;
}
.lang-selector__option {
    padding: 0.5rem 0.5rem;
    font-size: 0.75rem;
    color: #8283C0;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
}
.lang-selector__option:hover {
    background-color: #2e2e6d;
}
body.light .lang-selector__option:hover {
    background-color: #eee;
}
.lang-selector__option:first-child {
    border-radius: 0.5rem 0.5rem 0 0;
}
.lang-selector__option:last-child {
    border-radius: 0 0 0.5rem 0.5rem;
}

.theme-switcher {
    display: flex;
    justify-content: center;
    align-items: center;
}
.theme-switcher__am,
.theme-switcher__pm {
    font-family: "Gotham Pro", sans-serif;
    font-size: 1rem;
    color: #8283C0;
    font-weight: 600;
}
.theme-switcher__control {
    height: 2rem;
    width: 4rem;
    background-color: #2C2B63;
    border-radius: 1rem;
    margin: 0 0.5rem;
    position: relative;
    cursor: pointer;
}
body.light .theme-switcher__control {
    background-color: #f3f3fc;
}
.theme-switcher__moon {
    position: absolute;
    left: 0.5rem;
    top: 0.5rem;
}
.theme-switcher__sun {
    position: absolute;
    right: 0.5rem;
    top: 0.5rem;
}
.theme-switcher__knob {
    position: absolute;
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    background-color: #1A1944;
    border-radius: 1.5rem;
    top: 0.25rem;
    left: calc(100% - 1.75rem);
    z-index: 5;
    transition: 150ms;
}
body.light .theme-switcher__knob {
    background-color: #d2d2ec;
}
.theme-switcher.dark .theme-switcher__knob {
    left: 0.25rem;
}
#layout-wrap.collapsed .theme-switcher {
    display: none;
}

#recovery-token-form,
#verify-email-form,
#verify-phone-form {
    flex-direction: column;
    padding: 3rem;
    background-color: #fff;
    border-radius: 1rem;
    width: 27rem;
    max-width: 100%;
}
.cabinet__vrf-hint {
    text-align: center;
    font-size: 1rem;
    margin-bottom: 1rem;
    font-weight: 500;
    color: #0B0D31;
}
.cabinet__vrf-label {
    display: flex;
    font-size: 0.75rem;
    color: #999;
    margin-bottom: 0.5rem;
}
.cabinet__vrf-code-input {
    height: 3rem;
    border-radius: 0.5rem;
    border: 1px solid #ccc;
    outline: none;
    padding: 0 0.5rem;
    font-size: 1rem;
    color: #333;
    width: 100%;
}
.cabinet__vrf-code-input:focus {
    border-color: #4E7CFF;
}
.cabinet__vrf-button {
    height: 3rem;
    border-radius: 0.625rem;
    border: none;
    background-color: #4E7CFF;
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    outline: none;
    cursor: pointer;
    margin-top: 2rem;
}

.cabinet__vrf-button:disabled{
    background-color: #4E7CFF30;
}

.ulogin-buttons-container {
    display: flex !important;
    width: auto !important;
    justify-content: center;
}
.ulogin-button-facebook {
    width: 2rem !important;
    height: 2rem !important;
    background-image: url(/img/auth/facebook.svg) !important;
    background-position: 0 0 !important;
    background-size: contain !important;
}
.ulogin-button-google {
    width: 2rem !important;
    height: 2rem !important;
    background-image: url(/img/auth/google.svg) !important;
    background-position: 0 0 !important;
    background-size: contain !important;
}

.ulogin-button-vkontakte {
    width: 2rem !important;
    height: 2rem !important;
    background-image: url(/img/auth/vk.svg) !important;
    background-position: 0 0 !important;
    background-size: contain !important;
}

.ulogin-button-odnoklassniki {
    width: 2rem !important;
    height: 2rem !important;
    background-image: url(/img/auth/odnoklassniki.svg) !important;
    background-position: 0 0 !important;
    background-size: contain !important;
}
.ulogin-button-mailru {
    width: 2rem !important;
    height: 2rem !important;
    background-image: url(/img/auth/mailru.svg) !important;
    background-position: 0 0 !important;
    background-size: contain !important;
}
.ulogin-dropdown-button {
    background: none !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 0.5rem solid transparent !important;
    border-right: 0.5rem solid transparent !important;
    border-top: 0.5rem solid #c0c1df !important;
    display: none !important;
    margin: 12px 5px 5px 5px !important;
}

.phone-select {
    display: flex;
    align-items: center;
    height: 2.5rem;
    border: none;
    border-bottom: 2px solid #d0d1e7;
    padding: 0 0.5rem;
    font-family: 'Gotham Pro', sans-serif;
    outline: none;
    font-size: 0.875rem;
    position: relative;
    width: 4rem;
    cursor: pointer;
}
.phone-select__dropdown {
    display: none;
    flex-direction: column;
    background-color: #fff;
    left: -6px;
    top: 44px;
    position: absolute;
    box-shadow: 0 0 1rem #00000026;
    border-radius: 0.25rem;
    width: 14rem;
    z-index: 5;
    overflow-y: auto;
    max-height: 15rem;
}
.phone-select.shown .phone-select__dropdown{
    display: flex;
}


@media (max-width: 600px) {
    .phone-select__dropdown {
        left: 1rem;
        top: 1rem;
        position: fixed;
        width: calc(100% - 2rem);
        max-height: calc(100% - 2rem) !important;
    }
}


.phone-select__option {
    display: flex;
    align-items: center;
    padding: 0.5rem;
    /*border-bottom: 1px solid #eee;*/
    cursor: pointer;
}
.phone-select__option:hover {
    background-color: #1C1F3E;
    border-radius: 10px;
}
.phone-select__option:last-child {
    border-bottom: none;
}
.phone-select__option-image {
    border-radius: 0.25rem;
    margin-right: 0.5rem;
}

.ai-baseLine{
    align-items: baseline !important;
}

.phone-select__dropdown::-webkit-scrollbar {
    width: 6px;
    height: 8px;
    background-color: rgba(255,255,255,.1);
    padding: 9px;
    border-radius: 10px;
}

.phone-select__dropdown::-webkit-scrollbar-thumb {
    background: #ceced8;
    width: 0;
    border-radius: 8px;
    padding: 4px;
}

.pagination {
    display: flex;
    list-style: none;
}

.pagination .page-item {
    width: 2rem;
    height: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #272660;
}

.pagination .page-item:first-child {
    border-radius: 0.5rem 0 0 0.5rem;
}

.pagination .page-item:last-child {
    border-radius: 0 0.5rem 0.5rem 0;
}
.pagination .page-item.disabled {
    pointer-events: none;
}

.pagination .page-link {
    width: 2rem;
    height: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #6e6d9e;
    text-decoration: none;
}
.pagination .page-item:hover {
    background-color: #302f72;
}
.pagination .page-item.active {
    background-color: #393886;
}

.pagination .page-item.active .page-link {
    color: #adabd8;
}

.switch {
    position: relative;
    display: inline-block;
    min-width: 2.6rem;
    height: 1.2rem;
    margin-right: 0.5rem;
}

.switch input {display:none;}

.switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.switch .slider:before {
    position: absolute;
    content: "";
    height: 0.8rem;
    width: 0.8rem;
    left: 0.25rem;
    bottom: 0.25rem;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

.switch input:checked + .slider {
    background-color: var(--color-blue);
}

.switch input:focus + .slider {
    box-shadow: 0 0 1px var(--color-blue);
}

.switch input:checked + .slider:before {
    transform: translateX(20px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 2rem;
}

.slider.round:before {
    border-radius: 50%;
}
.switch.big-switch{
    height: 2rem;
    min-width: 3.4rem;
}
.switch.big-switch .slider:before {
    height: 1.6rem;
    width: 1.6rem;
}

.switch.green-switch input:checked + .slider {
    background-color: var(--color-green-light);
}
.switch.green-switch input:focus + .slider {
    box-shadow: 0 0 1px var(--color-green-light);
}

.bonus-win__wrap {
    padding: 1.5rem 2rem 0.5rem 2rem;
    background-color: #fff;
    background: linear-gradient(131.05deg, #301161 37.5%, #ED1D49 91.52%);
    border-radius: 15px;
    z-index: 2;
    position: relative;
    width: 21.5rem;
}
.bonus-win__title {
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    text-align: center;
    margin-bottom: 1.5rem;
}
.bonus-win__description {
    margin: 1rem 0;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-family: Montserrat;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 20px;
    text-align: center;
}

.sections-names > *{
    margin-top: 1.6rem;
    color: var(--color-gray);
    font-family: 'Gotham Pro', sans-serif;
    position: relative;
    padding-left: 2.5rem;
    /*text-transform: uppercase;*/
}
.sections-names > * img{
    position: absolute;
    left: 0;
    top: -0.5rem;
}
.sections-names > *.active,*.done{
    color: white;
    font-weight: 600;
}
.sections-names > *.active:after {
    content: "✔";
    color: red;
    margin-left: 0.5rem;
}
.sections-names > *.done:after {
    content: "✔";
    color: green;
    margin-left: 0.5rem;
}
.section-wrapper{
    display: none;
}
.section-wrapper.active{
    display: initial;
}

.section-controls{
    display: flex;
    flex-flow: row;
    margin-top: auto;
    align-items: center;
}

.section-controls > button{
    display: none;
    justify-content: center;
    align-items: center;
    height: 3rem;
    border-radius: 0.5rem;
    border: none;
    background-color: var(--color-green);
    color: #000000;
    font-size: 0.875rem;
    font-family: 'Gotham Pro', sans-serif;
    cursor: pointer;
    outline: none;
    padding: 0 2rem;
    flex-grow: 1;
    font-weight: 600;
}
.section-controls > button.active{
    display: initial;
}
.sections-form .section-prev-btn{
    position: absolute;
    left: 1.5rem;
    top: 1.5rem;
    width: .8rem;
    height: .8rem;
    border-right: 2px white solid;
    border-bottom: 2px white solid;
    transform: rotate(135deg);
    cursor: pointer;
    display: none;
}
.sections-form .section-prev-btn.active{
    display: block;
}
.sections-form .section-prev-btn::after{
    content: "";
}
.section-controls > .section-next-btn,.section-done-btn{
    margin-left: auto;
}

.loading-dots {
    display: flex;
    justify-content: center;
    align-items: center;
}

.loading-dots .dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: #0B0D31;
    border-radius: 50%;
    margin: 0 5px;
    animation: loadingAnimation 1s infinite;
}

.loading-dots .dot:nth-child(2) {
    animation-delay: 0.2s;
}

.loading-dots .dot:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes loadingAnimation {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.5);
    }
    100% {
        transform: scale(1);
    }
}

body.light .chat-panel{
    background: linear-gradient(to right, #f1f1f1 0,#FFFFFFDD 100%);
}
.footer__links-section .chat-panel{
    width: 22rem;
}
.chat-panel{
    width: 100%;
    /*height: 8rem;*/
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1rem;
    border-radius: 1rem;
    background: #1C1F3E;
    margin: 1rem 0;
    border: #2C2B64 1px solid;
}
.chat-panel .title{
    display: flex;
    flex-flow: column;
    justify-content: center;
    flex-grow: 1;
    font-size: .875rem;
    color: #FFFFFF;
    font-weight: 500;
}
body.light .chat-panel .title {
    color: #55549b;
}
.chat-panel .items{
    display: flex;
    width: 100%;
    justify-content: space-evenly;
}
.chat-panel .chat-item{
    text-decoration: none;
    display: flex;
    flex-flow: column;
    font-size: .75rem;
    color: #8C90CA;
    font-weight: 600;
    justify-content: space-between;
    align-items: center;
    margin: 1rem;
    cursor: pointer;
    height: 3.6rem;
}

.chat-menu-btn{
    filter: grayscale(1);
    pointer-events: none;
}

.TalkMe-initialized .chat-menu-btn{
    filter: none;
    pointer-events: initial;
}

.img-drop-down{
    position: relative;
    display: flex;
    flex-flow: row;
    margin: 0.5rem 0;
    padding: 0.5rem;
    cursor: pointer;
    overflow: visible;
    align-items: center;
}
.img-drop-down__value,.img-drop-down__current-value{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: #0e0e0e;
    font-size: 0.625rem;
    font-weight: 500;
}
.img-drop-down__value{
    padding: 0.3rem 1rem;
}
.img-drop-down__value:hover{
    background-color: #4a556830;
}
.img-drop-down__values{
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    background-color: #FFFFFF;
    z-index: 4;
}
.img-drop-down.shown .img-drop-down__values{
    display: flex;
    flex-flow: column;
    width: 100%;
}


.img-drop-down .currency-icon{
    margin-right: .5rem;
}
.img-drop-down .arrow-down{
    position: absolute;
    top: calc(50% - .5rem);
    right: .5rem;
}

/* для элемента input c type="checkbox" */
.blue-white-checkbox>input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

/* для элемента label, связанного с .blue-white-checkbox */
.blue-white-checkbox>span {
    display: inline-flex;
    align-items: center;
    user-select: none;
    font-size: 0.75rem;
    color: #8C90CA;
    font-weight: 600;
}

/* создание в label псевдоэлемента before со следующими стилями */
.blue-white-checkbox>span::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    flex-grow: 0;
    border: 1px solid #5D5FEF;
    border-radius: 0.25em;
    margin-right: 0.5em;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 126% 126%;
}

/* стили при наведении курсора на checkbox */
.blue-white-checkbox>input:not(:disabled):not(:checked)+span:hover::before {
    border-color: #b3d7ff;
}

/* стили для активного чекбокса (при нажатии на него) */
.blue-white-checkbox>input:not(:disabled):active+span::before {
    background-color: #b3d7ff;
    border-color: #5D5FEF;
}

/* стили для чекбокса, находящегося в фокусе */
.blue-white-checkbox>input:focus+span::before {
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* стили для чекбокса, находящегося в фокусе и не находящегося в состоянии checked */
.blue-white-checkbox>input:focus:not(:checked)+span::before {
    border-color: #80bdff;
}

/* стили для чекбокса, находящегося в состоянии checked */
.blue-white-checkbox>input:checked+span::before {
    background-color: #5649E4;
    border-radius: 4.364px;
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg width='64' height='64' viewBox='0 0 64 64' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 32L28 42L46 22' stroke='white' stroke-width='5.5' stroke-linecap='round' stroke-linejoin='round' style='filter:drop-shadow(0px 0px 8px rgba(86,73,228,0.9));'/%3E%3C/svg%3E");
}

/* стили для чекбокса, находящегося в состоянии disabled */
.blue-white-checkbox>input:disabled+span::before {
    background-color: #e9ecef;
}

.support__float{
    right: 60px;
    bottom: 60px;
    position: fixed;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: flex-end;
    z-index: 500;
}
.support__float .support__item{
    position: relative;
    justify-content: center;
    align-items: center;
    height: 52px;
    width: 52px;
    border-radius: 50%;
    cursor: pointer;
    margin-top: 5px;
    display: none;
}
.support__float.shown .support__item{
    display: flex;
}
.support__float .support__item :first-child{
    color: #8C90CA;
    font-family: "Gotham Pro", "sans-serif";
    font-weight: 700;
    font-size: 0.875rem;
    position: absolute;
    right: 65px;
    word-break: keep-all;
    white-space: nowrap;
}
.support__float .support__item.main-icon {
    display: flex;
}
.support__float.shown .support__item.main-icon {
    display: none;
}

.wallet-wrapper{
    position: fixed;
    left: 0;
    top: 80px;
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    background-color: #000000B0;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    z-index: 700;
}
.wallet-wrapper.shown{
    display: flex;
}
.wallet-wrapper .user-wallet__pad{
    background-color: #1C1F3E;
    padding: .5rem;
}
body.light .wallet-wrapper .user-wallet__pad{
    background-color: #FAFAFAAA;
}
.wallet-wrapper .user-wallet{
    display: flex;
    flex-flow: column;
    background-color: #181A32;
    min-height: 8rem;
    max-height: calc(100dvh - 6rem);
    border-radius: .5rem;
    color: #FFF;
    width: 100%;
    margin: .5rem;
    overflow: hidden;
    width: clamp(20rem, 100%, 24rem);
    /*padding: .5rem;*/
}
body.light .wallet-wrapper .user-wallet{
    background-color: #FFFFFF;
    color: #000;
}

.user-wallet__header{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    color: #FFF;
    font-weight: 600;
    font-size: 1.2rem;
    line-height: 1.4rem;
}
body.light .user-wallet__header{
    color: #000;
}

.user-wallet__balance-title{
    color: #8C90CA;
    font-family: "Gotham Pro", "sans-serif";
    font-size: 0.75rem;
    font-weight: 600;
}

.user-wallet__balance .currency-icon{
    margin-right: .5rem;
}

.user-wallet__balance .wallet-selector__amount{
    margin-right: 0;
}
.user-wallet__balance .wallet-selector__amount-int{
    font-size: 1.5rem;
}
.user-wallet__balance .wallet-selector__amount-rest{
    font-size: 1.2rem;
}

.user-wallet__buttons{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 2.5rem;
    grid-gap: .4rem;
    background-color: #181A32;
    border-radius: 1rem;
    padding: .5rem;
}
.user-wallet__buttons > *{
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    border-radius: .5rem;
    color: #FFF;
    font-family: "Gotham Pro", "sans-serif";
    font-weight: 600;
    font-size: .75rem;
    cursor: pointer;
}
.user-wallet__buttons > *.active{
    background-color: #2B2F5B;
    border-radius: 1rem;
}
.user-wallet__buttons img{
    margin-right: .4rem;
}
/*.user-wallet__buttons .withraw-btn{*/
/*    background-color: #7582F1;*/
/*}*/
/*.user-wallet__buttons .disabled-btn{*/
/*    background-color: #cccccc;*/
/*}*/

.wallet__payment-systems.disabled{
    opacity: 0.3;
    pointer-events: none;
}

.wallet__payment-systems.system-selected{
    display: none;
}

.wallet__payment-systems.system-selected .wallet__paysystem{
    display: none;
}
.wallet__payment-systems.system-selected .wallet__paysystem.active{
    display: block;
}

.user-wallet__buttons{
    text-align: center;
}

.wallet-wrapper .user-wallet .tabs{
    margin-bottom: .5rem;
}

.wallet-wrapper .user-wallet .tabs__tab{
    font-size: .75rem;
}

#user-wallet__assets{
    display: flex;
    flex-flow: column;
    padding: 0 .5rem;
    max-height: calc(100vh - 27rem);
    max-height: calc(100dvh - 27rem);
    overflow-y: auto;
}

#user-wallet__assets .wallet-asset{
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-between;
    height: 3.5rem;
    cursor: pointer;
    border-bottom: #FFFFFF21 2px solid;
    flex-shrink: 0;
}
#user-wallet__assets .wallet-asset:last-child{
    border-bottom: none;
}
#user-wallet__assets .wallet-asset:hover{
    background-color: #1C1F3E;
}
body.light #user-wallet__assets .wallet-asset:hover{
    background-color: #EEEEEE;
}
#user-wallet__assets .asset-name :first-child{
    color: #FFF;
    font-weight: 600;
    font-family: "Gotham Pro", "sans-serif";
    font-size: 1rem;
}
#user-wallet__assets .asset-name :last-child{
    color: #CCC;
    font-weight: 400;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .625rem;
}
body.light #user-wallet__assets .asset-name :first-child{
    color: #000;
}
body.light #user-wallet__assets .asset-name :last-child{
    color: #444;
}

#user-wallet__history{
    max-height: calc(100vh - 27rem);
    max-height: calc(100dvh - 27rem);
    overflow-y: auto;
}

.user-wallet__close-btn{
    position: absolute;
    top: 1rem;
    right: 1rem;
    height: 2rem;
    align-items: center;
    border-radius: 0.5rem;
    background-color: var(--color-green);
    color: #000;
    line-height: 2.2rem;
    font-size: 2rem;
    font-weight: 400;
    cursor: pointer;
    outline: none;
    border: none;
    text-decoration: none;
    padding: 0 .5rem;
    display: none;
    z-index: 1;
}

.desktop .user-wallet__close-btn{
    display: block;
}

.max-sum.text-red,
.min-sum.text-red{
    color: #E44E50;
}

#wallet-content{
    flex-grow: 1;
    display: flex;
    flex-flow: column;
}

.payout-locked{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #E44E50;
    color: #FFF;
    border-radius: 5px;
    padding: .5rem;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
    font-weight: 500;
    line-height: 1rem;
    text-align: left;
}

.payout-locked img{
    width: 30px;
    height: 34px;
    flex-shrink: 0;
    object-fit: contain;
}

#wallet-payout-fields{
    display: none;
}
.additional-requisites #wallet-payout-fields{
    display: initial;
}

.user-wallet__header{
    padding-top: 1rem;
}

.user-wallet__buttons{
    margin-top: 2rem;
    margin-bottom: 1rem;
}

@media screen and (max-width: 600px) {
    .user-wallet__header{
        padding-top: 0;
    }
    .user-wallet__buttons{
        margin-top: 0rem;
        margin-bottom: 0rem;
    }
}

.custom-radio input[type="radio"] {
    /* Add if not using autoprefixer */
    -webkit-appearance: none;
    appearance: none;
    /* For iOS < 15 to remove gradient background */
    background-color: #2B2E61;
    /* Not removed via appearance */
    margin: 0;

    font: inherit;
    color: #3A3E82;
    width: 1.35em;
    height: 1.35em;
    border: 0.15em solid currentColor;
    border-radius: 50%;

    display: grid;
    place-content: center;

}

.custom-radio input[type="radio"]::before {
    content: "";
    width: 0.75em;
    height: 0.75em;
    border-radius: 50%;
    /*transform: scale(1);*/
    /*transition: 120ms transform ease-in-out;*/
    box-shadow: inset 1em 1em #3A3E82;
}

.custom-radio input[type="radio"]:checked::before {
    /*transform: scale(1);*/
    box-shadow: inset 1em 1em #A7DA94;
}

body.light .custom-radio input[type="radio"]{
    background: none;
    color: #777777;
}
body.light .custom-radio input[type="radio"]::before {
    box-shadow: inset 1em 1em #CCCCCC;
}
body.light .custom-radio input[type="radio"]:checked::before {
    /*transform: scale(1);*/
    box-shadow: inset 1em 1em #A7DA94;
}

.popup-dialog{
    display: flex;
    flex-flow: column;
    padding: 0;
    background-color: #181A32;
    border-radius: 1rem;
    overflow: hidden;
    max-width: 23rem;
    align-items: center;
    justify-content: flex-end;
    z-index: 100;
    max-height: 100%;
    margin: 0 auto;
}
.popup-dialog.popup-desktop{
    z-index: 10;
    max-width: 100%;
}

body.light .popup-dialog{
    background-color: #FFFFFF;
}

.popup-dialog .inner-content{
    padding: 1rem;
    width: 100%;
}

.popup-dialog img{
    width: 100%;
    object-fit: contain;
}

.popup-dialog .title{
    font-family: "Gotham Pro", "sans-serif";
    color: #FFFFFF;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.4rem;
    text-align: center;
}
body.light .popup-dialog .title{
    color: #444444;
}
.popup-dialog .message{
    font-family: "Gotham Pro", "sans-serif";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.4rem;
    text-align: center;
    color: #8186BD;
}

.popup-dialog .btn-primary{
    width: 100%;
    text-decoration: none;
    text-align: center;
    background-color: #7582F2;
    height: 3.5rem;
    color: #FFFFFF;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4rem;
    border-radius: .5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.popup-dialog .btn-green{
    width: 100%;
    text-decoration: none;
    text-align: center;
    background-color: #A7DA94;
    height: 3.5rem;
    color: #000000;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4rem;
    border-radius: .5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.popup-dialog .btn-gold{
    width: 100%;
    text-decoration: none;
    text-align: center;
    background-color: #FFC660;
    height: 3.5rem;
    color: #000000;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4rem;
    border-radius: .5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.popup-dialog .btn-green{
    width: 100%;
    text-decoration: none;
    text-align: center;
    background-color: var(--color-green);
    height: 3.5rem;
    color: #000000;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4rem;
    border-radius: .5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.popup-dialog .unsub{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.4rem;
    text-align: center;
    color: #8186BD;
    cursor: pointer;
}


.desktop-popup-modal{
    position: fixed;
    right: 2rem;
    bottom: 2rem;
    width: 23rem;
    display: none;
    border-radius: 1.6rem;
    box-shadow: #0a0a17 0 0 4px;
    z-index: 550;
}
.desktop-popup-modal.shown{
    display: flex;
    flex-flow: column;
    justify-content: flex-end;
}
.desktop-popup-modal .popup-close-btn{
    position: absolute;
    top: -3rem;
    right: 0;
    border-radius: 50%;
    background-color: #1B1A47;
    font-size: 1.6rem;
    line-height: 1.6rem;
    font-weight: 600;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.25rem;
    width: 2.25rem;
    box-shadow: #0a0a17 0 0 4px;
    cursor: pointer;
}

.popup-dialog .rank-card{
    height: 270px;
}
.popup-dialog .rank-card .rank-info{
    position: relative;
}

.bonuses__article h1 {
    font-size: 32px;
}

.bonuses__article>h5{
    color: #fff;
    font-size: 32px;
    margin-bottom: 15px;
    line-height: 40px;
}
.bonuses__title-banner .description{
    max-width: 100%;
    width: 50%;
    flex-flow: initial;
}
.bonuses__title-banner {
    height: 18rem;
}
.preloader,
.preloader__overlay {
    background-color: #181A32;
}
body.light .preloader,
body.light .preloader__overlay {
    background-color: #f9f9f9;
}

.preloader,
.preloader__overlay {
    background-color: #181A32;
}
.preloader.remove {
    /*pointer-events: none;*/
    /*opacity: 0;*/
    display: none;
}

.preloader {
    position: fixed;
    bottom: 0;
    left: 0;
    height: 100%;
    display: flex;
    padding: 35px 50px;
    transition: opacity 0.2s ease 0s;
    top: 0;
    width: 100%;
    z-index: 100;
}
.preloader__wrap-logo {
    display: flex;
    align-items: center;
    justify-content: center;

    height: 100px;
    max-height: 100%;
    margin: auto;
    position: relative;
    width: 320px;
    max-width: 100%;
}
.preloader__wrap-logo svg {
    height: auto;
    max-height: 100%;
    width: 100%;
    max-width: 100%;
}
.preloader__wrap-logo .letter {
    fill: #EAEAEA;
}
/*
html.dark .preloader__wrap-logo .element {
    fill: #FF7900;
}
*/
body.light .preloader__wrap-logo .letter {
    fill: #262756;
}
/*
html.light .preloader__wrap-logo .element {
    fill: #FF7900;
}
*/
.preloader__overlay {
    top: 0;
    bottom: 0;
    right: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 120;
}

#slot-machine.slot-machine-popup .page__head-block-wrap-price {
    align-items: center;
    display: flex;
    z-index: 3;
}

#slot-machine.slot-machine-popup .page__head-block-wrap-price p {
    font-size: 1rem;
    line-height: 1.2rem;
    color: #8C90CA;
    margin: 0 9px 0 0;
}

#slot-machine.slot-machine-popup .page__head-wrap-price {
    align-items: inherit;
    border-radius: 8px;
    background-color: rgba(255, 198, 96, 0.15);
    display: inherit;
    padding: 8px;
}

#slot-machine.slot-machine-popup .page__head-wrap-price img,
#slot-machine.slot-machine-popup .page__head-wrap-price svg {
    margin-right: 10px;
}

#slot-machine.slot-machine-popup .page__head-wrap-price p {
    color: #fff;
    margin: 0;
}

#slot-machine.slot-machine-popup .balance-wrap {
    display: flex;
    width: clamp(18rem, 100%, 35rem);
    justify-content: space-between;
    margin: 0 auto;
}

#slot-machine.slot-machine-popup .page__head-block-wrap-price.win.shown {
    transition: all 1s linear;
    visibility: visible;
    top: 0;
}

#slot-machine.slot-machine-popup .page__head-block-wrap-price.win {
    position: absolute;
    z-index: 5;
    top: 3rem;
    width: 100%;
    padding-right: 2rem;
    display: flex;
    justify-content: center;
    visibility: hidden;
}

#slot-machine.slot-machine-popup .page__head-block-wrap-price.win p {
    font-size: 3rem;
    line-height: 3.2rem;
    color: #ffffff;
    text-shadow: #d8b818 0 0 6px;
}

#slot-machine.slot-machine-popup .page__head-block-wrap-price.win .page__head-wrap-price {
    background-color: rgba(255, 198, 96, 0.5);
    box-shadow: #d8b818 0 0 4px;
}


#slot-machine .combinations-wrapper.shown #slot-machine-combinations {
    visibility: visible;
    opacity: 1;
}

#slot-machine-combinations .combinations-grid {
    display: grid;
    grid-template-columns: repeat(5, 6rem);
    grid-template-rows: 70px;
    grid-auto-rows: 70px;
}

#slot-machine .jackpot {
    width: 90%;
    height: 100%;
    position: absolute;
    z-index: 20;
    transform: scale(0.6);
}

#slot-machine .jackpot.shown {
    transition: transform 1s;
    transform: scale(1);
}

#slot-machine .jackpot img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

#slot-machine .jackpot .amount {
    position: absolute;
    bottom: 24%;
    width: 100%;
    text-align: center;
    font-size: 1.6rem;
    line-height: 1.8rem;
    color: #ffffff;
    text-shadow: #d8b818 0 0 6px;
    z-index: 21;
}

#slot-machine .error {
    width: 90%;
    height: 100%;
    position: absolute;
    z-index: 30;
    transform: scale(0.7);
    color: #e71d0c;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "Gotham Pro", "sans-serif";
    font-size: 1.4rem;
    font-weight: 700;
    text-shadow: #000000 0 0 1px;
    text-align: center;
}

#slot-machine .error.shown {
    transition: transform 1s;
    transform: scale(1);
}

@media (max-width: 800px) {
    #slot-machine.slot-machine-popup .slot-machine-popup__columns {
        /*transform: translateY(320px);*/
    }

    #slot-machine.slot-machine-popup .balance-wrap{
        margin-top: 1rem;
    }
    #slot-machine.slot-machine-popup .balance-wrap p {
        font-size: 0.8rem;
    }

    #slot-machine.slot-machine-popup .slot-machine-popup__column {
        margin: 10px 0;
    }

    #slot-machine.slot-machine-popup .page__head-block-wrap-price.win {
        padding-right: 0;
    }

    #slot-machine.slot-machine-popup #slot-machine-combinations .combinations-grid {
        grid-template-columns: repeat(4, 1fr) 1.8fr;
    }

    #slot-machine.slot-machine-popup #slot-machine-combinations .combinations-grid h2 {
        font-size: 2rem;
        position: relative;
        padding-right: 0;
        text-align: center !important;
    }

    #slot-machine.slot-machine-popup .popup__close .close-popup {
        display: flex;
        position: fixed;
        bottom: 16px;
    }

}

@media screen and (max-width: 575px) {

    #slot-machine .jackpot {
        width: 100%;
    }

    #slot-machine .jackpot .amount {
        font-size: 1.4rem;
        line-height: 1.5rem;
    }
}

@media screen and (max-width: 400px) {

    #slot-machine.slot-machine-popup .slot-machine-popup__columns {
        transform: translateY(-15px);
    }

    #slot-machine .slot-machine-popup__element.drum-0,
    #slot-machine .slot-machine-popup__element.drum-1,
    #slot-machine .slot-machine-popup__element.drum-2 {
        height: 140px;
        overflow: hidden;
    }

    #slot-machine .jackpot .amount {
        font-size: .875rem;
        line-height: 1rem;
    }
    #slot-machine .slot-machine-popup__play.slc-slotmachine-spin{
        height: auto;
        transform: none;
        position: absolute;
        bottom: 170px;
        margin: 0 auto;
        left: 0;
        right: 0;
    }
    #slot-machine .popup.achievements__popup.slot-machine-popup{
        margin: 0;
    }
    #slot-machine .popup__body .popup__content{
        padding: 0 5px;
        margin: 0;
    }
    #slot-machine .popup__body .popup__content h3{
        margin-top: 0;
    }
    #slot-machine .achievements__popup-block-image{
        top: 20px;
    }
    #slot-machine .slot-machine-popup__elements{
        /*top: 154px;*/
    }

    /*@media screen and (max-width: 480px) {*/
    /*    #slot-machine .achievements__popup-block-image .achievements__popup-bg.mobile{*/
    /*        display: block;*/
    /*    }*/
    /*}*/
}

.slc__item-icon{
    /*width: 100%;*/
    /*height: 100%;*/
    position: relative;
    min-height: 5rem;
    min-width: 5rem;
    z-index: 2;
}
.slc__item-icon .icon-background{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.slc__item-icon .info{
    position: absolute;
    z-index: 2;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.slc__item-icon .info h3{
    color: #FFF;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    padding-left: 5px;
    padding-right: 5px;
    text-shadow: -2.182px 2.182px 2.182px rgba(0, 0, 0, 0.08);
}
.slc__item-icon .info p{
    color: #FFF;
    font-size: 10px;
    font-weight: 500;
    line-height: 10px;
    padding-left: 6px;
    padding-right: 6px;
    text-shadow: -2.182px 2.182px 2.182px rgba(0, 0, 0, 0.08);
}


.chest__dialog{
    position: relative;
    width: clamp(20rem, 100vw, 45rem);
    height: clamp(300px, 80dvh, 50rem);
    background-color: var(--color-overlay-background);
    border-radius: 1rem;
    padding: 1rem;
}
.chest__dialog .chest-animation{
    position: absolute;
    width: 100%;
    height: 90%;
    bottom: 0;
}
.chest__dialog .chest__items{
    /*margin-top: 5rem;*/
    position: absolute;
    z-index: 5;
    width: 90%;
    height: 60%;
    transform: scale(1) translateY(0);
    transition: all 1s;
    overflow-y: auto;
}
.chest__dialog .chest__items.invisible{
    transform: scale(.3) translateY(60dvh);
}
.shine-item{
    padding: 1.5rem;
    position: relative;
}
.shine-item .shine-img{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    animation: shine-round;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 1;
}
@keyframes shine-round {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(180deg) scale(.8);
    }
    100% {
        transform: rotate(360deg) scale(1);
    }
}

.scale-wrapper{
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    width: 100%;
    height: 100%;
}
.scale-wrapper.scale-01 > *{
    transform: scale(0.1);
}
.scale-wrapper.scale-02 > *{
    transform: scale(0.2);
}
.scale-wrapper.scale-03 > *{
    transform: scale(0.3);
}
.scale-wrapper.scale-04 > *{
    transform: scale(0.4);
}
.scale-wrapper.scale-05 > *{
    transform: scale(0.5);
}
.scale-wrapper.scale-06 > *{
    transform: scale(0.6);
}
.scale-wrapper.scale-07 > *{
    transform: scale(0.7);
}
.scale-wrapper.scale-08 > *{
    transform: scale(0.8);
}
.scale-wrapper.scale-09 > *{
    transform: scale(0.9);
}


.lost-treasures .chest-card{
    position: relative;
    padding: 2rem 1rem;
    height: 404px;
    width: clamp(20rem, 100dvw, 394px);
    margin: 1rem;
    display: flex;
    flex-flow: column;
    color: #FFF;
}
.lost-treasures .chest-card{
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.lost-treasures .chest-card.key_little{
    background-image: url("/img/chests/little_bg.png");
}
.lost-treasures .chest-card.key_middle{
    background-image: url("/img/chests/middle_bg.png");
}
.lost-treasures .chest-card.key_big{
    background-image: url("/img/chests/big_bg.png");
}
.lost-treasures .chest-card.key_black{
    background-image: url("/img/chests/black_bg.png");
}
.lost-treasures .chest-card.key_bermuda{
    background-image: url("/img/chests/bermuda_bg.png");
}
.lost-treasures .chest-card.key_lost{
    background-image: url("/img/chests/lost_bg.png");
}

.lost-treasures .key-price div:first-child{
    font-family: "Gotham Pro", "sans-serif";
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 0.875rem;
    letter-spacing: 0;
    text-align: left;
    color: #8C90CA;
}
.lost-treasures .key-price div:last-child{
    font-family: "Gotham Pro", "sans-serif";
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.25rem;
    letter-spacing: 0;
    text-align: left;
    color: #FFFFFF;
}
.lost-treasures .short-info{
    font-family: "Gotham Pro", "sans-serif";
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    letter-spacing: 0;
    text-align: left;
    color: #8C90CA;
}
.lost-treasures .chest-img{
    flex-shrink: 0;
}
.lost-treasures .chest-card .items{
    width: calc(100% - 120px);
    height: 80px;
    display: grid;
    grid-template-columns: repeat(auto-fit, 40px);
    direction: rtl;
}
.lost-treasures .chest-card .items .slc__item-icon{
    transform: scale(.6);
    margin-left: -40px;
}
.lost-treasures .bottom-info{
    margin-top: auto;
    margin-bottom: 1rem;
}
.lost-treasures .bottom-info p{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .75rem;
    font-weight: 400;
    line-height: .875rem;
    letter-spacing: 0;
    text-align: left;
    color: #8C90CA;
}
.lost-treasures .bottom-info .timer{
    margin-top: 1rem;
}
.lost-treasures .timer span{
    margin: 0 2px;
    background: #2B2F5B;
    border-radius: 5px;
    font-family: "Gotham Pro", "sans-serif";
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0;
    text-align: center;
    padding: 3px;
    width: 2.5rem;
}
.lost-treasures .button{
    font-family: "Gotham Pro", "sans-serif";
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.5rem;
    letter-spacing: 0;
    text-align: left;
    color: #FFFFFF;
}
.lost-treasures .keys-amount{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .675rem;
    font-weight: 500;
    line-height: 0.75rem;
    letter-spacing: 0;
    text-align: left;
    color: #8C90CA;
}
.lost-treasures .keys-amount img{
    width: .75rem;
    height: .75rem;
}
.lost-treasures .keys-amount span{
    padding: 0 5px;
}
.lost-treasures .key-price img{
    width: 20px;
    height: 20px;
}
.lost-treasures .tabs{
    width: clamp(20rem, 100%, 25rem);
}
.lost-treasures .tabContent > div{
    justify-content: space-around;
}

.chest__dialog .open-next{
    position: absolute;
    bottom: 10%;
    left: 0;
    right: 0;
    color: #FFFFFF;
}

.lost-treasures .chest-card .chest-info{
    display: none;
    background: #181a30f0;
    border-radius: 1rem;
    position: absolute;
}
.lost-treasures .chest-card.info-shown .chest-info{
    height: 80%;
    overflow-y: auto;
    top: 3rem;
    left: 0;
    right: 0;
    display: flex;
    flex-flow: column;
    z-index: 20;
    padding-right: 2rem;
}
.lost-treasures .chest-info .chance-items{
    width: 100%;
    justify-items: left;
    align-items: center;
    display: grid;
    grid-template-columns: 3.5rem 3fr 1fr 2rem;
    grid-auto-rows: 3rem;
    font-weight: 500;
    font-size: .75rem;
    grid-gap: 0 .3rem;
}

.lost-treasures .chest-card .chest-info .slc__item-icon{
    transform: scale(.6);
}

.lost-treasures .chest-card .chest-info-btn{
    position: absolute;
    right: .5rem;
    z-index: 30;
    transition: transform .5s;
}

.lost-treasures .chest-card.info-shown .chest-info-btn{
    transform: rotate(180deg);
}
.lost-treasures .key-img img{
    max-width: 20px;
    max-height: 20px;
}

@media (max-width: 800px) {
    .lost-treasures{
        background-image: url("/img/chests/treasures-bg.png");
        background-repeat: repeat;
    }
}

@media (max-width: 1060px) {
    .lost-treasures .tabContent > div{
        flex-wrap: wrap;
    }
}

.shop__item .estimated div{
    font-size: .75rem;
    font-weight: 400;
    line-height: 1rem;
    text-align: left;
}
.shop__item .estimated div:first-child{
    color: #7A82B4;
}
.shop__item .estimated div:last-child{
    font-weight: 600;
}
.shards-count{
    position: absolute;
    color: #7A82B4;
    right: .5rem;
    bottom: .5rem;
    font-weight: 500;
    font-size: .75rem;
    padding: 2px 5px;
    border-radius: 3px;
    background-color: #7A82B430;
}

p.next-task-in{
    color: #7A82B4;
    font-weight: 500;
    font-size: .75rem;
}
.page-info-icon::after {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "serif";
    content: "i";
    font-size: 1rem;
    line-height: 1rem;
    height: 1.5rem;
    width: 1.5rem;
    border-radius: 50%;
    border: #7A82B4 1px solid;
    color: #7A82B4;
}
.popup__body .popup__content{
    border-radius: 1rem;
}

.popup .achievements__popup .popup__content{
    min-height: 500px;
}

.page-info{
    max-width: 30rem;
    /*margin-top: 4rem;*/
    color: var(--primaryText);
}
.page-info.no-padding{
    padding: 0;
}
.page-info p{
    margin: 1rem 0;
    color: var(--secondaryText);
}
.my-tasks__block-task .button-shade{
    background: linear-gradient(90deg, rgba(0,0,0, 0) 0%, #1C1F3EE0 5%, #1C1F3EE0 100%);
}
.achievements__popup-block-image{
    overflow: visible;
}

.task-gradient-wrapper-0{
    margin: 8px 0;
    padding: 1px;
    border-bottom: 2px solid;
    border-image: linear-gradient(to right, rgba(0, 0, 0, 0) 30%, #fff, rgba(0, 0, 0, 0) 70%) 1;
}

.task-gradient-wrapper-2{
    margin: 8px 0;
    padding: 1px;
    border-top: 2px solid;
    border-image: linear-gradient(to right, rgba(0, 0, 0, 0) 30%, #fff, rgba(0, 0, 0, 0) 70%) 1;
}

.task-gradient-wrapper-1{
    margin: 8px 0;
    padding: 2px;
    border-radius: 8px;
    background:
        linear-gradient(
            to right,
            #FFFFFF,
            rgba(0, 0, 0, 0) 40%
        ) border-box;
}

.task-gradient-wrapper-3{
    margin: 8px 0;
    padding: 2px;
    border-radius: 8px;
    background:
        linear-gradient(
            to left,
            #FFFFFF,
            rgba(0, 0, 0, 0) 40%
        ) border-box;
}

.modal-block{
    background: #181A32;
    padding: 1rem;
    border-radius: 1rem;
}

.content .pad{
    background-color: var(--bgMainColor);
    border-radius: 1rem;
    padding: 1rem;
}
.content .pad .text-white{
    color: var(--primaryText);
}

.popup__content.achievement-popup{
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
}

.slc__achievement-items{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
    grid-gap: 2rem;
}

.slc__achievement-item{
    width: 100%;
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

.slc__achievement-item .achievement-name{
    font-weight: 500;
    color: #FFF;
    font-size: .75rem;
    text-align: center;
}
body.light .slc__achievement-item .achievement-name{
    color: #0B0D31;
}

.slc__achievement-item.not-completed .achievement-name{
    color: #FFFFFF90;
}
.slc__achievement-item img{
    width: 80px;
    height: 80px;
    margin: 0 auto;
}

.slc__popup-icon{
    max-width: 150px;
    max-height: 150px;
    margin: 0 auto;
}
.slc__achievement-name{
    font-size: 2rem;
    color: #FFF;
    text-align: center;
    font-weight: 600;
    width: 100%;
}

.slc__achievement-item .label {
    border-radius: 99px;
    background: linear-gradient(180deg, #E350F0 2.03%, #787BF7 100%);
    font-size: 8px;
    line-height: 8px;
    padding: 2.5px 4px 1.5px;
    position: absolute;
    pointer-events: none;
    right: 0.5px;
    transform: translateY(-50%);
    text-transform: uppercase;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    z-index: 1;
    color: #FFF;
}

.achievement-popup .shine-item{
    height: 160px;
    width: 100%;
}
.achievement-popup .shine-item .slc__popup-icon{
    position: absolute;
    top: 0;
    z-index: 2;
    left: 0;
    right: 0;
    width: 100%;
}

.achievement-popup .shine-img{
    top: -50px;
    left: calc(50% - 120px);
    width: 240px;
}

.achievement-popup .achievements__popup-above-progress-bar{
    width: 100%;
    padding-right: 0;
}

.achievement-popup .achievement_rewards{
    width: 100%;
    font-size: .75rem;
}

.slc-shop .tabs{
    margin-bottom: 0;
    min-width: 280px;
}

.slc__exchange-items{
    --textColor: #FFFFFF;
    --bgMainColor: #1C1F3E;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    align-content: space-between;
    grid-gap: 1rem;
    padding: 0 1rem;
}

body.light .slc__exchange-items{
    --textColor: #000000;
    --bgMainColor: #F3F3FB;
}

.page-ad-text{
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 2rem;
}
@media screen and (max-width: 1000px) {
    .page-ad-text{
        font-size: .8rem;
        font-weight: 500;
        line-height: 1.5rem;
    }
}

.exchange-ad-text{
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 2rem;
    margin-top: -1rem;
    margin-left: 30px;
    margin-bottom: .5rem;
}

.exchange-ad-banner{
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    padding: 1rem 4rem 1rem 1rem;
    background-position: center;
    background-image: var(--img);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    max-width: 320px;
    color: #FFFFFF;
}
.exchange-ad-banner p:first-child{
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
}
.exchange-ad-banner p:nth-child(2){
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}
.exchange-ad-banner p:last-child{
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    white-space: break-spaces;
}

.exchange-item{
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    padding: 1rem;
    max-width: 320px;
    background-color: var(--bgMainColor);
    border-radius: 1rem;
    box-shadow: 0 0 3px #000000;
}
.exchange-item .icon-wrapper{
    width: 72px;
    height: 72px;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-content: center;
    background-color: #2B2F5B;
    border: 2px solid rgba(255, 255, 255, 0.20);
    border-radius: 1rem;
}

.exchange-item .icon-wrapper img{
    object-fit: contain;
}

.exchange-item .title{
    font-size: .75rem;
    font-weight: 400;
    line-height: 1.1rem;
    color: var(--textColor);
}

.exchange-item .amount{
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.8rem;
}
.exchange-item .page__head-wrap-price{
    display: flex;
    align-items: center;
}
.exchange-item .page__head-wrap-price p{
    color: var(--textColor);
}

.exchange-item .amount span{
    font-size: .75rem;
    font-weight: 700;
    line-height: .875rem;
    padding: 4px;
    color: #A7DA94;
    background: #A7DA9426;
    border-radius: 10px;
}
.exchange-item .amount span.prc-2{
    color: #309BE0;
    background: #309BE026;
}
.exchange-item .amount span.prc-3{
    color: #BE4CEE;
    background: #BE4CEE26;
}
.exchange-item .amount span.prc-4{
    color: #F1C40F;
    background: #F1C40F26;
}
.exchange-item .amount span.prc-5{
    color: #D35400;
    background: #D3540026;
}
.exchange-item .amount span.prc-6{
    color: #F11400;
    background: #F1140026;
}

@media screen and (max-width: 600px) {
    .slc__exchange-items{
        grid-gap: .5rem 0;
        padding: 0;
    }
    .exchange-ad-banner{
        width: 100%;
        aspect-ratio: 2.3;
        max-width: 100%;
        padding: 1rem 7rem 1rem 1rem;
    }
    .exchange-item{
        width: 100%;
        max-width: 100%;
    }
    .exchange-item .icon-wrapper {
        width: 44px;
        height: 44px;
        padding: 4px;
        border-radius: 10px;
    }
    .exchange-item .title{
        font-size: .65rem;
        font-weight: 400;
        line-height: 1.1rem;
        color: var(--textColor);
    }
    .exchange-item .amount{
        font-size: .875rem;
        font-weight: 700;
        line-height: 1.2rem;
    }
    .exchange-ad-text{
        font-size: 1rem;
        font-weight: 500;
        line-height: 1.2rem;
        margin: .5rem 0;
    }
}
@media screen and (max-width: 335px) {
    .page__title{
        font-size: 1rem;
    }
    .exchange-ad-banner p:first-child{
        font-size: 10px;
        font-weight: 400;
        line-height: 18px;
    }
    .exchange-ad-banner p:nth-child(2){
        font-size: 14px;
        font-weight: 700;
        line-height: 24px;
    }
    .exchange-ad-banner p:last-child{
        font-size: 10px;
        font-weight: 400;
        line-height: 18px;
        white-space: break-spaces;
    }
    .exchange-ad-text{
        font-size: .875rem;
        line-height: 1rem;
    }
}

.short-message_wrapper{
    position: fixed;
    top: 6rem;
    right: 3rem;
    display: flex;
    flex-flow: column;
    overflow: hidden;
    pointer-events: none;
    height: 6rem;
    width: 10rem;
    z-index: 1100;
}
.short-message_wrapper .message{
    width: 100%;
    background-color: #00FF00a0;
    border-radius: 1rem;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .75rem;
    line-height: 1rem;
    font-weight: 500;
    color: #FFFFFF;
    padding: 1rem;
    animation: show-up;
    animation-duration: .5s;
}
.short-message_wrapper .message.error{
    background-color: #e3342fa0;
}

@keyframes show-up {
    0% {
        margin-top: 6rem;
        opacity: 0;
    }
    100% {
        margin-top: 0;
        opacity: 1;
    }
}

@media (max-width: 800px) {
    .short-message_wrapper{
        right: 1rem;
    }
}

.custom-range{
    position: relative;
    --rangeBackgroud: #1C1F3E;
    --rangeAccent: #A3DC8F;
}

body.light .custom-range {
    --rangeBackgroud: #E3E5F3;
    --rangeAccent: #A3DC8F;
}


.custom-range input[type="range"] {
    -webkit-appearance: none;
    width: 100%;
    height: 20px;
    background: linear-gradient(90deg, var(--rangeAccent) var(--value), var(--rangeBackgroud) var(--value));
    outline: none;
    -webkit-transition: .2s;
    transition: opacity .2s;
    border-radius: 1rem;
    accent-color: var(--rangeAccent);
}

@media (hover: hover) {
    .custom-range input[type="range"] {
        opacity: 0.7;
    }
    .custom-range input[type="range"]:hover {
        opacity: 1;
    }
}

.custom-range input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background: var(--rangeAccent);
    border: 2px solid var(--rangeBackgroud);
    cursor: pointer;
    border-radius: 50%;
}

.custom-range input[type="range"]::-moz-range-thumb {
    width: 25px;
    height: 25px;
    background: var(--rangeAccent);
    border: 2px solid var(--rangeBackgroud);
    cursor: pointer;
    border-radius: 50%;
}
.custom-range .range-sums{
    margin-top: 5px;
    display: flex;
    justify-content: space-between;
    font-size: 0.65rem;
    font-weight: 400;
    line-height: 0.85rem;
    text-align: center;
    color: #8186BD;
}
.custom-range .range-threshold:before{
    content: "";
    margin-top: -15px;
    width: 0;
    height: 0;
    position: absolute;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #8186BD;
    left: var(--left, 0);
}
.custom-range .range-threshold{
    display: flex;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 400;
    line-height: 0.85rem;
    text-align: center;
    color: #8186BD;
}
.custom-range .range-threshold .threshold-img{
    margin-top: -42px;
    position: absolute;
    left: var(--left, 0);
    pointer-events: none;
    height: 25px;
    width: 25px;
}

.user-call-request-block{
    display: flex;
    flex-flow: column;
    background-color: #2B2F5B;
    border-radius: 1rem;
    padding: 1rem;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.user-call-request-block .title{
    font-family: Gotham Pro;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.2rem;
    text-align: center;
    color: #FFFFFF;
    margin-top: 1.5rem;
}

.user-call-request-block .subtitle{
    font-family: Gotham Pro;
    font-weight: 400;
    font-size: .875rem;
    line-height: 1rem;
    text-align: center;
    color: #8C90CA;
    margin-top: .75rem;
}

.user-call-request-block .button{
    margin-top: 1rem;
    font-size: 1rem;
}

.user-call-request-block.disabled{
    background-color: transparent;
}
.user-call-request-block.disabled .title{
    color: #4A4E7F;
}
.user-call-request-block.disabled .subtitle{
    color: #4A4E7F;
}
.user-call-request-block.disabled .button_green{
    background-color: #2B2F5B;
    color: #4A4E7F;
    cursor: default;
}
.user-call-request-block.disabled img{
    filter: grayscale(1);
}

.user-call-request-block .confirm-info{
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    border-radius: 1rem;
    background-color: #2B2F5B;
    color: #FFFFFF;
    font-size: .875rem;
    line-height: 1rem;
    margin-top: 1rem;
    font-weight: 600;
}
.user-call-request-block .confirm-info img{
    width: 1.5rem;
    height: 1.5rem;
    margin-right: 1rem;
}
.user-call-request-block .button.button_red{
    color: #FFFFFF;
    width: 100%;
    background-color: #E44E50;
}


.user-call-request-block.had-call-request{
    flex-flow: row;
}
.user-call-request-block.had-call-request .subtitle{
    display: none;
}
.user-call-request-block.had-call-request .title{
    margin-top: 0;
    font-size: 1rem;
    text-wrap: balance;
}
.user-call-request-block.had-call-request .button_green{
    margin-top: 0;
}
.user-call-request-block.had-call-request img{
    width: 2.5rem;
    height: 2.5rem;
    margin-right: .5rem;
}

.user-call-request-block.pending{
    flex-flow: row;
}
.user-call-request-block .check-icon{
    width: 64px;
    height: 64px;
    background-color: #A3DC8E30;
    border-radius: 1.1rem;
    margin-right: 1rem;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.user-call-request-block .check-icon img{
    width: 36px;
    height: 36px;
}
.user-call-request-block .pending-text{
    font-family: Gotham Pro;
    font-weight: 400;
    font-size: .875rem;
    line-height: 1rem;
}

@media screen and (max-width: 400px){
    .user-call-request-block.had-call-request .title{
        margin-top: 0;
        text-wrap: balance;
        font-size: .875rem;
    }
    .user-call-request-block.had-call-request .button_green{
        margin-top: 0;
        font-size: .875rem;
    }
}

html, body {
    height: 100%;
}

#layout-wrap {
    display: flex;
    background-color: #eee;
    min-height: 100%;
    background-image: url(/img/ui/wave-bg.svg), linear-gradient(to bottom, #14142FFA, #14142FFA);
    background-position: 0 0, 0 0;
    background-size: 100%, 100%;
    background-repeat: no-repeat;
    position: relative;
}

#layout-sidebar {
    display: flex;
    flex-direction: column;
    width: 210px;
    height: 100%;
    background-color: #14142F;
    flex-shrink: 0;
    z-index: 501;
    position: fixed;
    left: 0;
    top: 0;
    /*border-right: 1px solid #ffffff1a;*/
    /*transition: 250ms;*/
}
body.light #layout-wrap {
    /*background-color: #f3f3fc;*/
    background-color: #ffffff;
    background-image: none;
}
#layout-sidebar-button {
    display: flex;
    width: 2rem;
    height: 2rem;
    border-radius: 1rem;
    background-color: #2C2B63;
    position: absolute;
    top: 4rem;
    right: -1rem;
    box-shadow: 0 0 0.5rem #0000001a;
    cursor: pointer;
    transition: 150ms;
}
body.light #layout-sidebar-button {
    background-color: #f3f3fc;
    box-shadow: 0 0 0.5rem #00000009;
}
#layout-sidebar-button:hover {
    background-color: #31306f;
}
#layout-sidebar-button::before {
    content: '';
    display: block;
    width: 0.5rem;
    height: 0.5rem;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(-135deg);
    position: absolute;
    left: 0.8rem;
    top: 0.7rem;
}

body.light #layout-sidebar-button::before {
    border-top: 1px solid #8d8dcd;
    border-right: 1px solid #8d8dcd;
}

#layout-wrap.collapsed #layout-sidebar-button::before {
    transform: rotate(45deg);
    left: 0.55rem;
    top: 0.7rem;
}

#layout-wrap.collapsed #layout-sidebar {
    width: 80px;
}

#layout-content-wrap {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: clamp(600px, 100vw, 1230px);
    height: auto;
    padding-top: 80px;
    margin-left: auto;
    margin-right: auto;
    /*overflow-x: hidden;*/
}
body.light #layout-content-wrap {
    background-image: none;
    /*background-color: #f3f3fc;*/
    background-color: #ffffff;
}
#layout-content-wrap .spinner .roller {
    top: 25rem !important;
}

#layout-content {
    position: relative;
}
body.light #layout-content {
    padding-top: 1rem;
}
#layout-wrap.collapsed #layout-content-wrap {
    max-width: calc(100% - 80px);
    margin-left: 80px;
}


.width-limiter {
    width: 1230px;
    max-width: calc(100% - 2rem);
    margin: 0 auto;
}

@media screen and (max-width: 1230px) {
    .width-limiter {
        width: 100vw;
        max-width: calc(100% - 2rem - 55px);
        margin: 0 auto;
    }
}

.flex {
    display: flex;
}
.games-content {
    background-size: 100% 27rem;
    background-repeat: no-repeat;
    min-height: 27rem;
    margin-top: 1rem;
    padding-top: 0rem;
}

.recent-wins-content {
    /*background: linear-gradient(180deg, #1E1D4E 0%, rgba(30, 29, 78, 0) 100%);*/
    background-size: 100% 27rem;
    background-repeat: no-repeat;
    min-height: 20rem;
    margin-top: 2rem;
    padding-top: 3rem;
}
body.light .recent-wins-content {
    background: none;
    padding-top: 0;
}

body.light .recent-wins-content .width-limiter {
    padding: 2rem;
    /*background-color: #fff;*/
    border-radius: 1rem;
    /*box-shadow: 0 0 1rem #0000000d;*/
}


#layout-overlay {
    display: none;
    flex-direction: column;
    position: absolute;
    left: 00px;
    top: 0;
    width: 100%;
    max-width: 100%;
    min-height: 100%;
    background-color: var(--color-overlay-background);
    padding-top: 5rem;
    z-index: 400;
    opacity: 0;
    overflow-y: auto;
}

@media screen and (max-width: 1100px) {
    #layout-overlay {
        max-width: calc(100vw - 55px);
        left: 55px;
        z-index: 551;
    }
}

body.light #layout-overlay {
    background-color: #f3f3fc;
}

#layout-overlay .spinner {
    background-color: #14142FFA;
}
body.light #layout-overlay .spinner {
    background-color: #f3f3fc;
}

#layout-wrap.collapsed #layout-overlay {
    max-width: calc(100% - 80px);
    left: 80px;
}

#layout-overlay-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 2rem;
}
#layout-overlay-content-wrap {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
#layout-overlay-content {
    flex-grow: 1;
    padding-bottom: 2rem;
}
#layout-overlay-title {
    font-family: 'Gotham Pro', sans-serif;
    font-size: 1.5625rem;
    font-weight: 700;
    color: #fff;
}
body.light #layout-overlay-title {
    color: #2c2b63;
}

#layout-overlay-close-button {
    display: flex;
    align-items: center;
}

#layout-overlay-close-button {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    color: #8283C0;
    cursor: pointer;
}

#layout-overlay-close-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.875rem;
    height: 1.875rem;
    border-radius: 2rem;
    border: 1px solid #8283C0;
    margin-left: 0.5rem;
    font-size: 1.4rem;
    font-weight: 300;
    padding-left: 1px;
}

#layout-overlay-close-button:hover {
    color: #abacff;
}
#layout-overlay-close-button:hover #layout-overlay-close-icon {
    border-color: #abacff;
}


* {
    /*scrollbar-width: thin;*/
    scrollbar-color: #2c2b63 var(--color-overlay-background);
}

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

*::-webkit-scrollbar-track {
    background: none;
}

*::-webkit-scrollbar-thumb {
    background-color: #2c2b63;
    border-radius: 20px;
    border: none;
}

*::-webkit-scrollbar-button {
    display: none;
}

.notifications {
    position: relative;
}


.notifications__icon-image {
    width: 1rem;
}
body.light .notifications__icon-image {
    filter: invert(0.6);
}

.notifications__icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 3rem;
    background-color: transparent;
    transition: 250ms;
    cursor: pointer;
}

.notifications__icon:hover {
    background-color: #ffffff06;
}
.notifications__dropdown {
    position: absolute;
    background-color: #272660;
    width: 20rem;
    max-height: 30rem;
    border-radius: 1rem;
    left: calc(50% - 10rem);
    top: 3.5rem;
    display: flex;
    flex-direction: column;
    visibility: hidden;
    opacity: 0;
    transform: scale(0);
    transition: 100ms;
    transform-origin: center top;
}
body.light .notifications__dropdown {
    background-color: #fff;
    box-shadow: 0 0 15px #00000040;
}
body.light .notifications__dropdown svg {
    filter: invert(1);
}
.notifications:hover .notifications__dropdown {
    visibility: visible;
    opacity: 1;
    transform: scale(1);
}
.notifications.click-shown .notifications__dropdown {
    visibility: visible;
    opacity: 1;
    transform: scale(1);
}
.notifications__dropdown::before {
    content: '';
    display: block;
    width: 0.75rem;
    height: 0.75rem;
    transform: rotate(45deg);
    position: absolute;
    background-color: #272660;
    left: calc(50% - 5px);
    top: -6px;
}
body.light .notifications__dropdown::before {
    background-color: #fff;
}
.ntf__list {
    height: 100%;
    overflow-y: auto;
    min-width: 320px;
    min-height: 74px;
}
.ntf__item {
    display: flex;
    align-items: center;
    padding: 0.5rem;
    border-radius: 0.5rem;
    margin: 0.5rem;
    background-color: #18163359;
}
body.light .ntf__item {
    background-color: #e9e9e9;
}
.ntf__item-icon-wrap {
    margin-right: 0.75rem;
    margin-bottom: auto;
}

.ntf__item-content {
    display: flex;
    flex-direction: column;
}

.ntf__item-title {
    display: flex;
    align-items: center;
    font-weight: 700;
}
body.light .ntf__item-title {
    color: #333;
}
.ntf__item-desc {
    color: #fff;
    font-size: 0.675rem;
    margin-top: 0.25rem;
}
.ntf__item-desc .gold-text{
    text-decoration: none;
    color: #bf9e00;
    font-size: 0.675rem;
    margin-top: 0.25rem;
}
body.light .ntf__item-desc {
    color: #555;
}
.ntf__del-button {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 0.75rem;
    background-color: #2c2b5d;
    color: #ffffffd9;
    font-size: 0.9rem;
    flex-shrink: 0;
    margin-bottom: auto;
    cursor: pointer;
}
.ntf__del-button:hover {
    background-color: #373670;
}
body.light .ntf__del-button {
    background-color: #dbd7d7;
    color: #020202d9;
}
body.light .ntf__del-button:hover {
    background-color: #cccccc;
    color: #020202d9;
}
.ntf__del-btn-wrap {
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    margin-top: 1rem;
    cursor: pointer;
}
.ntf__del-btn {
    display: flex;
    align-items: center;
    height: 1.75rem;
    padding: 0 1rem;
    border-radius: 1rem;
    border: 1px solid #FA305C;
    background-color: #fa305c2e;
    color: #fff;
    font-size: 0.75rem;
    flex-shrink: 0;
    cursor: pointer;
}

.ntf__list::-webkit-scrollbar {
    width: 6px;
}

.ntf__list::-webkit-scrollbar-track {
    width: 8px;
    background-color: transparent;
}

.ntf__list::-webkit-scrollbar-thumb {
    background-color: #000;
    outline: none;
    width: 4px;
    border-radius: 2px;
}

.notifications__icon-status {
    display: none;
    width: 10px;
    height: 10px;
    background: #eb2d2d;
    border-radius: 5px;
    position: absolute;
    top: 11px;
    right: 12px;
    box-shadow: 0 0 5px #00000080;
}
.notifications__icon.active .notifications__icon-status {
    display: block;
}
.notifications__no-records {
    display: flex;
    padding: 1rem 8rem 2rem 8rem;
}

.header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 80px;
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 500;
    transition: background-color 150ms, box-shadow 150ms;
}
.header.sport{
    background-color: #1A1944;
    left: 0;
    width: 100vw;
    z-index: 600;
}
.header.tv-bet{
    background-color: black;
    left: 0;
    width: 100vw;
    z-index: 600;
}
.header .sport-header-items{
    display: none;
}
.sport-header-items{
    display: none;
}
.header .tv-bet-items{
    display: none;
}

body.sport .sport-header-items{
    display: flex;
}

body.tv-bet .tv-bet-items{
    display: flex;
}

body.sport .sport-hide{
    display: none;
}

body.tv-bet .tv-bet-hide{
    display: none;
}

.header_scrolled {
    background-color: #14142FFA;
    box-shadow: 0 0 1rem #00000040;
}
body.light .header_scrolled {
    background-color: #ffffff;
}
#layout-wrap.collapsed .header {
    width: calc(100% - 80px);
    left: 80px;
}
.header__all-games-btn {
}

.header__button {
    margin-right: 1rem;
}


.header__wallet-button {
    margin-left: auto;
    flex-shrink: 0;
}

.header .user-menu {
    margin-left: 1rem;
}


.header .notifications {
    margin-left: 1rem;
}

.header .width-limiter {
    display: flex;
    align-items: center;
}

.header__login-button {
    margin-left: auto;
}

.header__reg-button {
    margin-left: 1rem;
}
.headerPaddingDesktop{
    padding: 0 16px 0 8px;
}
.header__button:hover .button__icon {
    filter: hue-rotate(155deg) saturate(1.5) brightness(1.25);
}

@media screen and (max-width: 1100px) {
    #header .header__bonus-button{
        display: none;
    }
}

@media screen and (max-width: 1100px) {
    #header .wallet-selector{
        min-width: initial;
    }
}

.header__quick-menu{
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: var(--baseColor);
    border-radius: 1rem;
    margin: 0 1rem;
    height: 2.4rem;
    width: 12rem;
}
.header__quick-menu-item{
    width: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.4rem;
    transition: 100ms;
    position: relative;
    cursor: pointer;
}
.header__quick-menu-item .bottom-menu__link-icon{
    width: 1rem;
    height: 1rem;
    filter: invert(48%) sepia(100%) hue-rotate(180deg);
}
.header__quick-menu-item:hover .bottom-menu__link-icon{
    filter: none;
}
.header__quick-menu-item.support{
    background-color: var(--secondaryBtn);
    border-radius: 1rem;
    width: 3.5rem;
}
.header__quick-menu-item.support .bottom-menu__link-icon{
    filter: none;
}

.footer {
    padding-top: 1rem;
}

.footer__links-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer__links-column {
    display: flex;
    flex-direction: column;
}

.footer__links-column + .footer__links-column {
    padding: 0 .5rem;
}

.footer__links-items {
    display: flex;
    flex-direction: column;
}

.footer__links-title {
    font-family: 'Gotham Pro', sans-serif;
    color: #fff;
    text-transform: uppercase;
    font-size: 0.85rem;
    font-weight: 700;
}
body.light .footer__links-title {
    color: #2c2b63;
}
.footer__link {
    color: #8283C0;
    font-family: 'Gotham Pro', sans-serif;
    text-decoration: none;
    font-size: 0.85rem;
    margin-top: 1rem;
    font-weight: 500;
}
body.light .footer__link{
    color: #55549b;;
}

.footer__line {
    border-top: 1px solid #8283c033;
    margin: 2rem 0;
}

.footer__partners {
    max-width: 100%;
    margin: 0 auto;
}
body.light .footer__partners {
    filter: brightness(0.25);
}
.footer__bottom {
    display: flex;
    align-items: center;
    padding-bottom: 1rem;
}

.footer__logo {
    display: flex;
    align-items: center;
    margin: 0 auto;
    font-family: 'Gotham Pro', sans-serif;
    color: #fff;
    font-size: 0.75rem;
}
.footer__certificate{
    width: 150px;
    height: 85px;
}
/*body.light .footer__logo {*/
/*    filter: brightness(0.25) hue-rotate(205deg);*/
/*}*/
.footer__logo-image {
    margin: 0 0.5rem;
    height: 50px;
}

.footer__copyright {
    font-family: 'Gotham Pro', sans-serif;
    font-size: 0.85rem;
    color: #8283C0;
    line-height: 1.5;
}
.footer__license-text {
    text-align: center;
    color: #64628d;
    font-size: 0.75rem;
    padding: 2rem 0;
}

.wallet-selector {
    display: flex;
    align-items: center;
    height: 2.5rem;
    width: auto;
    min-width: 12rem;
    padding: 0.3rem 0.3rem 0.3rem 0.5rem;
    border-radius: 1.5rem;
    position: relative;
    transition: 500ms;
    background-color: #272660;
    cursor: pointer;
    user-select: none;
    margin: 1.25rem;
    z-index: 520;
    justify-content: space-between;
}
.wallet-selector.hidden{
    display: none;
}
body.light .wallet-selector {
    background-color: #ffffff;
}
.wallet-selector:hover {
    background-color: #302f70;
}

.wallet-selector__amount {
    display: flex;
    flex-wrap: nowrap;
    font-family: "Gotham Pro", sans-serif;
    font-weight: 800;
    font-size: 1rem;
    line-height: 1.1rem;
    color: #fff;
    margin-right: .4rem;
    margin-left: 0.4rem;
}
.wallet-selector__balance-name{
    color: rgba(255,255,255,0.5);
    font-weight: 500;
    font-size: 0.6rem;
    margin-right: auto;
    margin-left: 0.4rem;
}
body.light .wallet-selector__amount {
    color: #1a1944;
}

.wallet-selector.click-shown .wallet-selector__dropdown{
    visibility: visible;
    opacity: 1;
    transform: scale(1);
    top: 3.5rem;
}


.wallet-selector__amount-rest {
    font-family: "Gotham Pro", sans-serif;
    font-weight: 800;
    font-size: 0.875rem;
    line-height: 1.2rem;
    color: rgba(255,255,255,0.5);
}

body.light .wallet-selector__amount-rest {
    color: #807fa1;
}
.wallet-selector__plus-button {
    width: auto;
    height: 2.5rem;
    padding: 0 1.5rem;
    border-radius: 1.5rem;
    font-weight: 700;
    font-size: 0.75rem;
    margin-left: 0.75rem;
    background-color: #A3DC8E;
    display: flex;
    align-items: center;
    color: #1E1D4E;
}

.wallet-selector__dropdown {
    display: flex;
    flex-direction: column;
    width: 16rem;
    background-color: #1C1F3E;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: 4.5rem;
    left: calc(50% - 8rem);
    border-radius: 0.625rem;
    padding: 1rem 0;
    transition: 150ms;
    box-shadow: 0 0 2rem #0000001a;
    transform: scale(0.9);
    transform-origin: center -1rem;
}
body.light .wallet-selector__dropdown {
    background-color: #ffffff;
}
.wallet-selector:hover .wallet-selector__dropdown {
    visibility: visible;
    opacity: 1;
    transform: scale(1);
    top: 3.5rem;
}
.wallet-selector__plus-button:hover + .wallet-selector__dropdown {
    visibility: hidden;
    opacity: 0;
    transform: scale(0.9);
    top: 4.5rem;
}
.wallet-selector__dropdown::before {
    content: '';
    display: block;
    width: 1rem;
    height: 1rem;
    border-radius: 0.2rem;
    background-color: #1C1F3E;
    transform: rotate(45deg);
    position: absolute;
    top: -0.45rem;
    left: calc(50% - 0.5rem);
}
body.light .wallet-selector__dropdown::before {
    background-color: #ffffff;
}
.wallet-selector__dropdown::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: -1rem;
    width: 100%;
    height: 1rem;
}

.wallet-selector__item {
    display: flex;
    align-items: center;
    height: 2.5rem;
    padding: 0 1rem;
    background-color: transparent;
    transition: 500ms;
    position: relative;
    overflow: hidden;
    margin: 0 .5rem;
}
.wallet-selector__item:hover {
    background-color: rgba(255, 255, 255, 0.025);
}
.wallet-selector__currency {
    color: #8283C0;
    font-weight: 400;
    font-family: 'Gotham Pro', sans-serif;
    font-size: 0.875rem;
    transition: 500ms;
    margin-right: auto;
}

/*.wallet-selector__item_uah.wallet-selector__item_active .wallet-selector__currency {*/
/*    color: #FCC339;*/
/*}*/
/*.wallet-selector__item_rub.wallet-selector__item_active .wallet-selector__currency {*/
/*    color: #e68683;*/
/*}*/
/*.wallet-selector__item_usd.wallet-selector__item_active .wallet-selector__currency {*/
/*    color: #A2DC8D;*/
/*}*/
/*.wallet-selector__item_eur.wallet-selector__item_active .wallet-selector__currency {*/
/*    color: #787BF7;*/
/*}*/
/*.wallet-selector__item_inr.wallet-selector__item_active .wallet-selector__currency {*/
/*    color: #b000db;*/
/*}*/
/*.wallet-selector__item_btc.wallet-selector__item_active .wallet-selector__currency {*/
/*    color: #FD9C0D;*/
/*}*/
/*.wallet-selector__item_mbtc.wallet-selector__item_active .wallet-selector__currency {*/
/*    color: #FD9C0D;*/
/*}*/
/*.wallet-selector__item_usdt.wallet-selector__item_active .wallet-selector__currency {*/
/*    color: #81b070;*/
/*}*/
/*.wallet-selector__item_kzt.wallet-selector__item_active .wallet-selector__currency {*/
/*    color: #00a8c9;*/
/*}*/

.wallet-selector__item.wallet-selector__item_active{
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
}

/*.wallet-selector__item::before {*/
/*    content: '';*/
/*    display: block;*/
/*    position: absolute;*/
/*    left: -0.625rem;*/
/*    top: 0.25rem;*/
/*    width: 0.625rem;*/
/*    height: 2rem;*/
/*    border-radius: 1rem;*/
/*    background-color: #FCC339;*/
/*    opacity: 0;*/
/*    transition: 500ms;*/
/*}*/

/*.wallet-selector__item_active::before {*/
/*    left: -0.3125rem;*/
/*    opacity: 1;*/
/*}*/

/*.wallet-selector__item_uah.wallet-selector__item_active::before {*/
/*    background-color: #FCC339;*/
/*}*/
/*.wallet-selector__item_rub.wallet-selector__item_active::before {*/
/*    background-color: #e68683;*/
/*}*/
/*.wallet-selector__item_usd.wallet-selector__item_active::before {*/
/*    background-color: #A2DC8D;*/
/*}*/
/*.wallet-selector__item_eur.wallet-selector__item_active::before {*/
/*    background-color: #787BF7;*/
/*}*/
/*.wallet-selector__item_inr.wallet-selector__item_active::before {*/
/*    background-color: #b000db;*/
/*}*/
/*.wallet-selector__item_btc.wallet-selector__item_active::before {*/
/*    background-color: #FD9C0D;*/
/*}*/
/*.wallet-selector__item_mbtc.wallet-selector__item_active::before {*/
/*    background-color: #FD9C0D;*/
/*}*/
/*.wallet-selector__item_usdt.wallet-selector__item_active::before {*/
/*    background-color: #81b070;*/
/*}*/
/*.wallet-selector__item_kzt.wallet-selector__item_active::before {*/
/*    background-color: #00a8c9;*/
/*}*/

/*.user-menu__dropdown .header__wallet-selector.wallet-selector{*/
/*    display: none;*/
/*}*/

.checked-icon{
    color: #A7DA94;
    font-size: 1.5rem;
    display: none;
}
.wallet-selector__item.wallet-selector__item_active .checked-icon{
    display: block;
}
@media screen and (max-width: 1000px) {

    .header .header__wallet-button .wallet-selector__icon{
        display: none;
    }
    .header .header__wallet-button .wallet-selector__amount{
        display: none;
    }
    .header .header__wallet-button .header__wallet-selector.wallet-selector{
        min-width: 0;
        padding: 0;
        background: none;
    }
    .header .header__wallet-button .wallet-selector__arrow.arrow-down{
        display: none;
    }
    .header .header__wallet-button .wallet-selector__plus-button{
        display: none;
    }
    /*.user-menu__dropdown .header__wallet-selector.wallet-selector{*/
    /*    display: flex;*/
    /*}*/
}

.casino-benefits {
    display: flex;
    width: 100%;
    background: linear-gradient(93.23deg, rgba(120, 123, 247, 0.0945) -4.91%, rgba(120, 123, 247, 0.054) 97.3%);
    border-radius: 0.5rem;
    margin: 3rem 0;
}

.casino-benefits__item {
    display: flex;
    align-items: center;
    width: 33.33%;
    padding: 1.5rem;
}

.casino-benefits__text {
    margin-left: 1.5rem;
    color: #fff;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 700;
    font-size: 0.85rem;
}

.casino-benefits__text-yellow {
    color: #FFEB81;
}

.user-menu {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 0 0.75rem 0 0.25rem;
    border-radius: 0.5rem;
    position: relative;
    height: 2.5rem;
}


.user-menu:hover {
    /*background-color: #ffffff06;*/
}

.user-menu__avatar-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 2.5rem;
    background-image: linear-gradient(to bottom, #4E7CFF, #5B4CF1);
    margin: 0.25rem;
}

.user-menu__avatar {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 3rem;
    position: relative;
}

body.light .user-avatar__progress circle:first-child {
    stroke: #babadf;
    stroke-width: 2px !important;
}
.user-menu__avatar .user-avatar {
    transform: scale(0.65);
}
.user-menu__avatar .user-avatar circle:first-child {
    stroke-width: 4px;
}
.user-menu__avatar .user-avatar circle:nth-child(2) {
    stroke-width: 2px;
}
.user-menu__avatar-image {
    min-height: 1.5rem;
}

.user-menu__avatar-rank-icon {
    position: absolute;
    left: 1.85rem;
    top: 1.85rem;
}

.user-menu__texts {
    margin-left: 0.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    line-height: 1;
}

.user-menu__name {
    font-family: 'Gotham Pro', sans-serif;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 600;
    margin-bottom: 0.15rem;
    max-width: 8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
body.light .user-menu__name {
    color: #1a1944;
}
.user-menu__id {
    font-family: 'Gotham Pro', sans-serif;
    color: #fff;
    font-size: 0.75rem;
    margin-bottom: 0.15rem;
    white-space: nowrap;
}
body.light .user-menu__id {
    color: #1a1944;
}
.user-menu__dd-name {
    font-family: 'Gotham Pro', sans-serif;
    color: #fff;
    font-size: 1.15rem;
    font-weight: 600;
    margin-bottom: 0.15rem;
    max-width: 8rem;
    text-overflow: ellipsis;
    overflow: hidden;
}
body.light .user-menu__dd-name {
    color: #555390;
}
.user-menu__rank {
    display: flex;
    align-items: center;
    margin-top: 0.5rem;
}
.user-menu__rank-name {
    color: #9089D1;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
}
.user-menu__rank-dd-name {
    color: #FFC660;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
}

.user-menu__rank-progress {
    font-family: 'Gotham Pro', sans-serif;
    color: #A3DC8E;
    font-weight: 500;
    font-size: 0.75rem;
}


.user-menu__dropdown {
    display: flex;
    flex-direction: column;
    width: 23rem;
    background-color: #14142FFA;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: 4rem;
    /*left: calc(50% - 8rem);*/
    right: -2rem;
    border-radius: 1.25rem;
    transition: 150ms;
    box-shadow: 0 0 2rem #0000001a;
    transform: scale(0.9);
    transform-origin: center -1rem;
    cursor: default;
    overflow: hidden;
}
body.light .user-menu__dropdown {
    background-color: #ffffff;
}
.user-menu:hover .user-menu__dropdown {
    visibility: visible;
    opacity: 1;
    transform: scale(1);
    top: 3rem;
}

.user-menu.click-shown .user-menu__dropdown {
    visibility: visible;
    opacity: 1;
    transform: scale(1);
    top: 3rem;
}

.user-menu__dropdown::before {
    content: '';
    display: block;
    width: 1rem;
    height: 1rem;
    border-radius: 0.2rem;
    background-color: #14142FFA;
    transform: rotate(45deg);
    position: absolute;
    top: -0.45rem;
    left: calc(50% - 0.5rem);
}
body.light .user-menu__dropdown::before {
    background-color: #ffffff;
}
.user-menu__dropdown::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: -1rem;
    width: 100%;
    height: 1rem;
}


.user-menu__info {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
    background-color: #14142FFA;
    border-radius: 1.25rem 1.25rem 0 0;
}
body.light .user-menu__info {
    background-color: #ffffff;
}

.user__menu-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 0.5rem;
    padding: 1rem;
    border-radius: 0 0 1.25rem 1.25rem;
    overflow-y: auto;
}
body.light .user__menu-links {
    background-color: #ffffff;
}
.user__menu-link {
    position: relative;
    display: flex;
    align-items: center;
    height: 2.5rem;
    padding: 0 1rem;
    color: #8D8DCD;
    font-size: 0.875rem;
    font-family: 'Gotham Pro', sans-serif;
    text-decoration: none;
    border-radius: 0.5rem;
    transition: 150ms;
    flex-shrink: 0;
}
.user-menu .use-promocode-btn{
    grid-column-start: 1;
    grid-column-end: 3;
    justify-self: center;
    width: 100%;
    margin-top: 1rem;
    display: flex;
    background-color: #1D1D4E;
    border-radius: 5px;
    border: #282359 2px solid;
    padding: 5px;
    justify-content: center;
    align-items: center;
    color: #FFFFFF;
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
}
.cabinet__logout-button{
    grid-column-start: 1;
    grid-column-end: 3;
    justify-self: center;
    width: 50%;
    margin-top: 2rem;
}
/*.user__menu-link.active:after {*/
/*    position: absolute;*/
/*    content: "";*/
/*    width: 3px;*/
/*    height: 3px;*/
/*    right: 0;*/
/*    border: #A2DC8D 3px solid;*/
/*    background-color: #A2DC8D;*/
/*    border-radius: 50%;*/
/*}*/
.user__menu-link img{
    filter: grayscale(100) contrast(100);
}
.user__menu-link.active {
    background: #211f5e;
}

body.light .user__menu-link img{
    filter: grayscale(100);
}

body.light .user__menu-link{
    filter: grayscale(100);
    color: #000000;
}

body.light .user__menu-link.active {
    background: rgba(22, 21, 58, 0.19);
    color: #000000;
}
body.light .user__menu-link:hover {
    background: rgba(22, 21, 58, 0.19);
    color: #000000;
}
body.light .user__menu-link:hover img{
    filter: grayscale(100);
}
body.light .user__menu-link.active img{
    filter: grayscale(100);
}

body.light .user__menu-link:hover {
    background: rgb(241 241 250);
}
.user__menu-link + .user__menu-link {
    margin-top: 0.25rem;
}
.user__menu-icon-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.25rem;
    margin-right: 0.75rem;
}
.user__menu-icon {
    max-width: 100%;
    max-height: 100%;
}

.user-menu__avatar-and-name {
    display: flex;
    align-items: center;
}

.user-menu__name-texts {
    margin-left: 1rem;
}

.user-menu__rank-progress-track {
    display: flex;
    width: 5rem;
    height: 0.35rem;
    margin-right: 0.5rem;
    background-color: #1E1D4F;
    border-radius: 0.5rem;
    position: relative;
    margin-left: 0.5rem;
    margin-top: 0.1rem;
}
body.light .user-menu__rank-progress-track {
    background-color: #f1f1fa;
}
.user-menu__rank-progress-bar {
    display: block;
    height: 0.35rem;
    border-radius: 0.5rem;
    background-color: var(--color-green);
}
.user-menu__rank-percents {
    font-size: 0.7rem;
    font-family: 'Gotham Pro', sans-serif;
    color: #fff;
    font-weight: 700;
}
.tabs .use-promocode-btn{
    margin: 0 .5rem;
    height: 2rem;
    justify-self: flex-end;
    align-self: center;
    text-align: center;
}

@media screen and (max-width: 1000px){
    .tabs.cabinet--bonuses_tabs{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-auto-flow: row;
    }

    .tabs .use-promocode-btn{
        grid-row: 1/2;
        grid-column: 1/4;
    }
}

.logo {
    display: flex;
    flex-grow: 1;
    justify-content: center;
    align-items: center;
    height: 80px;
    margin: 0 auto;
    overflow: hidden;
    text-decoration: none;
    /*transition: 250ms;*/
}
.logo__image {
    width: 180px;
    background-image: url("/img/kraken-logo-dark.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    height: 100%;
}
body.light .logo__image {
    background-image: url("/img/kraken-logo-light.svg");
    /*filter: grayscale(0) brightness(0.8);*/
}
.logo__text-image {
    height: 26px;
}
body.light .logo__text-image {
    filter: grayscale(1) brightness(0.1);
}
.logo__text_white {
    font-size: 1.3rem;
    line-height: 1.3rem;
    color: #fff;
    font-weight: 700;
    letter-spacing: 1px;
    opacity: 1;
}
body.light .logo__text_white{
    color: #000;
}
.logo__text_white-subtitle{
    font-size: .7rem;
    line-height: .8rem;
    color: #fff;
    font-weight: 400;
    letter-spacing: 6px;
    margin-top: -2px;
    opacity: 1;
    align-self: baseline;
}
body.light .logo__text_white-subtitle{
    color: #000;
}


.logo__text_yellow {
    font-size: 0.85rem;
    color: #FFCB5B;
    font-weight: 600;
    opacity: 1;
}


#layout-wrap.collapsed .logo {
    margin-left: 28px;
}

#layout-wrap.collapsed .logo__text_white,
#layout-wrap.collapsed .logo__text_yellow {
    opacity: 0;
}

.logo-wrapper{
    display: flex;
    align-items: center;
}

.logo__image-wrapper{
    height: 100px;
    /*width: 66px;*/
    overflow: hidden;
    position: relative;
    /*margin-right: -18px;*/
    transform: scale(.8);
}
.logo__image-wrapper img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.logo__image-wrapper img.num-2{
    top: -115px;
}
.logo__image-wrapper img.num-3{
    top: calc(-115px * 2);
}
.logo__image-wrapper img.num-4{
    top: calc(-115px * 3);
}
.logo__image-wrapper img.num-5{
    top: calc(-115px * 4);
}
.logo__image-wrapper img.num-6{
    top: calc(-115px * 5);
}
.logo__image-wrapper img.num-7{
    top: calc(-115px * 6);
}
.logo__image-wrapper img.num-8{
    top: calc(-115px * 7);
}
.logo__image-wrapper img.num-9{
    top: calc(-115px * 8);
}
.logo__image-wrapper img.num-10{
    top: calc(-115px * 9);
}
@media (max-width: 340px) {
    .logo__text_white {
        font-size: 1rem;
        line-height: 1rem;
        letter-spacing: 4px;
    }
    .logo__text_white-subtitle {
        font-size: .7rem;
        line-height: .8rem;
    }
    .logo__image-wrapper{
        height: 90px;
        width: 66px;
        overflow: hidden;
        position: relative;
        margin-right: -24px;
        transform: scale(.4);
    }
}

.button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 2.625rem;
    padding: 0 1.5rem;
    text-decoration: none;
    border-radius: 0.5rem;
    transition: 500ms;
    cursor: pointer;
}

.button__icon {
    margin-right: 0.65rem;
}

.button__text {
    color: #fff;
    font-family: "Gotham Pro", sans-serif;
    font-weight: 500;
    font-size: 0.75rem;
}

body.light .button__text {
    color: #35316C;
}

.button_borderless {
    padding: 0 1rem;
    border: 2px solid transparent;
}

.button_borderless:hover {
    border-color: #35316C;
    background-color: rgba(53, 49, 108, 0.14);
}
body.light .button_borderless:hover {
    border-color: #d9d8e5;
    background-color: rgba(53, 49, 108, 0.05);
}

.button_transparent {
    color: var(--primaryText);
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
    border: 2px solid rgba(130, 131, 192, 0.12);
}

.button_transparent:hover {
    border: 2px solid rgba(130, 131, 192, 0.5);
}


.button_outlined {
    color: #fff;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
    border: 2px solid var(--color-blue);
    background-color: transparent;
    transition: 150ms;
}
body.light .button_outlined {
    color: #2c2b63;
}
.button_outlined:hover {
    background-color: var(--color-blue);
}



.button_green {
    background-color: var(--color-green);
    border: none;
    color: #000;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
}

.button_green:hover {
    background-color: #7DB668;
}

.button_red {
    background-color: var(--color-red);
    border: none;
    color: #000;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
}

.button_red:hover {
    background-color: #EF8E8B;
}

.button_danger {
    background-color: #C40E1B;
    border: none;
    color: #FFF;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
}

.button_red:hover {
    background-color: #C40E1BD0;
}

.button_orange {
    background-color: var(--color-orange);
    border: none;
    color: #000;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
}
.button_orange:hover {
    background-color: #C29200;
}

.button_grey {
    background-color: var(--color-gray-dark);
    border: none;
    color: #FFF;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
}
.button_grey:hover {
    background-color: #2B2F5BD0;
}

.button_blue {
    background-color: var(--color-blue);
    border: none;
    color: #FFF;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
}
.button_blue:hover {
    background-color: #787bf7D0;
}

.button_shop{
    background: linear-gradient(85deg, rgba(209, 209, 255, 0.48) -84.75%, rgba(57, 56, 109, 0.48) 99.7%);
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
    display: flex;
    align-items: center;
    color: #FFFFFF;
    position: relative;
}

.button_left-icon{
    padding-left: 55px;
}
.button_left-icon img{
    position: absolute;
    left: 6px;
    height: 80%;
    max-width: 45px;
}

.button.disabled{
    background-color: var(--color-disabled-background);
}

.button_green .button__text {
    color: #1A1944;
    font-weight: 600;
    font-family: Montserrat, sans-serif;
    text-transform: uppercase;
}

.button_add_currency {
    width: auto;
    height: 2rem;
    padding: 0 0.6rem;
    border-radius: 0.35rem;
    font-weight: 700;
    font-size: 0.75rem;
    background-color: #A3DC8E;
    display: flex;
    align-items: center;
    color: #1E1D4E;
}

.all-button {
    display: flex;
    background-color: #2c2c5d;
    border-radius: 0.5rem;
    margin-right: 0.5rem;
    justify-content: center;
    align-items: center;
    padding: 0 1rem;
    color: #8283C0;
    font-size: 0.75rem;
    font-family: "Gotham Pro", sans-serif;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    transition: 250ms;
    text-decoration: none;
    height: 2.15rem;
    white-space: nowrap;
}
.all-button:hover {
    border-color: #5e60b7;
}
body.light .all-button {
    background-color: #e5e1ef;
    color: #8283c0;
}
body.light .all-button:hover {
    background-color: #e1dcef;
    color: #8283c0;
}

.left-menu-wrapper.shown .menu{
    display: flex;
}
.menu {
    position: absolute;
    display: none;
    flex-direction: column;
    padding: 1rem;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #181A32;
    border-radius: 0.5rem;
    top: 3rem;
    box-shadow: #0a0a17 0 0 2px;
}

.menu .sidebar-user-info{
    background-color: #2C2B64;
    border-radius: 1rem;
    padding: 0 1rem;
}
body.light .menu .sidebar-user-info{
    background-color: #DDDDDD;
}

body.light .menu{
    background-color: #fff;
}

.menu-block{
    display: grid;
    width: 100%;
    grid-template-columns: 12rem 12rem;
    grid-auto-rows: min-content;
    grid-gap: 0 .5rem;
}

.menu-button {
    width: 2.4rem;
    height: 2.4rem;
    background-color: var(--color-green);
    margin: 0 0.5rem;
    border-radius: 100%;
    flex-shrink: 0;
    position: relative;
}
.menu-button__line:nth-child(1) {
    width: 1.2rem;
    height: 3px;
    background-color: #000;
    left: 0.6rem;
    top: 11px;
    position: absolute;
    transition: transform .3s;
}

.menu-button__line:nth-child(2) {
    width: 1.2rem;
    height: 3px;
    background-color: #000;
    left: 0.6rem;
    top: 1.1rem;
    position: absolute;
}

.menu-button__line:nth-child(3) {
    width: 1.2rem;
    height: 3px;
    background-color: #000;
    left: 0.6rem;
    top: 1.45rem;
    position: absolute;
    transition: transform .3s;
}
body.light .menu-button__line:nth-child(1),
body.light .menu-button__line:nth-child(2),
body.light .menu-button__line:nth-child(3) {
    background-color: #000;
}

.left-menu-wrapper{
    position: relative;
}

.left-menu-wrapper.shown .menu-button__line:nth-child(1){
    transform: rotate(45deg) translate(0.3rem, 0.3rem);
}

.left-menu-wrapper.shown .menu-button__line:nth-child(2){
    display: none;
}

.left-menu-wrapper.shown .menu-button__line:nth-child(3){
    transform: rotate(-45deg) translate(0.2rem, -0.2rem);
}

.menu__fav {
    margin-bottom: 1rem;
}

.menu__item {
    display: flex;
    align-items: center;
    text-decoration: none;
    height: 2.5rem;
    flex-shrink: 0;
    padding: 0.75rem 0.9rem;
    background-color: transparent;
    border-radius: 0.5rem;
    margin-bottom: 0.25rem;
    transition: 250ms;
    position: relative;
}
.menu__item.active {
    background-color: #211f5e;
}
.menu__item.disabled {
    opacity: 0.25;
    pointer-events: none;
}
.menu__item.test-mode {
    opacity: 0.5;
    background-color: #b16d09;
}
body.light .menu__item.active {
    background-color: var(--color-green);
}

body.light .menu__item > img{
    filter: hue-rotate(134deg) brightness(0.1);
}
body.light .menu__item > img.no-filter{
    filter: none;
}
.menu__item-image {
    filter: hue-rotate(134deg);
    opacity: 0.6;
    transition: 250ms;
    flex-shrink: 0;
}
.menu__item .menu-img{
    height: 22px;
    width: 22px;
    filter: grayscale(1) brightness(300%);
}
body.light .menu__item-image {
    filter: hue-rotate(134deg) brightness(0.1);
    opacity: .75;
}
.menu__item:hover .menu__item-image {
    filter: hue-rotate(0deg);
    opacity: 1;
}
body.light .menu__item:hover .menu__item-image {
    filter: hue-rotate(134deg) brightness(0.1);
    opacity: 1;
}
.menu__item-text {
    font-family: "Gotham Pro", sans-serif;
    color: #8D8DCD;
    font-size: 0.875rem;
    font-weight: 500;
    flex-shrink: 0;
    opacity: 1;
    visibility: visible;
    margin-left: 0.75rem;
}
.menu__item.active .menu__item-text {
    color: #fff;
}
body.light .menu__item-text.golden,
.menu__item-text.golden {
    color: #F29B49;
}
body.light .menu__item-text.red,
.menu__item-text.red {
    color: #C11D49;
}
body.light .menu__item-text,
body.light .menu__item.active .menu__item-text {
    color: #000000;
}
.menu__item:hover .menu__item-text {
    color: #fff;
}
body.light .menu__item:hover .menu__item-text {
    /*color: #6f6f85;*/
}
body.light .menu__item.active:hover .menu__item-text {
    color: #fff;
}
#layout-wrap.collapsed .menu__item-text {
    opacity: 0;
    visibility: hidden;
}

#layout-wrap.collapsed .menu__item:hover .menu__item-text {
    display: flex;
    align-items: center;
    position: absolute;
    visibility: visible !important;
    opacity: 1 !important;
    left: 2.5rem;
    top: 0.6rem;
    background-color: #2D2C57;
    width: auto;
    height: 1.5rem;
    padding: 0 0.75rem;
    border-radius: 1rem;
    font-size: 0.75rem;
    flex-shrink: 0;
    white-space: pre;
}

.menu__item:hover {
    background-color: #1e1d4b;
}

body.light .menu__item:hover {
    filter: none;
}
.menu__item:active {
    background-color: #161540;
}


.menu__line {
    height: 1px;
    background-color: #2C2B63;
    margin: 0.75rem 0 1rem 0;
    border: none;
}


body.light .menu__line {
    background-color: #c6c6ea;
}

.circle-counter{
    background-color: #f29b49;
    border-radius: 50%;
    color: #FFFFFF;
    width: 1.5rem;
    height: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .875rem;
    line-height: 1rem;
    font-weight: 700;
    font-family: "Gotham Pro", "sans-serif";
    margin-left: auto;
    flex-shrink: 0;
}
.circle-counter.text-black{
    width: 1.2rem;
    height: 1.2rem;
    color: #000000;
    font-size: .75rem;
    font-weight: 500;
    line-height: .875rem;
}
.circle-counter.red{
    background-color: #C11D49;
}
#menu-button .has-new{
    position: absolute;
    right: -4px;
    top: -4px;
    background-color: #f29b49;
    border-radius: 50%;
    color: #FFFFFF;
    width: 1rem;
    height: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .875rem;
    line-height: 1rem;
    font-weight: 700;
    font-family: "Gotham Pro", "sans-serif";
}

.menu__item .has-new{
    position: absolute;
    left: 2px;
    top: 2px;
    background-color: #f29b49;
    border-radius: 50%;
    color: #FFFFFF;
    width: 1rem;
    height: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .875rem;
    line-height: 1rem;
    font-weight: 700;
    font-family: "Gotham Pro", "sans-serif";
}

.header__quick-menu-item .has-new{
    display: none;
    position: absolute;
    right: -2px;
    top: -2px;
    background-color: #f29b49;
    border-radius: 50%;
    color: #FFFFFF;
    width: 1rem;
    height: 1rem;
    justify-content: center;
    align-items: center;
    font-size: .875rem;
    line-height: 1rem;
    font-weight: 700;
    font-family: "Gotham Pro", "sans-serif";
}
.header__quick-menu-item.notify .has-new{
    display: flex;
}
.header__quick-menu:has(.header-modals__games-nav > .menu__item.notify) .quick-games-menu .has-new{
    display: flex;
}

.main-slider {
    position: relative;
    width: 100%;
}

.main-slider__arrow-left {
    width: 4rem;
    height: 4rem;
    border-radius: 3rem;
    background-color: transparent;
    position: absolute;
    left: 0;
    top: calc(50% - 2rem);
    z-index: 15;
    transition: 500ms;
    cursor: pointer;
    user-select: none;
}

.main-slider__arrow-left:hover {
    background-color: #00000020;
}

.main-slider__arrow-left::before {
    content: '';
    display: block;
    width: 1.25rem;
    height: 1.25rem;
    border-left: 2px solid #ffffff80;
    border-bottom: 2px solid #ffffff80;
    transform: rotate(45deg);
    position: absolute;
    left: 1.65rem;
    top: 1.3rem;
    z-index: 15;
}

.main-slider__arrow-right {
    width: 4rem;
    height: 4rem;
    border-radius: 3rem;
    background-color: transparent;
    position: absolute;
    right: 0;
    top: calc(50% - 2rem);
    z-index: 5;
    transition: 500ms;
    cursor: pointer;
    user-select: none;
}

.main-slider__arrow-right:hover {
    background-color: #00000020;
}

.main-slider__arrow-right::before {
    content: '';
    display: block;
    width: 1.25rem;
    height: 1.25rem;
    border-right: 2px solid #ffffff80;
    border-top: 2px solid #ffffff80;
    transform: rotate(45deg);
    position: absolute;
    left: 1rem;
    top: 1.3rem;
    z-index: 5;
}

.main-slider__slides {
    /*height: 22rem;*/
    position: relative;
}


.main-slider__slide {
    /*height: 21rem;*/
    width: 100%;
    height: 100%;
    background-color: #5b4cf0;
    box-shadow: 0 0 1rem #00000009;
    border-radius: 2rem;
    position: absolute;
    left: 0;
    top: 0;
    /*transform: scale(0.5);*/
    opacity: 0;
    z-index: 0;
    transition: 500ms;
}
.main-slider__padding-image{
    width: 100%;
    border-radius: 2rem;
    opacity: 0;
    z-index: 0;
    object-fit: contain;
}

.main-slider__slide-bg {
    width: 100%;
    height: 100%;
    /*height: 21rem;*/
    object-fit: cover;
    border-radius: 1rem;
}

body.light .main-slider__slide-bg {
    box-shadow: 0 0 1.5rem #00000040;
}

.main-slider__slide_active {
    /*left: 10%;*/
    z-index: 5;
    transform: scale(1);
    opacity: 1;
}


.main-slider__slide_prev {
    display: none;
    transform: scale(0.85);
    left: -6%;
    opacity: 0.4;
}


.main-slider__slide_next {
    display: none;
    transform: scale(0.85);
    left: 26%;
    opacity: 0.4;
}

.main-slider__slide-button {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 2rem;
    height: 3rem;
    background-image: linear-gradient(to bottom, #04B58A, #09B680);
    color: #1A1944;
    font-size: 0.875rem;
    font-weight: 700;
    border-radius: 2rem;
    position: absolute;
    top: 15rem;
    left: 50%;
    width: 12rem;
    margin-left: -6rem;
    cursor: pointer;
    transition: 250ms;
    text-decoration: none;
    box-shadow: inset 0 0 15px #82d386, 0 3px 15px #8d55e980;
}

.main-slider__slide-button:hover {
    box-shadow: inset 0 0 15px #7cd780, 0 3px 15px #8d55e980;
}

.main-slider__dots{
    position: absolute;
    display: flex;
    width: 100%;
    justify-content: center;
    bottom: -1rem;
    z-index: 20;
}

.main-slider__dot{
    width: 6px;
    height: 6px;
    border-radius: 50%;
    border: 2px #888888 solid;
    background-color: #888888;
    margin: 0 4px;
    transition: width .5s;
}

.main-slider__dot.active{
    border-radius: 25%;
    border: 2px #D9D9D9 solid;
    background-color: #D9D9D9;
    width: 12px;
}

.game {
    display: block;
    overflow: hidden;
    border-radius: 1rem;
    background-color: #323274;
    position: relative;
}
.game.test-mode{
    border: #bf9e00 3px dashed;
}
.game::before {
    content: '';
    display: block;
    width: 100%;
    /*padding-top: 10rem;*/
    aspect-ratio: 1;
}
.game__veil {
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 1rem;
    background-color: #00000020;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    z-index: 10;
    opacity: 0;
    transition: 150ms;
    aspect-ratio: 1;
}
.game:hover .game__veil {
    opacity: 1;
}
.game__name {
    position: absolute;
    top: .5rem;
    color: #fff;
    font-weight: 600;
    font-size: .875rem;
    margin-bottom: 1rem;
    text-align: center;
}
.game__play-real {
    position: absolute;
    top: calc(50% - 1.2rem);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    font-size: 0.875rem;
    font-weight: 700;
    background-color: #5344E6;
    cursor: pointer;
    transform: rotate(90deg);
}
 .triangle {
     position: relative;
     background-color: #FFF;
     text-align: left;
     margin-bottom: 6px;
 }
.triangle:before,
.triangle:after {
    content: '';
    position: absolute;
    background-color: inherit;
}
.triangle,
.triangle:before,
.triangle:after {
    width:  .75rem;
    height: .75rem;
    border-top-right-radius: 30%;
}

.triangle {
    transform: rotate(-60deg) skewX(-30deg) scale(1,.866);
}
.triangle:before {
    transform: rotate(-135deg) skewX(-45deg) scale(1.414,.707) translate(0,-50%);
}
.triangle:after {
    transform: rotate(135deg) skewY(-45deg) scale(.707,1.414) translate(50%);
}

.game__play-demo {
    position: absolute;
    bottom: .5rem;
    right: .5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background-color: #FFFFFF30;
    height: 1.5rem;
    padding: .5rem;
    border-radius: 1rem;
    font-size: 0.75rem;
    cursor: pointer;
    font-weight: 500;
}
.game__image {
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    scale: 1;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.game__badge {
    position: absolute;
    left: 0.5rem;
    top: 0.5rem;
    background-color: var(--color-green);
    padding: 0.25rem 1rem;
    border-radius: 1rem;
    color: #1a1944;
    font-weight: 700;
    font-size: 0.75rem;
    z-index: 1;
}
.loader-img{
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 40px;
    width: 100%;
    height: 100%;
}

.games-search-form {
    margin-top: 2rem;
    display: flex;
}

.games-search-form__name {
    margin-right: 1.5rem;
    flex-grow: 1;
}

.games-search-form__name .input__field {
    border-color: #2C2B63;
    padding: 0 .5rem 0 2rem;
}

.games-search-form__name .input__field:focus {
    border: 1px solid #3c3b8c;
}

.games-search-form__provider {
    margin-right: 1.5rem;
    border-color: #2C2B63;
    position: static;
}

.games-search-form__provider .custom-select__dropdown_wide{
    left: 0;
    top: 6rem;
    width: 100%;
}

.arrow-position{
    position: relative;
}
.arrow-position .arrow-down{
    top: -.3rem;
}

.games-search-form__category {
    border-color: #2C2B63;
}

.games-search-form__orders {
    display: flex;
    align-items: center;
}

.games-search-form__order {
    display: flex;
    align-items: center;
    font-family: 'Gotham Pro', sans-serif;
    font-size: 0.7rem;
    color: #8283C0;
    font-weight: 600;
    padding: 0 0.25rem;
    margin: 0 0.25rem;
    height: 3rem;
}

.games-search-form__order_active {
    color: #fff;
    border-bottom: 1px solid #5B4CF1;
}
/*@media screen and (max-width: 1000px) {*/
    /*.games-search-form {*/
    /*    display: grid;*/
    /*    grid-template-columns: 1fr 1fr;*/
    /*    grid-gap: 1rem 0;*/
    /*}*/
    /*.games-search-form .games-search-form__name{*/
    /*    grid-column: 1/3;*/
    /*    margin-right: 0;*/
    /*}*/
/*}*/

.game-search-form__games-type-header{
    margin-top: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.games-slider {

}

.games-slider .spinner {
    background-color: #1e1d4e73;
}
.games-slider + .games-slider {
    margin-top: 2rem;
}

.games-slider__header {
    display: flex;
    align-items: center;
}

.games-slider__info {
    display: flex;
    align-items: center;
}

.games-slider__icon {
    margin-right: 1rem;
}

.games-slider__title {
    font-family: Montserrat, sans-serif;
    font-size: 1.3rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 0.4rem;
}
body.light .games-slider__title {
    color: #2c2b63;
}
.games-slider__total-number {
    color: #FFC660;
    font-weight: 600;
    font-family: "Gotham Pro", sans-serif;
    font-size: 0.875rem;
}

.games-slider__total-text {
    color: #8283C0;
    font-weight: 400;
    font-family: "Gotham Pro", sans-serif;
    font-size: 0.875rem;
}

.games-slider__controls {
    display: flex;
    margin-left: auto;
}


.games-slider__left,
.games-slider__right,
.games-slider__arrow-left,
.games-slider__arrow-right {
    width: 2.15rem;
    height: 2.15rem;
    border-radius: 0.5rem;
    /*background-color: #2c2c5d;*/
    background: linear-gradient(135deg, #3A42E1 2.88%, #620C90 98.14%);
    border: 1px solid transparent;
    position: relative;
    cursor: pointer;
    user-select: none;
    transition: 250ms;
}
body.light .games-slider__left,
body.light .games-slider__right,
body.light .games-slider__arrow-left,
body.light .games-slider__arrow-right {
    background: #e5e1ef;
}
.games-slider__left:hover,
.games-slider__right:hover,
.games-slider__arrow-left:hover,
.games-slider__arrow-right:hover {
    border: 1px solid #5e60b7;
}
.games-slider__left,
.games-slider__arrow-left {
    margin-right: 0.5rem;
}

.games-slider__left::before,
.games-slider__arrow-left::before {
    content: '';
    display: block;
    width: 0.5rem;
    height: 0.5rem;
    border-left: 2px solid #8283C0;
    border-bottom: 2px solid #8283C0;
    transform: rotate(45deg);
    position: absolute;
    left: 0.85rem;
    top: 0.75rem;
}

.games-slider__right::before,
.games-slider__arrow-right::before {
    content: '';
    display: block;
    width: 0.5rem;
    height: 0.5rem;
    border-top: 2px solid #8283C0;
    border-right: 2px solid #8283C0;
    transform: rotate(45deg);
    position: absolute;
    left: 0.6rem;
    top: 0.75rem;
}

.games-slider__left.slider__disabled,
.games-slider__right.slider__disabled,
.games-slider__arrow-left.slider__disabled,
.games-slider__arrow-right.slider__disabled {
    background-color: #2C2B63;
    border-color: transparent;
    pointer-events: none;
    opacity: 0.25;
}


.games-slider__all-button {
    display: flex;
    /*background-color: #2c2c5d;*/
    background: linear-gradient(135deg, #3A42E1 2.88%, #620C90 98.14%);
    border-radius: 0.5rem;
    margin-right: 0.5rem;
    justify-content: center;
    align-items: center;
    padding: 0 1rem;
    color: #fff;
    font-size: 0.75rem;
    font-family: "Gotham Pro", sans-serif;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
    transition: 250ms;
    text-decoration: none;
    white-space: nowrap;
}
.games-slider__all-button:hover {
    border-color: #5e60b7;
}
body.light .games-slider__all-button {
    background: #e5e1ef;
    color: #8283c0;
}
body.light .games-slider__all-button:hover {
    background: #e1dcef;
    color: #8283c0;
}

.games-slider__games {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
    grid-gap: 1.5rem;
    margin-top: 2rem;
}

.games-slider__games_scrollable {
    display: grid;
    grid-auto-flow: column dense;
    grid-template-columns: 12rem 12rem;
    grid-template-rows: auto auto auto;
    grid-auto-columns: 12rem;
    margin-top: 2rem;
    width: 100%;
    overflow-x: hidden;
}

.games-slider__games_scrollable.games-slider__bonuses_scrollable {
    display: grid;
    grid-auto-flow: column dense;
    grid-template-columns: auto;
    grid-template-rows: auto;
    grid-auto-columns: initial;
    margin-top: 2rem;
    width: 100%;
    overflow-x: hidden;
}

.games-slider__games_scrollable .game + .game {
    /*margin-left: 1rem;*/
}

.games-slider__games_scrollable .game {
    display: flex;
    overflow: hidden;
    border-radius: 1rem;
    background-color: #323274;
    position: relative;
    /*width: calc(20% - 0.8rem);*/
    /*flex-shrink: 0;*/
    margin: 0.5rem;
}

.slider-all-games{
    min-height: 144px;
    overflow: hidden;
    border-radius: 1rem;
    position: relative;
    background-color: #32327450;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: white;
    font-weight: 700;
    font-size: 1rem;
    width: 11rem;
    margin-left: 0.5rem;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}
.slider-all-games .arrow-right{
    display: block;
    border-bottom: #FFFFFF 4px solid;
    border-right: #FFFFFF 4px solid;
    height: 18px;
    width: 18px;
    margin-left: -9px;
    transform: rotate(-45deg);
}


body.light #landing-games {
    padding: 2rem;
    border-radius: 1rem;
}

.games-slider__triple_games_list{
    display: flex;
    overflow-x: hidden;
    overflow-y: visible;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
}

.triple-games-wrapper{
    display: grid;
    grid-template-columns: repeat(2, 50%);
    grid-template-rows: repeat(3, 32%);
    grid-gap: 1rem;
    margin-right: 8px;
    min-width: 32.5%;
    width: 32.5%;
    aspect-ratio: 2/3;
    padding: 1rem;
    scroll-snap-align: start;
    /*height: 550px;*/
}
.triple-games-wrapper .slider__item{
    width: 100%;
    /*height: 100%;*/
    border-radius: 1rem;
}
.triple-games-wrapper > div {
    width: 100%;
}
.triple-games-wrapper:nth-child(odd) > div:nth-child(1) {
    width: 100%;
    grid-column: span 2;
    grid-row: span 2;
}

.triple-games-wrapper:nth-child(2n) > div:nth-child(3) {
    width: 100%;
    grid-column: span 2;
    grid-row: span 2;
}

.recent-wins__title {
    display: flex;
    align-items: center;
    margin-bottom: 2rem;
}

.recent-wins__title-text {
    color: #fff;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 700;
    margin-left: 1rem;
    font-size: 1.3rem;
}

.providers-list {
    /*margin-top: 1rem;*/
    /*max-height: 12rem;*/
    /*overflow: hidden;*/
}
.providers-list.show-all {
    max-height: initial;
}

.providers-list__providers {
    display: flex;
    margin-top: 2rem;
    overflow-x: hidden;
}

.providers-list__provider {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(33.33% - 0.66rem);
    flex-shrink: 0;
}

.providers-list__provider + .providers-list__provider {
    margin-left: 1rem;
}
.providers-list__logo {
    width: 100%;
    border-radius: 1rem;
}
.providers-list__name {
    display: none;
}

.providers-icons{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.providers-icon{
    display: flex;
    border-radius: 5px;
    justify-content: flex-start;
    align-items: center;
    margin: .4rem;
    width: 100%;
    height: 2.7rem;
    padding: 6px;
}
.providers-icon:hover{
    background-color: #1C1F3D;
}
.providers-icon .name{
    font-size: .875rem;
    font-weight: 500;
    word-break: keep-all;
    color: #FFF;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.light .providers-icon{
    border: #cccccc 1px solid;
}

.providers-icon img{
    width: 36px;
    height: 36px;
    object-fit: contain;
    border-radius: 50%;
}

.custom-select__option_selected .providers-icon{
    background-color: #1C1F3D;
}

body.light .custom-select__option_selected .providers-icon{
    background-color: #cccccc;
    /*border: #000000 1px solid;*/
    box-shadow: #000000 0 0 6px;
}


.landing__providers-list{
    display: flex;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    overflow-x: hidden;
    height: auto;
}

.landing__providers-list .provider-games-wrapper{
    margin-right: 2rem;
    scroll-snap-align: start;
}
.landing__providers-list .provider-games-wrapper .group-games{
    display: grid;
    grid-gap: .8rem;
    grid-template-columns: 9rem 9rem;
    grid-template-rows: 10rem 10rem;
}

.bonuses__banner {
    width: 100%;
    height: auto;
}
body.light .bonuses__banner {
    border-radius: 2rem;
    box-shadow: 0 0 1rem #0000000d;
}
.bonuses__list-title {
    font-size: 1.5rem;
    color: #fff;
    font-weight: 700;
    margin: 3rem 0 2rem 0;
}
body.light .bonuses__list-title {
    color: #2c2b63;
}
.bonuses__items {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
    grid-gap: 2rem;
}

.bonuses__item {
    border-radius: 1rem;
    background-image: linear-gradient(to bottom, #2B2A64, rgba(43, 42, 100, 0.15));
}
body.light .bonuses__item {
    border-radius: 1rem;
    background-image: linear-gradient(to bottom, #ffffff, #ffffff);
    box-shadow: 0 0 1rem #0000000d;
}

.bonuses__item-image {
    width: 100%;
    height: auto;
    border-radius: 1rem 1rem 0 0;
}

.bonuses__item-info {
    display: flex;
    flex-direction: column;
    padding: 1rem;
}

.bonuses__item-title {
    font-size: 1.25rem;
    color: #fff;
    font-weight: 700;
    margin-bottom: 1rem;
}
body.light .bonuses__item-title {
    color: #2c2b63;
}
.bonuses__item-date {
    margin-bottom: 0.5rem;
    color: var(--color-orange);
    font-size: 0.875rem;
}

.bonuses__item-desc {
    color: #8283C0;
    font-size: 0.875rem;
    margin-bottom: 1rem;
}

.bonuses__item-fund {
    font-size: 1.875rem;
    font-weight: 700;
    color: var(--color-orange);
    margin-bottom: 1rem;
    margin-top: -0.5rem;
}

.bonuses__item-button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 3rem;
    border: 1px solid #5B4CF1;
    border-radius: 0.5rem;
    padding: 0 2rem;
    color: #fff;
    font-size: 0.875rem;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}
body.light .bonuses__item-button {
    color: #2c2b63;
}
.bonuses__item-start-label {
    margin-right: auto;
    margin-top: 1rem;
    color: #999AE2;
    font-size: 0.875rem;
}

.bonuses__item-start-value {
    font-weight: 700;
    color: #fff;
}
body.light .bonuses__item-start-value {
    color: #999ae2;
}
.bonuses__item-progress-track {
    margin-top: 1rem;
    height: 0.5rem;
    border-radius: 0.5rem;
    width: 100%;
    background-color: #2C2B63;
}
body.light .bonuses__item-progress-track {
    background-color: #e3e3e3;
}
.bonuses__item-progress-bar {
    height: 0.5rem;
    border-radius: 0.5rem;
    background-color: var(--color-green);
}

#bonus-info-modal{
    background-color: #272660;
    padding: 32px;
    border-radius: 15px;
}
body.light #bonus-info-modal {
    background-color: #fff;
}

.bonus-lane{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 3rem;
    width: auto;
    min-width: 12rem;
    padding: 0.3rem 0.3rem 0.3rem 0.5rem;
    border-radius: 1.5rem;
    position: relative;
    transition: 500ms;
    background-color: #272660;
    user-select: none;
    margin: 1.25rem;
}
.bonus-lane .balance{
    display: flex;
    flex-flow: column;
    margin-left: 0.6rem;
    flex-grow: 2;
}
.bonus-lane .balance .balance-name{
    color: rgba(255,255,255,0.5);
    font-weight: 500;
    font-size: 0.6rem;
    line-height: 1rem;
}
body.light .bonus-lane{
    background: linear-gradient(109.94deg, #80B3EF30 80%, #80B3EF30 100%);
}
body.light .bonus-lane .balance-name{
    color: #272660;
}
.bonus-lane .bonus-btn{
    display: flex;
    justify-content: center;
    height: 2.5rem;
    min-width: 8rem;
    border-radius: 1.5rem;
    border: #A3DC8E 1px solid;
    font-weight: 700;
    font-size: 0.75rem;
    margin-left: 0.75rem;
    background-color: #FFC660;
    outline: none;
    align-items: center;
    color: #1E1D4E;
    box-shadow: none;
    text-decoration: none;
}
.bonus-lane .bonus-progress{
    position: relative;
    overflow: hidden;
    height: 2.5rem;
    min-width: 8rem;
    border-radius: 1.5rem;
    border: #A3DC8E 1px solid;
    background-color: #777777;
    outline: none;
    color: white;
    box-shadow: none;
}
.bonus-lane .bonus-btn{
    cursor: pointer;
}
.bonus-lane .bonus-progress .text{
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.6rem;
    line-height: 0.8rem;
    text-shadow: #0a0a17 0 0 2px;
    z-index: 1;
    text-align: center;
    padding: 0 0.5rem;
    cursor: pointer;
}
.bonus-lane .bonus-progress .progress{
    position: absolute;
    left: 0;
    height: 100%;
    background-color: #FFC660;
}

.bonuses__title-banner{
    display: flex;
    position: relative;
    overflow: hidden;
    height: 15rem;
    border-radius: 1rem;
}
.bonuses__title-banner .back-blur{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    /*filter: blur(50px);*/
}
.right-img {
    position: absolute;
    right: 0;
    width: calc(100% - 24rem);
}
.bonuses__title-banner .description{
    z-index: 10;
    align-self: flex-start;
    padding: 2rem;
    max-width: 18rem;
    display: flex;
    flex-flow: column;
    align-items: flex-start;
}
.bonuses__title-banner .description > *:first-child{
    font-size: 2.2rem;
    font-weight: 700;
}
.bonuses__title-banner .description > *:last-child{
    font-size: .875rem;
    font-weight: 600;
    margin-top: .5rem;
}

.bonuses__article{
    color: #FFF;
    font-family: "Gotham Pro", "sans-serif";
}
.bonuses__article > *{
    margin: 1rem 0;
}
.bonuses__article h1{
    margin-top: 2rem;
}
body.light .bonuses__article h1{
    color: #000;
}
.bonuses__article > h5{
    color: #fff;
    font-size: .875rem;
    line-height: 1.2rem;
    font-weight: 600;
}
body.light .bonuses__article > h5{
    color: #000;
}
.bonuses__article > p{
    color: #7A82B4dd;
    font-size: .875rem;
    line-height: 1.2rem;
}

.tournament__banner {
    position: relative;
}

.tournament__banner-image {
    width: 100%;
    height: 18rem;
    object-fit: cover;
    border-radius: 1rem;
}

.tournament__banner-info {
    position: absolute;
    width: 40rem;
    top: 0;
    right: 0;
}

.tournament__banner-dates {
    display: inline-block;
    border: 1px solid #FFC660;
    border-radius: 0.25rem;
    padding: 0.35rem 1rem;
    margin-top: 1.5rem;
    color: #fff;
    font-size: 0.875rem;
}

.tournament__banner-title {
    font-size: 2.15rem;
    font-weight: 700;
    color: #fff;
    margin-top: 1.5rem;
}

.tournament__banner-digest {
    display: flex;
    margin-top: 1.5rem;
}

.tournament__banner-fund {
    display: flex;
    align-items: center;
}

.tournament__banner-fund-icon {
    margin-right: 0.5rem;
}

.tournament__banner-places-label,
.tournament__banner-countdown-label,
.tournament__banner-fund-label {
    font-size: 0.75rem;
    color: #fff;
}

.tournament__banner-fund-value {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-orange);
    margin-top: 0.25rem;
}

.tournament__banner-countdown {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 2rem;
}

.tournament__banner-places-value,
.tournament__banner-countdown-value {
    font-size: 1.25rem;
    font-weight: 700;
    color: #fff;
    margin-top: 0.25rem;
}
.tournament__banner-places{
    margin-right: 1rem;
}
.tournament__banner-places-value{
    min-height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.tournament__banner-ptcp {
    display: flex;
    align-items: center;
    margin-top: 1.5rem;
}

.tournament__banner-button {
    display: flex;
    align-items: center;
    height: 2.75rem;
    color: #fff;
    border: 1px solid var(--color-green);
    padding: 0 2rem;
    border-radius: 0.35rem;
    font-size: 0.75rem;
    cursor: pointer;
    text-decoration: none;
    margin-right: 2rem;
}

.tournament__banner-currency {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-right: 10px;
}

.tournament__banner-currency-label {
    color: #fff;
    font-size: 0.75rem;
}

.tournament__banner-currency-value {
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 0.875rem;
    font-weight: 700;
    margin-top: 0.5rem;
}

.tournament__banner-currency-icon {
    margin-right: 0.5rem;
}

.tournament__cond-title {
    font-size: 1.375rem;
    font-weight: 700;
    color: #fff;
    margin-top: 2rem;
}
body.light .tournament__cond-title {
    color: #272660;
}
.tournament__cond-text {
    margin-top: 1rem;
    color: #8184BC;
    font-size: 1rem;
}
body.light .tournament__cond-text {
    margin-top: 1rem;
    color: #21244f;
    font-size: 0.875rem;
}

.tournament__info {
    margin-top: 2rem;
    border: 2px dashed #3C3C71;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
    grid-gap: 1rem;
    padding: 1.5rem;
    border-radius: 0.5rem;
}

.tournament__info_thin {
    margin-top: 2rem;
    border: 2px dashed #3C3C71;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
    grid-gap: 1rem;
    padding: 1.5rem;
    border-radius: 0.5rem;
}

.tournament__info-item {
    display: flex;
    flex-direction: column;
}

.tournament__info-label {
    color: #8283C0;
    font-size: 0.75rem;
    margin-bottom: 0.5rem;
}

.tournament__info-value {
    display: flex;
    align-items: center;
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
}
body.light .tournament__info-value {
    color: #272660;
}
.tournament__info-icon {
    margin-right: 0.5rem;
}

.tournament__hint {
    margin-top: 1.5rem;
    text-align: center;
    color: var(--color-orange);
}
body.light .tournament__hint {
    color: #253566;
}
.tournament__leaders-title {
    font-size: 1.375rem;
    font-weight: 700;
    color: #fff;
    margin-top: 2rem;
}
body.light .tournament__leaders-title {
    color: #272660;
}
.tournaments__leaders-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem;
    margin-top: 1.5rem;
}

.tournament__leaders-table-head {
    display: flex;
}

.tournament__leaders-table-th {
    font-size: 0.875rem;
    color: #8283C0;
    padding-left: 1.5rem;
}

.tournament__leaders-table-row {
    display: flex;
    align-items: center;
    background-color: #272660;
    border: 1px solid #3C3C71;
    margin-top: 0.5rem;
    border-radius: 0.5rem;
}
body.light .tournament__leaders-table-row {
    background-color: #ffffff;
    border: none;
}
.tournament__leaders-table-row[data-index="1"] {
    /*background-image: linear-gradient(to right, #5A36D6, #FC5D3E 83.43%);*/
    /*border: none;*/
}


.tournament__leaders-table-td {
    display: flex;
    align-items: center;
    padding: 0 1.5rem;
    height: 3.25rem;
    font-size: 0.875rem;
    color: #fff;
}
body.light .tournament__leaders-table-td {
    color: #3c3c71;
}
body.light .tournament__leaders-table-row:first-child .tournament__leaders-table-td {
    color: #fff;
}
.tournament__leaders-table-td:first-child {
    font-size: 1.875rem;
    font-weight: 700;
    color: #8283C0;
    padding: 0;
    justify-content: center;
}

.tournament__table-pos::before {
    content: attr(data-index);
}


.tournament__table-pos[data-index="1"]::before {
    content: '';
    width: 100%;
    height: 2rem;
    background-image: url(/img/tournaments/leader-cup-icon.svg);
    background-repeat: no-repeat;
    background-position: 1rem center;
}


.tournament__table-pos[data-index="2"]::before {
    content: '';
    width: 100%;
    height: 2rem;
    background-image: url(/img/tournaments/leader-cup-icon.svg);
    background-repeat: no-repeat;
    background-position: 1rem center;
    filter: hue-rotate(-146deg);
    opacity: 0.5;
}

.tournament__table-pos[data-index="3"]::before {
    content: '';
    width: 100%;
    height: 2rem;
    background-image: url(/img/tournaments/leader-cup-icon.svg);
    background-repeat: no-repeat;
    background-position: 1rem center;
    filter: hue-rotate(326deg) brightness(0.5);
}

.tournament__leaders-table-td:nth-child(3) {
    font-family: Roboto, sans-serif;
}
.tournament__leaders-table-td:nth-child(4) {
    font-weight: 700;
    color: var(--color-green);
    font-family: Roboto, sans-serif;
}
.tournament__leaders-table-td:nth-child(4) {
    font-weight: 400;
    /*color: #3c3c71;*/
    font-family: Roboto, sans-serif;
    font-size: 0.75rem;
}
.tournament__hint-2 {
    text-align: center;
    color: #fff;
    margin-top: 2rem;
}
body.light .tournament__hint-2 {
    color: #1a1948;
}

.tournament__games {
    margin-top: 4rem;
}
.tournament__games-title {
    font-size: 1.375rem;
    font-weight: 700;
    color: #fff;
}
body.light .tournament__games-title {
    color: #3c3c71;
}

.tournament__games-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
    grid-gap: 1rem;
}

.tournament__game-image {
    width: 100%;
    height: auto;
    border-radius: 0.75rem;
}

.tournament__games-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}

.tournament__games-button {
    height: 2.5rem;
    display: flex;
    align-items: center;
    border: 1px solid #4B4A87;
    padding: 0 1.5rem;
    border-radius: 0.35rem;
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    cursor: pointer;
}
body.light .tournament__games-button {
    color: #3c3c71;
}
.tournament__games a{
    text-decoration: none;
}

.tournament__leaders-table .players_slot{
    box-shadow: #e4b556 0 0 3px;
    text-shadow: #e4b556 0 0 2px;
    background-image: linear-gradient(to right, #5A36D6, #FC5D3E 83.43%);
    border: none;
}

.tournament__play-table{
    position: fixed;
    right: 1.5rem;
    top: 10rem;
    width: 18rem;
    background-color: #3c3c7180;
    padding: 1rem;
    border-radius: 0.5rem;
    z-index: 100;
}

.tournament__play-table .title {
    font-size: 1.4rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
}
.tournament__play-table .subtitle{
    font-size: .75rem;
    font-weight: 500;
    line-height: 1.2rem;
    color: #888;
    display: flex;
    justify-content: center;
}

.tournament__play-table table{
    border-collapse: collapse;
}
.tournament__play-table th{
    font-size: 1rem;
    color: #fff;
    padding: 0 0.2rem;
}

.tournament__play-table td{
    font-size: 0.875rem;
    color: #fff;
    padding: 0 0.2rem;
    border: none;
}
.tournament__play-table tr{
    height: 2rem;
    border: none;
}
.tournament__play-table tr.changed td{
    color: #00C508;
}
.tournament__play-table tr.players_slot td{
    background-color: #0c214e;
}
.tournament__play-table tr td:first-child{
    width: 1rem;
    text-align: right;
}

.tournament__play-table tr td:last-child{
    text-align: right;
}

.tournament__leaders-table .text-overflow{
    display: block;
    max-width: 0;
    min-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hof__title {
    font-size: 1.3rem;
    color: #fff;
    margin-top: 3rem;
    margin-bottom: 2rem;
}
body.light .hof__title {
    color: #1A1944;
}
.hof__buttons {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
    grid-gap: 1rem;
    margin-bottom: 2rem;
}

.hof__button {
    height: 3.25rem;
    display: flex;
    align-items: center;
    padding: 1.5rem;
    border: 1px solid #3D3E6D;
    border-radius: 0.5rem;
    justify-content: center;
    color: #8283C0;
    font-size: 0.875rem;
    cursor: pointer;
}

.hof__button_active {
    border-color: #787BF7;
    box-shadow: 0 0 0 1px #787bf7;
    color: #fff;
    font-weight: 700;
}
body.light .hof__button_active {
    color: #1A1944;
}
#hof__table-wrap .spinner {
    background-color: rgba(29, 29, 74, 0.75);
}

.stock__item {
    height: 14rem;
    display: flex;
    border-radius: 1rem;
    margin-top: 2rem;
    background-color: #24235A;
}
body.light .stock__item {
    background-color: #ffffff;
    box-shadow: 0 0 1rem #0000000d;
}
.stock__item-image-wrap {
    width: 31.15rem;
    height: 14rem;
    overflow: hidden;
    flex-shrink: 0;
}


.stock__item-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 1rem;
}
.stock__item-texts {
    display: flex;
    flex-direction: column;
    padding: 2rem 2.5rem;
}
.stock__item-title {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 700;
}
body.light .stock__item-title {
    color: #3e3d77;
}
.stock__item-desc {
    color: #B2B3F0;
    font-size: 0.875rem;
    margin-top: 1.5rem;
    line-height: 1.75;
}
body.light .stock__item-desc {
    color: #757597;
}
.stock__item-button {
    height: 3rem;
    border: 2px solid #787BF7;
    display: flex;
    align-items: center;
    margin-right: auto;
    margin-top: 1.5rem;
    width: auto;
    padding: 0 2rem;
    border-radius: 0.5rem;
    text-align: center;
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    text-decoration: none;
    cursor: pointer;
    flex-shrink: 0;
}
body.light .stock__item-button {
    color: #3e3d77;
}

.breadcrumbs {
    display: flex;
}
.article__banner {
    border-radius: 1rem;
}
.breadcrumbs__item {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    color: #8283C0;
    font-weight: 700;
}
.breadcrumbs__item + .breadcrumbs__item {
    margin-left: 0.5rem;
}
.breadcrumbs__item + .breadcrumbs__item::before {
    content: '';
    display: inline-block;
    width: 0.4rem;
    height: 0.4rem;
    transform: rotate(45deg);
    border-right: 1px solid #8283C0;
    border-top: 1px solid #8283C0;
    margin-right: 0.6rem;
}

.article {
    display: flex;
}

.article__sidebar {
    display: flex;
    flex-direction: column;
    width: 13.25rem;
    flex-shrink: 0;
}

.article__sidebar-item {
    display: flex;
    flex-direction: column;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid #2f2d6d;
    cursor: pointer;
    text-decoration: none;
}
.article__sidebar-item:hover {
    border-color: #393785;
}
.article__sidebar-item + .article__sidebar-item {
    margin-top: 0.5rem;
}
.article__sidebar-item_active:hover,
.article__sidebar-item_active {
    border-color: var(--color-green);
}

.article__sidebar-item-date {
    font-size: 0.75rem;
    color: var(--color-orange);
    margin-bottom: 0.5rem;
}
.article__sidebar-item-title {
    font-size: 0.875rem;
    color: #8283C0;
    line-height: 1.25rem;
}

.article__sidebar-item_active .article__sidebar-item-title {
    color: #fff;
}
body.light .article__sidebar-item_active .article__sidebar-item-title {
    color: #313278;
}
.article__date {
    font-size: 0.75rem;
    margin: 2rem 0 1rem 0;
    color: var(--color-orange);
}

.article__title {
    font-size: 1.875rem;
    color: #fff;
    font-weight: 700;
    margin-bottom: 2rem;
}
body.light .article__title {
    color: #313278;
}
.article__text {
    color: #C8C9FF;
    font-size: 0.875rem;
    line-height: 1.5;
}
body.light .article__text {
    color: #242558;
    margin-bottom: 3rem;
}
.article__text h2 {
    font-size: 1.5rem;
    color: #fff;
    margin: 2rem 0 1.5rem 0;
    font-weight: 400;
}
body.light .article__text h2 {
    color: #313278;
}
.article__text p + p {
    margin-top: 1rem;
}
.article__text ul {
    list-style: none;
    color: #fff;
}
body.light .article__text ul {
    color: #313278;
}
.article__text ul li::before {
    content: '';
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 0.5rem;
    background-color: #FEC30C;
    margin-right: 0.5rem;
    top: 1px;
    position: relative;
}

.table {
    width: 100%;
    border-spacing: 0 0.5rem;
}

.table thead th {
    text-align: left;
    padding: 1rem;
    color: #8283C0;
    font-size: 0.875rem;
}
.user-wallet .table thead th {
    text-align: left;
    padding: 0.5rem 0.75rem;
    color: #8283C0;
    font-size: 0.75rem;
    font-weight: 600;
}


.user-wallet .table tbody td {
    background-color: #272660;
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
}


.table tbody td {
    background-color: #272660;
    padding: 1rem;
    font-size: 0.875rem;
    max-height: 4.25rem;
}
body.light .table tbody td {
    background-color: #e0e0f1;
}
.table tbody td:first-child {
    border-radius: 0.5rem 0 0 0.5rem;
}
.table tbody td:last-child {
    border-radius: 0 0.5rem 0.5rem 0;
}

.table tbody tr:nth-child(even) td {
    background-color: transparent;
    border-top: 1px solid #3C3C71;
    border-bottom: 1px solid #3C3C71;
}
.table tbody tr:nth-child(even) td:first-child {
    border-left: 1px solid #3C3C71;
}
.table tbody tr:nth-child(even) td:last-child {
    border-right: 1px solid #3C3C71;
}


body.light .table tbody tr:nth-child(even) td {
    background-color: #fbfbfb;
    border-top: 1px solid #f3f3fc;
    border-bottom: 1px solid #f3f3fc;
}
body.light .table tbody tr:nth-child(even) td:first-child {
    border-left: 1px solid #f3f3fc;
}
body.light .table tbody tr:nth-child(even) td:last-child {
    border-right: 1px solid #f3f3fc;
}



.table__text_white {
    color: #fff;
}
body.light .table__text_white {
    color: #2c2b63;
}
.table__image {
    margin-right: 0.5rem;
    width: 2rem;
    height: 2rem;
    border-radius: 1rem;
    flex-shrink: 0;
}
.table__image-small {
    width: 1.5rem;
    height: 1.5rem;
}
.table__icon {
    margin-right: 0.5rem;
}
.table__money {
    display: flex;
    align-items: center;
}

.table__money .money_int {
    color: #ffffff;
    font-family: Roboto, sans-serif;
}
.table__money .money__rest {
    color: #8283C0;
    font-family: Roboto, sans-serif;
}

.table__money_green .money__int {
    color: var(--color-green);
    font-weight: 700;
}

.table__money_green .money__rest {
    font-weight: 700;
}

.table__multiplier {
    background-color: rgba(162, 220, 141, 0.12);
    padding: 0.35rem 0.5rem;
    border-radius: 0.25rem;
    font-weight: 700;
    font-size: 0.875rem;
    color: var(--color-green);
}


.table td.table__rating-index {
    font-size: 1.875rem;
    font-weight: 700;
    color: #8283C0;
    text-align: center;
    padding: 0.5rem;
}

.table__rating-index::before {
    content: attr(data-index);
}
.table__rating-index[data-index="1"]::before {
    content: '';
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-image: url(/img/tournaments/leader-cup-icon.svg);
    background-repeat: no-repeat;
    background-position: 0.5rem center;
}
.table__rating-index[data-index="2"]::before {
    content: '';
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-image: url(/img/tournaments/leader-cup-icon.svg);
    background-repeat: no-repeat;
    background-position: 0.5rem center;
    filter: hue-rotate(-146deg);
    opacity: 0.5;
}

.table__rating-index[data-index="3"]::before {
    content: '';
    display: inline-block;
    width: 2rem;
    height: 2rem;
    background-image: url(/img/tournaments/leader-cup-icon.svg);
    background-repeat: no-repeat;
    background-position: 0.5rem center;
    filter: hue-rotate(326deg) brightness(0.5);
}
.table__date {
    color: #8283C0;
}
.table__link {
    color: #2281F6;
    font-family: 'Gotham Pro', sans-serif;
    cursor: pointer;
    border-bottom: 1px solid transparent;
}
.table thead th.table__cell-right,
.table tbody td.table__cell-right {
    text-align: right;
}
.table tbody td.table__cell-right .table__money {
    text-align: right;
    justify-content: flex-end;
}


.table__sort-arrows {
    width: 12px;
    height: 12px;
    display: inline-block;
    position: relative;
    margin-left: 5px;
}
.table__sort-arrows::before {
    content: '';
    display: block;
    position: absolute;
    border-top: 5px solid #8283C0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    top: 9px;
    width: 0;
    height: 0;
    cursor: pointer;
}

.table__sort-arrows::after {
    content: '';
    display: block;
    position: absolute;
    border-bottom: 5px solid #8283C0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    top: 2px;
    width: 0;
    height: 0;
    cursor: pointer;
}

.table__game-icon {
    width: 2rem;
    height: 2rem;
    border-radius: 1rem;
    object-fit: cover;
}

.play__buttons {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 1rem;
}
.play__button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 0.25rem;
    background-color: #2c2b63;
    margin-left: 0.5rem;
    cursor: pointer;
}
.play__button:hover {
    background-color: #343272;
}
body.light .play__button {
    background-color: #e7e7f9;
}
body.light .play__button:hover {
    background-color: #e0e0f6;
}
#game-wrapper{
    max-width: 100vw !important;
    max-height: 100vh !important;
    aspect-ratio: 16/9 !important;
}

@media screen and (max-width: 1800px) {
    #game-wrapper.tournament-game{
        width: 85% !important;
    }
}
@media screen and (max-width: 1600px) {
    #game-wrapper.tournament-game{
        width: 80% !important;
    }
}
@media screen and (max-width: 1400px) {
    #game-wrapper.tournament-game{
        width: calc(100vw - 25rem) !important;
    }
}
#game-wrapper.tournament-game{
    width: 100%;
}

#game-frame {
    border: none;
    margin-top: 1rem;
    width: 100%;
    background-color: #393766;
    border-radius: 1rem;
    box-shadow: 0 0 1rem #00000026;
    max-width: 100vw !important;
    max-height: 100vh !important;
    aspect-ratio: 16/9 !important;
    height: auto !important;
}
#game-frame iframe {
    width: 100%;
    max-width: 100vw !important;
    max-height: 100vh !important;
    aspect-ratio: 16/9 !important;
    height: auto !important;
}

#play__wager {
    display: none;
    color: #fff;
    height: 2rem;
    position: absolute;
    /*margin-top: -2rem;*/
    top: 1rem;
    right: 6rem;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 610;
    font-size: .875rem;
    font-weight: 500;
    min-width: 18rem;
    background: linear-gradient(90deg, #677f7b var(--progress, 0%), #000000 var(--progress, 0%));
    border-radius: 1rem;
}
#game-wrapper.show-bonus #play__wager{display: flex;}

/*#play__wager > *{*/
/*    display: flex;*/
/*    flex-flow: row;*/
/*    padding: 0.5rem;*/
/*    background-color: #00000070;*/
/*    justify-content: space-evenly;*/
/*    border-radius: 1rem;*/
/*    pointer-events: none;*/
/*}*/
#balance-mode__form {
    width: 40rem;
    min-height: 16rem;
    background-color: #fff;
    display: grid;
    padding: 3rem;
    border-radius: 1rem;
    max-width: 100%;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem;
}
.balance-mode__option {
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 2px solid #eee;
    border-radius: 1rem;
    padding: 1rem;
}
.balance-mode__option input {
    display: none;
}
.balance-mode__option-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #3D3E6D;
}
.balance-mode__option-value {
    font-size: 1.25rem;
    margin-top: 1rem;
    font-weight: 700;
}
.balance-mode__option-value .money__int {
    color: var(--color-gray-dark);
}
.balance-mode__option-value .money__rest {
    color: var(--color-gray);
}
.balance-mode__button {
    margin-top: 1rem;
    height: 2.5rem;
    padding: 0 2rem;
    background-color: var(--color-blue);
    color: #fff;
    border-radius: 0.5rem;
    border: none;
    outline: none;
    font-weight: 700;
    font-size: 0.875rem;
    cursor: pointer;
    text-decoration: none;
    display: flex;
    align-items: center;
}

.bonus-pad-block{
    display: flex;
    flex-flow: column;
    margin: 0 1rem;
    pointer-events: none;
}
.bonus-pad-block .title{
    font-size: 0.6rem;
    text-shadow: black 0 0 2px;
    pointer-events: none;
}
.bonus-pad-block .value{
    font-size: 0.65rem;
    font-weight: 600;
    text-shadow: black 0 0 2px;
    pointer-events: none;
}

.landing__footer-text{
    max-height: 20rem;
    overflow: auto;
    width: 100%;
    margin-bottom: 3rem;
    padding-right: 2rem;
}
.landing__footer-text h3{
    color: #FFFFFF;
    font-family: "Gotham Pro", "sans-serif";
    margin-bottom: 1rem;
}
body.light .landing__footer-text h3{
    color: #2D304E;
}
.landing__footer-text p{
    color: #8C90CA;
    font-family: "Gotham Pro", "sans-serif";
    font-weight: 400;
    margin-bottom: 1rem;
    font-size: .875rem;
    line-height: 1.2rem;
}

.landing__footer-text p strong{
    color: #FFFFFF;
}
body.light .landing__footer-text p strong{
    color: #2D304E;
}

.landing__footer-images{
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-around;
    margin: 4rem 0;
}

.landing__footer-image{
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    color: #FFFFFF;
    font-size: .875rem;
    font-weight: 500;
}


.width-limiter hr{
    color: #2D304E;
    border: 1px solid;
}
body.light .width-limiter hr{
    color: #E9E9E9;
    border: 1px solid;
}


.landing__footer-logo{
    display: flex;
    justify-content: center;
    margin-top: -80px;
}
body.light .landing__footer-image{
    color: #2D304E;
}

.landing__footer-logo img{
    box-sizing: content-box;
}

.landing__footer-logo .img-bg {
    background-color: #191933;
}
body.light .landing__footer-logo .img-bg {
    background-color: #FFFFFF;
}
body.light .landing__footer-logo img{
    filter: grayscale(0) brightness(0.8);
}

.landing__bonus{
    height: 22rem;
    width: 15rem;
    background-size: cover;
    overflow: hidden;
    border-radius: .5rem;
    margin: 0 1rem;
    display: flex;
    flex-flow: column-reverse;
}
.landing__bonus .description{
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    padding-top: 1rem;
    width: 100%;
    display: flex;
    flex-flow: column;
    justify-content: flex-end;
    align-items: center;
}

.landing__bonus .title{
    font-family: "Gotham Pro", "sans-serif";
    color: #FFF;
    font-size: 1rem;
    line-height: 1.2rem;
    font-weight: 600;
    text-align: center;
}

.landing__bonus .prize{
    font-family: "Gotham Pro", "sans-serif";
    color: #FFF;
    font-size: 1.2rem;
    line-height: 1.4rem;
    font-weight: 700;
    text-align: center;
}

.landing__bonus .button_green{
    display: flex;
    height: 2rem;
    width: 90%;
    border-radius: .5rem;
    justify-content: center;
    align-items: center;
    font-size: .875rem;
    font-weight: 600;
    color: #000;
    cursor: pointer;
    text-decoration: none;
}
.landing__footer-text img{
    max-height: 12rem;
    object-fit: contain;
}

.categories-wrapper {
    display: flex;
    position: relative;
}
.categories-wrapper .games-search-form__category{
    display: none;
}
.categories-wrapper .games-search-form__name{
    margin: 0 .5rem;
    width: 10rem;
}
.categories-wrapper .games-search-form__provider{
    margin-right: 0;
    width: 12rem;
    position: static;
}
.categories-wrapper .games-search-form__provider .custom-select__dropdown_wide{
    left: 0;
    top: 6rem;
    width: 100%;
}

.lnd-categories {
    display: grid;
    grid-template-columns: repeat(7, auto);
    margin-top: 2rem;
    flex-grow: 1;
}
body.light .lnd-categories {
    box-shadow: 0 0 1rem #0000000d;
    border-radius: 1rem;
}
.lnd-categories__item {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: .5rem .4rem;
    text-decoration: none;
    position: relative;
    cursor: pointer;
    background: linear-gradient(135deg, #3A42E1 2.88%, #620C90 98.14%);
    border: none;
    border-radius: 1rem;
    margin-right: 3px;
    height: 52px;
}
body.light .lnd-categories__item {
    border: none;
}
/*.lnd-categories__item:first-child {*/
/*    border-radius: 1rem 0 0 1rem;*/
/*}*/
/*.lnd-categories__item:last-child {*/
/*    border-radius: 0 1rem 1rem 0;*/
/*}*/
/*body.light .lnd-categories__item:first-child {*/
/*    border-radius: 1rem 0 0 1rem;*/
/*}*/
/*body.light .lnd-categories__item:last-child {*/
/*    border-radius: 0 1rem 1rem 0;*/
/*}*/
.lnd-categories__item-img {
    height: 1.4rem;
}
.lnd-categories__item-title {
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.675rem;
    margin: 0 3px 0 8px;
    text-align: center;
}
.lnd-categories__item-hint {
    color: #8283C0;
    font-size: 0.75rem;
    font-weight: 600;
    margin-left: 0.5rem;
    display: none;
}
/*.lnd-categories__item::before {*/
/*    content: '';*/
/*    display: block;*/
/*    width: 1px;*/
/*    height: 50%;*/
/*    background-color: #3d3b79;*/
/*    position: absolute;*/
/*    left: 0;*/
/*}*/
/*body.light .lnd-categories__item::before {*/
/*    background-color: #dcdcf1;*/
/*}*/
/*.lnd-categories__item:first-child::before {*/
/*    display: none;*/
/*}*/
.lnd-categories__item:hover {
    background-image: linear-gradient(to bottom, #27266000, #2c2b66);
}
.lnd-categories__item_active,
.lnd-categories__item_active:hover {
    background-image: linear-gradient(to bottom, #27266000, #353679);
}
/*.lnd-categories__item_active::before,*/
/*.lnd-categories__item_active + .lnd-categories__item::before {*/
/*    display: none;*/
/*}*/

/*body.light .lnd-categories__item_active::before,*/
/*body.light .lnd-categories__item_active + .lnd-categories__item::before {*/
/*    display: none;*/
/*}*/

.landing-search .custom-select{
    background: linear-gradient(135deg, #3A42E1 2.88%, #620C90 98.14%);
}
.landing-search .arrow-position .custom-select__arrow.arrow-down{
    border-bottom: 2px solid #7582F1;
    border-right: 2px solid #7582F1;
}

.landing-search .games-search-form__name{
    margin: 0;
}

.landing-search .custom-select.games-search-form__provider{
    height: auto;
}

.landing-search .custom-select__value {
    font-size: 14px;
    font-weight: 500;
}

body.light .landing-search .custom-select__value {
    color: #FFF;
}


.landing-search .games-search-form__name .input__field{
    border-radius: 1rem;
    border: none;
    background: none;
    border-image-source: none;
    width: 3rem;
    padding-right: 2rem;
    transition: width .3s;
}
.landing-search .games-search-form__name .input__field::placeholder{
    color: transparent;
}
.landing-search .games-search-form__name .input__icon_left{
    left: .8rem;
}

.landing-search .games-search-form__name:focus-within .input__field{
    background: #0B0D31;
    width: 186px;
}

.landing-search .games-search-form__name:focus-within .input__field::placeholder{
    color: #FFF;
}

.landing-search .games-search-form__name:has(input:focus) .input__icon_left{
    left: .4rem;
}

.gradient-background{
    padding: 2px;
    background: linear-gradient(135deg, #3A42E1 2%, #620C90 98%);
    border-radius: 1rem;
    width: 3rem;
    overflow: hidden;
    transition: width .3s;
}

.gradient-background:has(.games-search-form__name:focus-within) {
    width: 190px;
    margin: 0 .5rem 0 1rem;
}

.landing-search .input-space{
    width: 220px;
    display: flex;
    justify-content: flex-end;
    padding-right: 5px;
}

.landing-search .input__icon_right{
    right: -1rem;
    pointer-events: auto;
}

@media screen and (max-width: 1230px) {
    .categories-wrapper{
        flex-flow: column;
    }
    /*.categories-wrapper .lnd-categories{*/
    /*    grid-template-columns: repeat(auto-fit, minmax(3rem, 1fr));*/
    /*}*/
    .categories-wrapper .lnd-categories .lnd-categories__item{
        justify-content: space-evenly;
    }
    .landing-search .input-space{
        width: auto;
    }
    .landing-search .gradient-background {
        width: 190px;
    }
    .gradient-background:has(input:focus) {
        margin: 0;
    }

    .landing-search .games-search-form__name .input__field{
        background: #0B0D31;
        width: 186px;
        transition: width .5s;
    }

    .landing-search .games-search-form__name .input__field::placeholder{
        color: #FFF;
    }

    .landing-search .games-search-form__name .input__icon_left{
        left: .4rem;
    }

    .categories-wrapper .games-search-form__provider .custom-select__dropdown_wide{
        top: 12rem;
    }

}

.ref-system {
    /*background-color: #1e1d4f;*/
    background: linear-gradient(180deg, #1E1D4F 0%, #17163E 100%);
}
/*body.light .ref-system {*/
/*    background-color: #f3f3fc;*/
/*}*/
.ref-system__header {
    position: relative;
    padding-top: 10rem;
    min-height: 50rem;
    background-image: linear-gradient(to bottom, #1e1d4e, transparent 5rem), url(/img/referral/bg-gradient-img-1.png), url(/img/referral/bg-gradient-img.png), url(/img/referral/circles.svg);
    background-repeat: no-repeat;
    background-position: left top, calc(50% - 25rem) -3rem, calc(50% + 30rem) -5rem;
}
/*body.light .ref-system__header {*/
/*    background-image: linear-gradient(to bottom, #f3f3fc, transparent 5rem), url(/img/referral/bg_left.png), url(/img/referral/bg_right.png);*/
/*}*/
/*@media (max-width: 1600px) {*/
/*    .ref-system__header {*/
/*        background-position: left top, calc(50% - 33rem) -8rem, calc(50% + 28rem) -5rem;*/
/*    }*/
/*}*/
.ref-system__slogan {
    margin: 0 auto;
    display: block;
    justify-content: center;
    color: #fff;
    width: 50rem;
    max-width: 100%;
}
.ref-system__slogan p{
    font-family: Benzin;
    font-weight: 600;
    font-size: 50px;
    line-height: 55px;
    letter-spacing: 0;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
}
/*body.light .ref-system__slogan {*/
/*    color: #272660;*/
/*}*/
/*.ref-system__slogan_yellow {*/
/*    color: #FFC660;*/
/*    background-color: #272660;*/
/*    padding: 0.25rem 1rem;*/
/*    border-radius: 0.5rem;*/
/*    margin-right: 0.5rem;*/
/*}*/
/*body.light .ref-system__slogan_yellow {*/
/*    background-color: #fff;*/
/*}*/
.ref-system__sub-slogan {
    font-family: Montserrat;
    font-weight: 500;
    font-size: 16px;
    line-height: 25px;
    letter-spacing: 0px;
    text-align: center;
    margin: 1rem auto 0 auto;
    width: 31rem;
    max-width: 100%;
    color: #D0D8FF;
}
body.light .ref-system__sub-slogan {
    color: #575682;
}
.ref-system__start-btn {
    background: linear-gradient(225deg, #F99F7E 14.89%, #FF4C00 85.85%);
    position: relative;
    display: flex;
    margin: 2rem auto;
    height: 56px;
    border: 1px solid rgba(255, 255, 255, 0.47);
    border-radius: 1rem;
    justify-content: center;
    align-items: center;
    padding: 1rem 2rem;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
}
/*body.light .ref-system__start-btn {*/
/*    color: #272660;*/
/*}*/
/*.ref-system__start-btn::before {*/
/*    content: '';*/
/*    width: 3rem;*/
/*    height: 3rem;*/
/*    border-radius: 4rem;*/
/*    background-color: #89C763;*/
/*    position: absolute;*/
/*    right: 0.75rem;*/
/*}*/
/*.ref-system__start-btn::after {*/
/*    content: '';*/
/*    width: 0.75rem;*/
/*    height: 0.75rem;*/
/*    position: absolute;*/
/*    border-top: 2px solid #1e1d4f;*/
/*    border-right: 2px solid #1e1d4f;*/
/*    transform: rotate(45deg);*/
/*    top: 1.75rem;*/
/*    right: 1.95rem;*/
/*}*/
.ref-system__steps {
    display: grid;
    height: 6.25rem;
    background-color: #272660;
    border-radius: 5rem;
    padding: 1.15rem 0;
    margin: 6rem auto 0 auto;
    grid-template-columns: repeat(3, 1fr);
}
/*body.light .ref-system__steps {*/
/*    background-color: #ffffff;*/
/*    box-shadow: 0 0 1rem #0000000d;*/
/*}*/
.ref-system__step {
    display: flex;
    max-width: 21rem;
    align-items: center;
    position: relative;
    padding: 0 2rem;
}
.ref-system__step + .ref-system__step::before {
    content: '';
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    border-top: 2px solid #8283C0;
    border-right: 2px solid #8283C0;
    transform: rotate(45deg);
    position: absolute;
    left: -1.25rem;
    top: 1.35rem;
}
.ref-system__step-icon {
    width: 51px;
    height: 51px;
    position: relative;
    flex-shrink: 0;
    margin-right: 0.5rem;
    pointer-events: none;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 42%;
    background: linear-gradient(135.12deg, #F99F7E 0.07%, #FF4C00 100.02%);
    color: #fff;
    font-weight: 700;
    font-size: 1.5rem;
    z-index: 1;
}
.ref-system__step-icon p{
    width: 32px;
    height: 32px;
    border-radius: 42%;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.79) 0%, rgba(255, 255, 255, 0) 100%);
    font-family: Roboto;
    font-weight: 900;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
    text-align: center;
    vertical-align: middle;

}
/*.ref-system__step-icon::before {*/
/*    content: attr(data-index);*/
/*    display: block;*/
/*    color: #fff;*/
/*    font-weight: 700;*/
/*    font-size: 0.875rem;*/
/*    position: absolute;*/
/*    left: 1.7rem;*/
/*    top: 1.5rem;*/
/*    z-index: 1;*/
/*}*/
/*.ref-system__step-image {*/
/*    position: absolute;*/
/*    left: -9.25rem;*/
/*    top: -5.15rem;*/
/*}*/
.ref-system__step-text {
    color: #C0C4FB;
    font-family: Montserrat;
    font-weight: 700;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0;
}
/*body.light .ref-system__step-text {*/
/*    color: #272660;*/
/*}*/
.ref-system__step-link {
    color: #C0C4FB;
    text-decoration: none;
    cursor: pointer;
}
/*body.light .ref-system__step-link {*/
/*    color: #ffa400;*/
/*}*/
.ref-system__step-link:hover {
    text-decoration: underline;
}
/*.ref-system__info-title {*/
/*    color: #5B4CF1;*/
/*    font-size: 3.75rem;*/
/*    font-weight: 900;*/
/*    text-transform: uppercase;*/
/*    text-align: center;*/
/*    width: 50rem;*/
/*    max-width: 100%;*/
/*    margin: 0 auto;*/
/*    position: relative;*/
/*}*/
/*.ref-system__info-title::before {*/
/*    content: '';*/
/*    display: block;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    position: absolute;*/
/*    background-image: linear-gradient(to bottom, transparent, #1e1d4f);*/
/*}*/
/*body.light .ref-system__info-title::before {*/
/*    background-image: linear-gradient(to bottom, transparent, #f2f3fc);*/
/*}*/
.ref-system__benefits {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    margin: 3rem auto;
}
.ref-system__benefit_big {
    width: 31rem;
    display: flex;
    flex-direction: column;
    padding: 2rem;
    height: 13rem;
    background-color: #272660;
    flex-shrink: 0;
    border-radius: 1rem;
    position: relative;
}
/*body.light .ref-system__benefit_big {*/
/*    background-color: #ffffff;*/
/*    box-shadow: 0 0 1rem #0000000d;*/
/*}*/
.ref-system__benefit-uah {
    position: absolute;
    font-weight: 900;
    font-size: 12rem;
    color: #343279;
    right: 1rem;
    top: 0;
}
/*body.light .ref-system__benefit-uah {*/
/*    color: #f3f3fc;*/
/*}*/
.ref-system__benefit-title {
    color: #fff;
    z-index: 1;
    font-family: Roboto;
    font-weight: 900;
    font-size: 44px;
    line-height: 40.5px;
    letter-spacing: 0;
    vertical-align: middle;

}
/*body.light .ref-system__benefit-title {*/
/*    color: #272660;*/
/*}*/
.ref-system__benefit-text {
    color: #C0C4FB;
    z-index: 1;
    font-size: 0.875rem;
    margin-top: .5rem;
    max-width: 20rem;
}
/*body.light .ref-system__benefit-text {*/
/*    color: #272660;*/
/*}*/
.ref-system__benefit_small {
    width: 14rem;
    height: 13rem;
    margin-left: 1.5rem;
    flex-shrink: 0;
    padding: 3rem 1.5rem;
    border-radius: 1rem;
    /*background-color: #5B4CF1;*/
    background: linear-gradient(128.6deg, #F99F7E -1.38%, #FF4C00 100%);
    position: relative;
}
.ref-system__benefit_small .ref-system__benefit-text{
    color: #fff;
}
/*body.light .ref-system__benefit_small {*/
/*    background-color: #ffffff;*/
/*    box-shadow: 0 0 1rem #0000000d;*/
/*}*/
.ref-system__benefit-image-1 {
    position: absolute;
    right: -1rem;
    top: 1.5rem;
    z-index: 1;
}
.ref-system__benefit-image-2 {
    position: absolute;
    right: -1.5rem;
    top: 0;
    z-index: 1;
}

.ref-system__details {
    display: flex;
    align-items: center;
    height: 6.25rem;
    background-color: #272660;
    border-radius: 5rem;
    padding: 1.15rem 3rem;
    margin: 2rem auto;
    width: 80%;
}
.ref-system__details-text{
    font-family: Montserrat;
    font-weight: 600;
    font-size: 19px;
    line-height: 21px;
    letter-spacing: 0;
    color: #C0C4FB;
}

.ref-system__features {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
    margin: 6rem 0;
}
.ref-system__feature {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
}
.ref-system__feature-image {
    height: 5rem;
}
.ref-system__feature-text {
    text-align: center;
    color: #fff;
    margin-top: 1rem;
    font-size: 0.875rem;
}

.ref-system__side-circle{
    position: absolute;
    right: 0;
}
.ref-system__bottom-padding{
    height: 15rem;
}
/*body.light .ref-system__feature-text {*/
/*    color: #272660;*/
/*    font-size: 0.95rem;*/
/*    font-weight: 700;*/
/*}*/
/*.ref-system__top {*/
/*    padding: 5rem 0;*/
/*    background-image: linear-gradient(to bottom, #232256, transparent 9rem);*/
/*    position: relative;*/
/*}*/
/*body.light .ref-system__top {*/
/*    background-image: linear-gradient(to bottom, #ffffff, transparent 9rem);*/
/*}*/
.ref-system__glow-left {
    position: absolute;
    left: -5rem;
    top: -32rem;
}
.ref-system__glow-right {
    position: absolute;
    right: -5rem;
    top: -32rem;
}
/*body.light .ref-system table {*/
/*    background-color: #fff;*/
/*    padding: 2rem;*/
/*    border-radius: 1rem;*/
/*    box-shadow: 0 0 1rem #0000000d;*/
/*}*/
@media (max-width: 1100px) {
    .ref-system__steps {
        grid-template-columns: 1fr;
        height: auto;
        margin: 1rem auto 0 auto;
        border-radius: 1rem;
    }
    .ref-system__step{
        max-width: initial;
    }
    .ref-system__step-text{
        font-size: 1rem;
    }
    .ref-system__step + .ref-system__step::before {
        display: none;
    }
    .ref-system__benefits {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .ref-system__benefit_big:first-child{
        grid-column-start: 1;
        grid-column-end: 3;
    }
    .ref-system__benefit_small{
        margin: 1rem 1rem;
    }
    .ref-system__features{
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 900px) {
    .ref-system__top table th:nth-child(4){
        display: none;
    }
    .ref-system__top table td:nth-child(4){
        display: none;
    }
}

.header-switch{
    background-color: #1C1F3E;
    border-radius: 2rem;
    height: 2.5rem;
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
}
body.light .header-switch{
    background-color: #D2D3EA;
}
.header-switch > a{
    text-decoration: none;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 0 1rem;
    font-size: .875rem;
    line-height: 1rem;
    margin: 0;
    border-radius: 2rem;
    font-weight: 500;
    color: #8C90CA;
}
.header-switch > a.active{
    background-color: #2B2F5B;
    color: #FFFFFF;
}
body.light .header-switch > a.active{
    background-color: #F3F3FB;
}
.header-switch:hover > a{
    color: #FFFFFF;
}
.header-switch a:hover .menu__item-text{
    color: #FFFFFF;
}
body.light .header-switch a .menu__item-text{
    color: #8186BD;
}
body.light .header-switch a.active .menu__item-text{
    color: #000000;
}
body.light .header-switch a:hover .menu__item-text{
    color: #000000;
}
.header-switch img{
    height: 1.2rem;
    width: 1.2rem;
    filter: brightness(60%);
}
.header-switch a:hover img{
    filter: none;
}
body.light .header-switch a:hover img{
    filter: invert(1);
}
.header-switch > a.active img{
    filter: none;
}
body.light .header-switch > a.active img{
    filter: invert(1);
}

/* slots default active */
body:not(.sport) .header-switch > a.slots{
    background-color: #2B2F5B;
    color: #FFFFFF;
}
body:not(.sport) .header-switch > a.slots img{
    filter: none;
}

body.light:not(.sport) .header-switch > a.slots{
    background-color: #F3F3FB;
}
body.light:not(.sport) .header-switch a.slots .menu__item-text{
    color: #000000;
}
body.light:not(.sport) .header-switch > a.slots img{
    filter: invert(1);
}

/* sport mode active */
body.sport .header-switch > a.sport{
    background-color: #2B2F5B;
    color: #FFFFFF;
}
body.sport .header-switch > a.sport img{
    filter: none;
}

body.light.sport .header-switch > a.sport{
    background-color: #F3F3FB;
}
body.light.sport .header-switch a.sport .menu__item-text{
    color: #000000;
}
body.light.sport .header-switch > a.sport img{
    filter: invert(1);
}

.hidden-menu.open-menu {
    transition: opacity 0.4s ease 0s;
    opacity: 1;
    pointer-events: all;
    visibility: visible;
}

.hidden-menu__content {
    border-radius: 24px;
    background-color: #181A32;
    padding: 16px 7px 7px 16px;
}

.hidden-menu__content .wrap-content {
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 5px;
}

.hidden-menu__content .wrap-content::-webkit-scrollbar {
    background: transparent;
    width: 4px;
}

.hidden-menu__content .wrap-content::-webkit-scrollbar-thumb {
    background-color: #000;
    opacity: 0.8;
    border-radius: 2px;
}

.hidden-menu__first-head {
    border-radius: 14px;
    background-color: #2C2B64;
    padding: 16px 16px 8px;
    margin-bottom: -8px;
}

.hidden-menu__first-block-phone {
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    display: flex;
    padding-bottom: 16px;
    position: relative;
}

.hidden-menu__first-block-phone::after {
    content: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.29289 15.7071C8.90237 15.3166 8.90237 14.6834 9.29289 14.2929L11.5858 12L9.29289 9.70711C8.90237 9.31658 8.90237 8.68342 9.29289 8.29289C9.68342 7.90237 10.3166 7.90237 10.7071 8.29289L13.7071 11.2929C14.0976 11.6834 14.0976 12.3166 13.7071 12.7071L10.7071 15.7071C10.3166 16.0976 9.68342 16.0976 9.29289 15.7071Z' fill='white'/%3e%3c/svg%3e");
    position: absolute;
    right: 0;
    transform: translateY(-50%);
    top: 50%;
}

.hidden-menu__first-block-phone .circle {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48' fill='none'%3e%3crect width='48' height='48' rx='24' fill='url(%23paint0_linear_977_31816)'/%3e%3cdefs%3e%3clinearGradient id='paint0_linear_977_31816' x1='22.6462' y1='0' x2='22.6462' y2='48' gradientUnits='userSpaceOnUse'%3e%3cstop offset='0.0203318' stop-color='%23E350F0'/%3e%3cstop offset='1' stop-color='%23787BF7'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e");
    font-size: 0;
    height: 48px;
    flex: 0 0 48px;
    margin-right: 16px;
    width: 48px;
}

.hidden-menu__first-wrap-phone {
    padding-right: 22px;
}

.hidden-menu__first-wrap-phone p {
    color: #8186BD;
    font-size: 10px;
    line-height: 12px;
    margin: 0 0 1px !important;
}

.hidden-menu__first-wrap-phone a {
    font-size: 16px;
    line-height: 24px;
}

.hidden-menu__first-block-price {
    padding-top: 16px;
    margin-left: 1rem;
    max-width: 50%;
}

.hidden-menu__first-block-price p {
    font-size: 10px;
    line-height: 12px;
}

.hidden-menu__first-block-price p:first-child {
    color: #8186BD;
    margin: 0 !important;
    text-align: center;
}

.hidden-menu__first-price {
    align-items: center;
    display: flex;
    justify-content: center;
}

.hidden-menu__first-price img {
    flex: 0 0 24px;
    margin-right: 8px;
}

.hidden-menu__first-price p {
    font-size: 32px;
    line-height: 40px;
}

.hidden-menu__first-price p span {
    font-size: 24px;
    font-weight: 700;
    line-height: 40px;
    opacity: 0.5;
}

.hidden-menu__first-links {
    display: flex;
    flex-wrap: wrap;
    margin: 15px -4px 0;
}

.hidden-menu__first-link {
    align-items: center;
    border-radius: 8px;
    display: flex;
    height: 40px;
    margin: 0 4px 8px;
    padding: 8px;
    position: relative;
    width: calc(50% - 8px);
}

.hidden-menu__first-link.my-tasks {
    background: linear-gradient(85deg, rgba(211, 33, 36, 0.48) -84.75%, rgba(57, 56, 109, 0.48) 99.7%);
}

.hidden-menu__first-link.my-tasks img {
    height: 21px;
    width: 22px;
}

.hidden-menu__first-link.achievements {
    background: linear-gradient(85deg, rgba(233, 228, 111, 0.48) -84.75%, rgba(57, 56, 109, 0.48) 99.7%);
}

.hidden-menu__first-link.achievements img {
    min-height: 32px;
    min-width: 32px;
    top: 3px;
}

.hidden-menu__first-link.lucky-spin {
    background: linear-gradient(85deg, rgba(54, 131, 251, 0.48) -84.75%, rgba(57, 56, 109, 0.48) 99.7%);
}

.hidden-menu__first-link.shop {
    background: linear-gradient(85deg, rgba(209, 209, 255, 0.48) -84.75%, rgba(57, 56, 109, 0.48) 99.7%);
}

.hidden-menu__first-link.shop img {
    height: 21px;
    width: 22px;
}

.hidden-menu__first-link .wrap-img {
    align-items: center;
    display: flex;
    justify-content: center;
    height: 24.151px;
    flex: 0 0 24.151px;
    margin-right: 9px;
    width: 24.151px;
}

.hidden-menu__first-link .wrap-img img {
    position: relative;
}

.hidden-menu__first-link .label, .menu__item .label {
    border-radius: 99px;
    background: linear-gradient(180deg, #E350F0 2.03%, #787BF7 100%);
    font-size: 8px;
    line-height: 8px;
    padding: 2.5px 4px 1.5px;
    position: absolute;
    pointer-events: none;
    right: 0.5px;
    transform: translateY(-50%);
    text-transform: uppercase;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    z-index: 1;
}

.hidden-menu__list {
    border-bottom: 1px solid #2C2B65;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    list-style-position: inside;
    margin-top: 15px;
    padding-bottom: 1px;
    padding-top: 8px;
}

.hidden-menu__list li {
    margin-bottom: 24px;
    width: 50%;
}

.hidden-menu__list li.live-games-icon,
.hidden-menu__list li.table-games-icon,
.hidden-menu__list li.vr-sport-icon,
.hidden-menu__list li.tvbet-icon,
.hidden-menu__list li.favorites-icon,
.hidden-menu__list li.hall-of-fame-icon,
.hidden-menu__list li.for-partners-icon,
.hidden-menu__list li.referral-system-icon,
.hidden-menu__list li.tournaments-icon,
.hidden-menu__list li.bonuses-icon,
.hidden-menu__list li.news-icon {
    padding-left: 32px;
    position: relative;
}

.hidden-menu__list li.live-games-icon::before,
.hidden-menu__list li.table-games-icon::before,
.hidden-menu__list li.vr-sport-icon::before,
.hidden-menu__list li.tvbet-icon::before,
.hidden-menu__list li.favorites-icon::before,
.hidden-menu__list li.hall-of-fame-icon::before,
.hidden-menu__list li.for-partners-icon::before,
.hidden-menu__list li.referral-system-icon::before,
.hidden-menu__list li.tournaments-icon::before,
.hidden-menu__list li.bonuses-icon::before,
.hidden-menu__list li.news-icon::before {
    left: 0;
    position: absolute;
    top: 0;
}

.hidden-menu__list li.live-games-icon::before {
    content: url("/images/icons/live-games-icon.png");
}

.hidden-menu__list li.table-games-icon::before {
    content: url("/images/icons/table-games-icon.png");
}

.hidden-menu__list li.vr-sport-icon::before {
    content: url("/images/icons/vr-sport-icon.png");
}

.hidden-menu__list li.tvbet-icon::before {
    content: url("/images/icons/tvbet-icon.png");
}

.hidden-menu__list li.favorites-icon::before {
    content: url("/images/icons/favorites-icon.png");
}

.hidden-menu__list li.hall-of-fame-icon::before {
    content: url("/images/icons/hall-of-fame-icon.png");
}

.hidden-menu__list li.for-partners-icon::before {
    content: url("/images/icons/for-partners-icon.png");
}

.hidden-menu__list li.referral-system-icon::before {
    content: url("/images/icons/referral-system-icon.png");
}

.hidden-menu__list li.tournaments-icon::before {
    content: url("/images/icons/tournaments-icon.png");
}

.hidden-menu__list li.bonuses-icon::before {
    content: url("/images/icons/bonuses-icon.png");
}

.hidden-menu__list li.news-icon::before {
    content: url("/images/icons/news-icon.png");
}

.hidden-menu__list li a {
    color: #8186BD;
    font-size: 14px;
    line-height: 24px;
}

.hidden-menu__wrap-btn-site-color {
    align-items: center;
    display: flex;
}

.hidden-menu__wrap-btn-site-color .wrap-icon {
    align-items: center;
    display: flex;
    justify-content: center;
    height: 24px;
    width: 24px;
}

.hidden-menu__wrap-btn-site-color .wrap-icon img {
    max-height: 100%;
    max-width: 100%;
}

.hidden-menu__bottom {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    padding-top: 7px;
}

.hidden-menu__bottom .column {
    width: 50%;
}

.hidden-menu__bottom .column .page__theme {
    border-radius: 16px;
    background-color: #787BEF;
    height: 32px;
    cursor: pointer;
    margin-left: 8px;
    margin-right: 8px;
    position: relative;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 56px;
}

.hidden-menu__bottom .column .page__theme .circle {
    background-color: #fff;
    border-radius: 50px;
    cursor: pointer;
    height: 24px;
    font-size: 0;
    position: absolute;
    right: 4px;
    pointer-events: all;
    transform: translateY(-50%);
    top: 50%;
    width: 24px;
}

.hidden-menu__bottom .column .page__reset {
    display: none;
}

.hidden-menu__bottom .column .page__reset.active {
    display: block;
}

.hidden-menu__bottom .column .custom-select__selected {
    padding-left: 0;
}

.hidden-menu__bottom .column .custom-select__selected .current-flag {
    margin-right: 10px;
}

.hidden-menu__bottom .column .custom-select__selected .custom-select__tag-selected {
    color: #8186BD;
}

.hidden-menu__bottom .column .custom-select__body {
    border: none;
    border-radius: 8px;
    transform: translateY(-100%);
    top: 0;
}

#wheel-of-fortune{
    position: relative;
    width: clamp(600px, 100vw, 850px);
    min-height: 580px;
    overflow: hidden;
    border-radius: 1rem;
}
#wheel-of-fortune .wheel-bg{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    object-fit: cover;
}
.wheel-bg img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.drum-block{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2;
    width: 100%;
}
.drum-block img{
    position: absolute;
    margin: 0 auto;
}
.drum-block img.base{
    top: 40px;
    width: 360px;
    min-width: 36px;
    z-index: 2;
    left: 50%;
    transform: translateX(-50%);
}
.drum-block img.drum-bg{
    top: 97px;
    width: 245px;
    z-index: 3;
    left: 0;
    right: 0;
}

.drum-block img.top{
    top: 85px;
    width: 270px;
    z-index: 5;
    left: 50%;
    transform: translateX(-50%);
}

#wheel-of-fortune .bottom-block{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 3;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
#wheelCanvasTexts{
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 98px;
    width: 245px;
    z-index: 4;
}

#wheelCanvas{
    width: 100%;
    transition: transform ease-out 4s;
}
.wheel-drum > *{
    transition: transform ease-out 4s;
}
#wheelArrowCanvas{
    position: absolute;
    max-height: 160%;
    top: -20%;
}
#wheel-of-fortune .popup__content{
    padding: 0;
}
#wheel-of-fortune .wheel-bonus-got{
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    font-family: "Gotham Pro", "sans-serif";
    z-index: 5;
    display: flex;
    justify-content: center;
    text-align: center;
    /*position: absolute;*/
    /*bottom: 1rem;*/
    /*left: 0;*/
    /*right: 0;*/
    text-shadow: #C29200 0 1px 2px;
    margin: 0 auto;
    width: clamp(20rem, 95%, 45rem);
}
#wheel-of-fortune .get-bonus-form{
    width: 50%;
}
#wheel-of-fortune .get-bonus-btn{
    padding: 0;
    margin: 1rem 0 0 0;
}
#wheel-of-fortune .spin_again-bonus-btn{
    padding: 0;
    margin: 1rem 0 0 .5rem;
    width: 50%;
}
#wheel-of-fortune .bonus-win-block{
    position: relative;
    width: 100%;
}
#wheel-of-fortune .btn-wheel-spin{
    margin-bottom: .5rem;
}
#wheel-of-fortune .spin-controls{
}
.get-bonus-btn.button_green.disabled{
    background-color: #cccccc;
}
.spin_again-bonus-btn.disabled{
    background-color: #cccccc;
}
.respin-controls{
    padding: 0 1rem;
}
.now-won{
    max-width: 100vw;
}

p.wheel-of-fortune-popup__text-under-button{
    color: #FFFFFF;
}

#wheel-of-fortune .btn-wheel-spin.disabled{
    background-color: #cccccc;
}


@media screen and (max-width: 340px) {
    .now-won{
        font-size: .875rem;
    }
    .now-won button{
        font-size: .75rem;
    }
}

.fdep-popup{
    position: relative;
}
.fdep-popup .title{
    font-size: 1rem;
    padding: .5rem 0;
}
.fdep-popup .title-gold{
    font-family: "Gotham Pro", "sans-serif";
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.6rem;
    letter-spacing: 0;
    text-align: center;
    color: #FFC660;
}

.fdep-popup .fs-chip{
    display: flex;
    flex-flow: column;
    background: linear-gradient(0deg, #1C1F3E, #1C1F3E),
    linear-gradient(0deg, #2C2B64, #2C2B64);
    border: 2px solid #2C2B64;
    padding: .75rem .5rem .5rem .5rem;
    border-radius: 1rem;
    align-items: center;
    justify-content: space-evenly;
    margin: 0 .2rem;
    flex-grow: 1;
}
body.light .fdep-popup .fs-chip{
    background: none;
    border: 2px solid #E9E9E9;
}
.fdep-popup .fs-chip .gold-text{
    color: #FFC660;
    font-size: 1.2rem;
    line-height: 1.2rem;
    font-weight: 600;
}
.fdep-popup .fs-chip .fs-cond{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .725rem;
    font-weight: 400;
    letter-spacing: 0;
    text-align: center;
    color: #8186BD;
    padding-top: .5rem;
}
.fdep-popup .fs-chip.max{
    border: 2px solid #FFC660;
    position: relative;
}
body.light .fdep-popup .fs-chip.max{
    border: 2px solid #FFC660;
    position: relative;
}
.fdep-popup .fs-chip .top-text{
    position: absolute;
    top: -.375rem;
    color: #000;
    background: #FFC660;
    border-radius: 1rem;
    width: 90%;
    font-size: .725rem;
    font-weight: 500;
    line-height: .725rem;
    text-align: center;
    margin: 0 1rem;
    display: none;
    cursor: pointer;
}
.fdep-popup .fs-chip.max .top-text{
    display: flex;
}
.fdep-popup .congratz{
    background: linear-gradient(0deg, #3D3F3A, #3D3F3A),
    linear-gradient(0deg, #C5A23A, #C5A23A);
    color: #FFFFFF;
    text-align: center;
    padding: 0.375rem;
    border-radius: 1rem;
    border: 0.5px solid #C5A23A;
    font-family: "Gotham Pro", "sans-serif";
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1rem;
    letter-spacing: 0;
}
body.light .fdep-popup .congratz{
    background: none;
    color: #262756;
}

.fdep-popup .description-wrapper{
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: scroll;
    z-index: 10;
    padding: .5rem;
    background: #1C1F3E;
    display: none;
    max-width: 25rem;
}
.fdep-popup.details .description-wrapper{
    display: flex;
}

.fdep-popup .description-wrapper .descr{
    margin: 2rem 0;
    width: 100%;
    height: calc(100% - 4rem);
    overflow: scroll;
    font-family: "Gotham Pro", "sans-serif";
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0;
    text-align: left;
    color: #8186BD;
}

.fdep-popup .fdep-img{
    height: 100%;
}
.fdep-popup .inner-content{
    max-width: 25rem;
}

.popup-dialog .link{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.4rem;
    text-align: center;
    color: #8186BD;
    cursor: pointer;
}

.cashback-shoot{
    background-image: url("/img/cashback/bg_w.png");
    background-position-x: left;
    background-position-y: bottom;
    background-repeat: no-repeat;
    border-radius: 1rem;
}

.cashback-shoot .bg-image{
    width: 900px;
    height: 600px;
}
.cashback-shoot .info-flag{
    background-image: url("/img/cashback/flag.png");
    position: absolute;
    bottom: 180px;
    left: 50px;
    width: 200px;
    height: 350px;
    background-repeat: no-repeat;
    background-size: cover;
}
.cashback-shoot .info-flag .cashback-info{
    position: absolute;
    right: 10px;
    top: 60px;
    width: 120px;
    white-space: nowrap;
    text-align: center;
}
.info-flag .cashback-info p{
    font-weight: 700;
    font-style: italic;
    font-size: 1.4rem;
    line-height: 2.6rem;
    letter-spacing: 1px;
    text-align: center;
}
.info-flag .cashback-info .info-icon{
    right: 0;
    top: initial;
    bottom: -10px;
    background-image: url("/img/icons/info-icon2.svg");
    width: 25px;
    height: 25px;
    transform: scale(.8);
}
.cashback-shoot .title{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(180deg, #181A32FF, #181A32F5 90%, #181A3200);
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    height: 5rem;
}
.cashback-shoot .health-bar{
    position: absolute;
    right: 60px;
    top: 20px;
    z-index: 2;
}
.cashback-shoot .health-bar > img{
    display: none;
}
.cashback-shoot .health-bar[data-state="0"] > img:nth-child(1) {
    display: block;
}
.cashback-shoot .health-bar[data-state="1"] > img:nth-child(2) {
    display: block;
}
.cashback-shoot .health-bar[data-state="2"] > img:nth-child(3) {
    display: block;
}

.cashback-shoot .animation-scene{
    position: absolute;
    bottom: 0;
    width: 550px;
    height: 300px;
    left: 0;
    right: 0;
}
.cashback-shoot .animation-scene #cannon{
    position: absolute;
    left: 0;
    z-index: 10;
    transform: scale(.85) translateY(20px);
}
.cashback-shoot .animation-scene .ball{
    position: absolute;
    left: 130px;
    z-index: 5;
    bottom: 70px;
}
.cashback-shoot .animation-scene .barrel{
    position: absolute;
    left: 250px;
    bottom: 120px;
    z-index: 2;
    transform: scale(.7);
}

.cashback-shoot .animation-scene .cannonball{
    position: absolute;
    z-index: 21;
    bottom: 20px;
}
.cashback-shoot .animation-scene .cannonball img{
    height: 100px;
    width: 100px;
}
.cashback-shoot .cannonball .ball-amount{
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    color: #FFF;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .875rem;
    font-weight: 600;
    line-height: .875rem;
    background: url("/img/cashback/counter.svg");
    background-size: cover;
}

.cashback-shoot .animation-scene .golden_ball{
    left: 350px;
}
.cashback-shoot .animation-scene .black_ball{
    left: 450px;
}

.cashback-shoot .win-text{
    font-family: "Gotham Pro", "sans-serif";
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3rem;
    top: 7rem;
    left: 0;
    right: 0;
    font-size: 1.8rem;
    line-height: 2rem;
    font-weight: 700;
    color: #e2d712;
    text-shadow: #000000 0 0 4px;
    background: radial-gradient(#FFFFFFD0 20%, #C2920000 80%);
    transition: all .5s;
    transform: scale(1);
    pointer-events: none;
    z-index: 35;
}

.win-text.invisible{
    font-size: 1rem;
    transform: scale(.4);
    transition: none;
}

.cashback-shoot .win-item{
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 4rem;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 30;
    backdrop-filter: blur(3px);
}
.cashback-shoot .win-item .shine-item .shine-img{
    bottom: initial;
    left: initial;
    right: -25px;
    top: -25px;
}
.win-item .slc__popup-icon{
    transition: all .5s;
    transform: scale(1);
}
.win-item.invisible .slc__popup-icon{
    transform: scale(.4);
    pointer-events: none;
    transition: none;
}


.cashback-shoot .bottom-controls{
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    right: 0;
    bottom: 4rem;
    z-index: 40;
    transition: all .5s;
}

.cashback-shoot .bottom-controls.invisible{
    transform: scale(0);
    transition: none;
}

.popup-img-wrapper{
    max-width: 6rem;
    max-height: 6rem;
}


.text-implication{
    font-family: "Gotham Pro", "sans-serif";
    font-style: italic;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.6rem;
    color: #FFF;
    text-shadow: #000 0 0 2px;
}

.promo__items{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(570px, 1fr));
    grid-gap: 1rem;
}

.promo__item{
    border-radius: 1rem;
    max-width: 570px;
    height: 360px;
    display: flex;
    position: relative;
    overflow: hidden;
}

.promo__item .promo-controls{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 96px;
    background: #050508BF;
    display: flex;
    padding: 0 1rem;
    justify-content: space-between;
}
.promo__item .promo-slogan{
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.25rem;
    color: #FFFFFF;
}

.promo__item .promo-title{
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 2.5rem;
    color: #2281F6;
}
.promo__item .promo-time{
    position: absolute;
    right: 1rem;
    top: 1rem;
    border-radius: 12px;
    background: #00000080;
    display: flex;
    align-items: center;
    padding: 5px;
    color: #F19A56;
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.25rem;
    z-index: 5;
}
.promo__item .promo-time img{
    margin-right: 5px;
}

.promo-page .header-banner{
    width: 100%;
    display: flex;
    border-radius: 1rem;
    overflow: hidden;
    position: relative;
}
.promo-page .back-img{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: blur(100px) brightness(.5);
    z-index: 2;
    overflow: hidden;
}

.promo-page .header-banner .promo__item{
    width: 100%;
}
.promo-page .header-banner  .promo__item .promo-info{
    position: absolute;
    left: 3rem;
    display: flex;
    flex-flow: column;
    height: 100%;
    justify-content: space-around;
    padding: 4rem 0;
    z-index: 5;
}
.promo-page .header-banner  .promo__item .promo-time{
    position: relative;
    right: initial;
    top: initial;
    width: max-content;
}
.promo-page .header-banner  .promo__item .button{
    width: max-content;
}

.promo-page .header-banner .promo-img{
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    object-fit: contain;
    z-index: 3;
    border-radius: 1rem;
    height: 100%;
}
.promo-page .description-body h2{
    font-size: 32px;
    font-weight: 700;
    line-height: 44px;
    margin: .5rem 0;
}
.promo-page .description-body p{
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    text-align: left;
    color: #7A82B4;
    margin: .3rem 0;
}
.promo-page .description-body p.smaller{
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    text-align: left;
    margin: .3rem 0;
    color: #7A82B4;
}
.promo-page .other-promos{
    display: flex;
    justify-content: space-between;
}
.other-promos-head{
    font-size: 21px;
    font-weight: 700;
    line-height: 24px;
    height: 2rem;
}

.other-promos_scrollable {
    display: grid;
    grid-auto-flow: column dense;
    grid-template-columns: 50%;
    grid-template-rows: auto;
    grid-auto-columns: 50%;
    margin-top: 2rem;
    width: 100%;
    overflow-x: hidden;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
}

.other-promos_scrollable .slider__item{
    scroll-snap-align: start;
    display: flex;
    justify-content: center;
}

.promo-page table {
    border-spacing: 0;
    width: 100%;
    border: 1px solid #3c3b89;
}
.promo-page table td {
    padding: 0.5rem 1rem;
    color: #8888af;
    border-bottom: 1px solid #3c3b89;

}
.promo-page table tr:last-child td {
    border-bottom: none;
}
.promo-page table th {
    color: #fff;
    text-align: left;
    background-color: #3c3b89;
    border-bottom: 2px solid #3c3b89;
    padding: 0.5rem 1rem;
}

.header-modal{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    background-color: #00000040;
    /*-webkit-backdrop-filter: blur(5px);*/
    /*backdrop-filter: blur(5px);*/
    z-index: 700;
    display: none;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    animation: opacityAnim;
    animation-duration: .2s;
    /*padding-top: 4rem;*/
}
.header-modal.shown{
    display: flex;
}

.header-modal .content{
    /*padding: 1rem .5rem;*/
    width: 500px;
    opacity: 0;
    animation: fromBottomAnim;
    animation-duration: .2s;
    max-height: calc(100% - 5rem);
    max-height: calc(100dvh - 5rem);
    margin-bottom: 1rem;
    overflow: auto;
    margin-left: calc((100% - 1230px) / 2 + 60px);
    margin-top: 60px;
}
.header-modal.shown .content{
    opacity: 1;
}
.header-modal .pad{
    flex-direction: column;
    padding: 1rem;
    background-color: #181A32;
    border-radius: 0.5rem;
    box-shadow: #0a0a17 0 0 2px;
}

body.light .header-modal .pad{
    background-color: #fff;
}

.header-modal__title{
    color: #8C90CA;
    font-size: .875rem;
    line-height: 1.2rem;
    display: flex;
    justify-content: flex-start;
    font-family: "Gotham Pro", "sans-serif";
    font-weight: 600;
}

.header-modal__title-small{
    color: #8C90CA;
    font-size: .875rem;
    line-height: 1rem;
    display: flex;
    justify-content: flex-start;
    font-family: "Gotham Pro", "sans-serif";
    font-weight: 600;
}

body.light .header-modal__title{
    color: #262756;
}

.popular-providers{
    display: grid;
    grid-template-columns: 1fr 1fr;
    font-weight: 600;
}
.header-modals__games-nav{
    display: grid;
    grid-template-columns: repeat(5, calc(20% - 4px));
    grid-auto-rows: 4.75rem;
    justify-content: space-between;
    align-items: center;
    grid-gap: 1rem 2px;
}
.header-modals__games-nav .menu__item{
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    width: 100%;
    /*width: 4rem;*/
    /*height: 5.5rem;*/
    padding: 0;
}
.header-modals__games-nav .menu__item img{
    background-color: #2C2B64;
    border-radius: 1rem;
    padding: .8rem;
    width: 3.5rem;
    height: 3.5rem;
}
.header-modals__games-nav .menu__item-text{
    font-family: "Gotham Pro", "sans-serif";
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: flex-start;
    padding: 0;
    margin: 0;
    color: #8C90CA;
    font-weight: 500;
    font-size: .75rem;
    line-height: 1rem;
    width: 95%;
    text-align: center;
    white-space: nowrap;
}
.header-modals__games-nav .menu__item.new-games img{
    background: linear-gradient(90deg, #0B088E 0%, #26294F 100%);
}
.header-modals__games-nav .menu__item.bonus-games img{
    background: linear-gradient(90deg, rgba(139, 18, 20, 0.66) -34.82%, #1D203E 122.32%);
}
.header-modals__games-nav .menu__item.tournament-games img{
    background: linear-gradient(90deg, #3DE500 -33.93%, #212445 110.71%);
}

.search-menu{
    height: 100%;
}

.search-menu .content{
    height: 100%;
}

.search-menu .content .pad{
    height: 100%;
    display: flex;
    flex-flow: column;
}

.search-menu .games{
    flex-grow: 1;
    overflow-y: auto;
}
.search-menu .game{
    display: flex;
    margin: 0 .5rem 1rem 0;
    flex-shrink: 0;
    background: none;
    height: 3.7rem;
}
.search-menu .game:before{
    padding: 0;
    width: 0;
}
.search-menu .game img{
    padding: 0;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: .5rem;
    object-fit: cover;
}
.search-menu .game .name{
    display: flex;
    flex-flow: column;
    flex-grow: 1;
    justify-content: center;
    align-items: flex-start;
    padding-left: .5rem;
}
.search-menu .game .name :first-child{
    color: #FFF;
    font-size: .75rem;
    line-height: 1rem;
}
body.light .search-menu .game .name :first-child{
    color: #000;
}
.search-menu .game .provider{
    color: #8C90CA;
    font-size: .75rem;
    line-height: .875rem;
    display: flex;
    align-items: flex-end;
}
.search-menu .game .provider img{
    height: 1rem;
    max-width: 3rem;
    object-fit: contain;
}

.search-menu .game .play-button{
    height: 2.5rem;
    width: 4rem;
    color: #000;
    border-radius: .5rem;
    background-color: #A7DA94;
    margin: 0 .5rem;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    cursor: pointer;
}

.search-menu .games-count{
    display: flex;
    font-size: .875rem;
    color: #8C90CA;
    font-weight: 600;
    margin: 1rem 0;
}
.search-menu .game__image{
    position: static;
}

.main-menu.header-modal .content{
    max-width: 30rem;
}

@media (max-height: 700px) {
    .main-menu__support-menu{
        display: none;
    }
}

@keyframes opacityAnim {
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}

@keyframes fromBottomAnim {
    from{
        opacity: 0.2;
        margin-bottom: -50%;
    }
    to{
        opacity: 1;
        margin-bottom: 0;
    }
}

.header-modal .popular-providers .menu__item img{
    width: 24px;
    height: 24px;
}
.header-modal .popular-providers .menu__item-text{
    color: #8186BD;
    font-size: 14px;
    line-height: 24px;
}
.header-modals__games-nav .menu__item .has-new{
    display: none;
    position: absolute;
    right: 8px;
    top: 0;
    left: initial;
    background-color: #f29b49;
    border-radius: 50%;
    color: #FFFFFF;
    width: 1rem;
    height: 1rem;
    justify-content: center;
    align-items: center;
    font-size: .875rem;
    line-height: 1rem;
    font-weight: 700;
    font-family: "Gotham Pro", "sans-serif";
}
.header-modals__games-nav .menu__item.notify .has-new{
    display: flex;
}

.login-form {
    display: flex;
    width: 23rem;
    max-width: 100%;
    /*min-height: 35.25rem;*/
    flex-direction: column;
    padding: 2rem;
    background-color: #181A32;
    border-top-right-radius: 1rem;
    border-bottom-right-radius: 1rem;
    box-shadow: 0 0 1rem #00000040;
    position: relative;
    color: #8C90CA;
    font-weight: 500;
    font-size: 0.75rem;
}
body.light .login-form{
    background-color: #FFFFFF;
}

.login-form .spinner {
    border-radius: 1rem;
    box-shadow: 0 0 1rem #00000040;
    /*position: relative;*/
}
.login-form .spinner {
    border-radius: 1rem;
}

.login-form__hello {
    font-family: 'Gotham Pro', sans-serif;
    font-size: 1rem;
    color: #C1C1D4;
}
.login-form__hint {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #dfe1ff;
    border-radius: 1rem 1rem 0 0;
    font-weight: 700;
    color: #200e32;
}
.login-form__title {
    color: #FFFFFF;
    font-family: 'Gotham Pro', sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    margin-top: 0.5rem;
    margin-bottom: 1.5rem;
    text-align: center;
}
body.light .login-form__title{
    color: #000;
}
.login-form__title-ext {
    color: #FFF;
    font-family: 'Gotham Pro', sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    margin-top: 0.5rem;
    margin-bottom: 1.5rem;
    text-align: center;
}
body.light .login-form__title-ext{
    color: #000;
}
.login-form__hint + .login-form__title {
    padding-top: 4rem;
}

.login-form__pass-field {
    margin-top: 2rem;
}


.login-form, .input__eye-icon .input__eye-icon_visible{
    color: #545884;
}
.login-form .login-form__phone .input__field_modal{
    padding-left: 8rem;
    width: 100%;
}
.login-form .phone-select{
    position: absolute;
    left: .4rem;
    background-color: #2B2F5B;
    border-radius: .8rem;
    border: none;
    height: 2.1rem;
    bottom: .2rem;
    width: 7rem;
    display: flex;
}
body.light .login-form .phone-select{
    background-color: #FFF;
}
.login-form .phone-select__value{
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: center;
    font-weight: 500;
    color: #ffffff;
}
body.light .login-form .phone-select__value{
    color: #1C1F3E;
}
.login-form .img-drop-down{
    width: 100%;
    border-radius: 0.925rem;
    background-color: #1C1F3E;
    border: #2C2B64 1px solid;
    color: #8C90CA;
    padding: .5rem 2rem .5rem 1rem;
    font-size: .925rem;
    font-weight: 500;
}
body.light .login-form .img-drop-down{
    background-color: #FFF;
}
.login-form .img-drop-down__value,.img-drop-down__current-value{
    background-color: #1C1F3E;
    color: #8C90CA;
    font-weight: 500;
    font-size: 1rem;
    width: 100%;
}
.login-form .img-drop-down__value:hover{
    background-color: #2C2B64;
}
.login-form .terms{
    font-family: 'Gotham Pro', sans-serif;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1rem;
    /*letter-spacing: 0em;*/
    color: #8C90CA;
}

.login-form .terms a{
    text-decoration: none;
    color: #8C90CA;
}
.login-form .terms a:hover{
    text-decoration: none;
    color: #8C90CA;

}

.login-form hr{
    color: #545884;
    height: 1px;
}

.login-form__create-acc {
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    color: #A7DA94;
    text-decoration: none;
    font-weight: 700;
}


.login-form__submit-button {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3rem;
    border-radius: 0.5rem;
    border: none;
    background-color: var(--color-green);
    color: #000;
    font-size: 0.875rem;
    font-family: 'Gotham Pro', sans-serif;
    cursor: pointer;
    outline: none;
    padding: 0 2rem;
}

.login-form__links {
    display: flex;
    font-size: 0.75rem;
    justify-content: center;
}

.login-form__links-ext {
    display: flex;
    flex-flow: column;
    font-size: 0.75rem;
    justify-content: flex-end;
    margin-top: auto;
    flex-grow: 2;
}


.login-form__no-acc-msg {
    color: #8283C0;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
}

/*.login-form .spinner {*/
    /*background-color: #ffffffdd;*/
/*}*/


.login-form__tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 2rem;
    background-color: #1C1F3E;
    border-radius: 0.925rem;
    padding: 4px;
    border: none;
}

.login-form__tabs .tabs__tab {
    color: #8C90CA;
    font-weight: 500;
    justify-content: center;
    height: 2.5rem;
    font-size: 0.875rem;
    margin-bottom: -2px;
    border-radius: 0.925rem;
    border: none;
}
.login-form__tabs .tabs__tab_active {
    background-color: #2B2F5B;
    color: #ffffff;
}
.login-form__forgot-pass {
    /*margin: 1.5rem auto;*/
    font-size: 0.75rem;
    text-align: center;
    text-decoration: none;
    color: var(--color-green);
}
.login-form__or-with-wrap {
    display: flex;
    margin: 1rem;
    height: 1rem;
    border-bottom: 1px solid #c0c1df;
}
.login-form__or-with {
    background-color: #fff;
    padding: 0.5rem;
    margin: -0.15rem auto 0 auto;
    font-size: 0.875rem;
    color: #8283C0;
    z-index: 1;
    height: 2rem;
}

.login-form__social-links {
    display: flex;
    justify-content: center;
    margin-top: 0.5rem;
}

.login-form__social-link + .login-form__social-link {
    margin-left: 1rem;
}

@media(max-width: 600px) {
    .login-form__hint {
        font-size: 0.875rem;
    }
}

.login-form .validation-errors .error{
    margin-left: 1rem;
    color: #c60109;
    margin-top: .5rem;
}

.register-form__wrap {
    display: flex;
}
.register-form__wrap-ext {
    display: flex;
    border-radius: 1rem;
}
.register-form {
    display: flex;
    width: 364px;
    max-width: 100%;
    min-height: 35.25rem;
    flex-direction: column;
    padding: 2rem;
    background-color: #181A32;
    border-top-right-radius: 1rem;
    border-bottom-right-radius: 1rem;
    box-shadow: 0 0 1rem #00000040;
    position: relative;
    color: #8C90CA;
    font-weight: 500;
}


body.light .register-form {
    background-color: #FFF;
}

.register-form__title {
    color: #FFFFFF;
    font-family: 'Gotham Pro', sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    margin-top: 0.5rem;
    margin-bottom: 1.2rem;
    text-align: center;
}

body.light .register-form__title {
    color: #000;
}

.register-form__tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 28px;
    background-color: #1C1F3E;
    padding: 4px;
    border: none;
    border-radius: 12px;
    gap: 2px;
    height: 44px;
}

.register-form__tabs .tabs__tab {
    color: #8C90CA;
    font-weight: 500;
    justify-content: center;
    height: 2.5rem;
    font-size: 0.875rem;
    margin-bottom: -2px;
    border-radius: 0.925rem;
    border: none;
}
.register-form__tabs .tabs__tab_active {
    background-color: #2B2F5B;
    color: #ffffff;
    height: 36px;
    border-radius: 8px;
}
.register-form .input__field_modal{
    border-radius: 0.925rem;
    background-color: #1C1F3E;
    border: 1px solid #2C2B64;
    color: #8C90CA;
    padding: .5rem 2rem .5rem 1rem;
    font-size: .925rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0;
    text-align: left;

}
.register-form .input__label_modal{
    font-size: .8rem;
    line-height: 1rem;
    color: #8C90CA;
    margin-bottom: .2rem;
    font-weight: 600;
}
.register-form .input__eye-icon{
    height: 1.5rem;
}
.register-form .input__eye-icon .input__eye-icon_visible{
    color: #545884;
}
.register-form .reg-form__phone .input__field_modal{
    padding-left: 8rem;
    width: 100%;
}
.register-form .phone-select{
    position: absolute;
    left: 6px;
    border: none;
    height: 36px;
    top: 5px;
    width: 7rem;
    display: flex;
    border-radius: 8px;
    background: #2B2F5B;
    z-index: 7;
}
body.light .register-form .phone-select{
    background-color: #FFF;
}
.login-form__links {
    display: flex;
    font-size: 0.75rem;
    justify-content: center;
    gap: 4px !important;
}
.text_Underline{
    text-decoration: underline !important;
}
.text-Sm-Reg-Mod{
    color: #8C90CA;
    text-align: center !important;
    font-family: "Gotham Pro" !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 16px !important; /* 133.333% */
}
.grn-Txt{
    color: #A7DA94 !important;
}
.register-form .phone-select__value{
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: center;
    font-weight: 500;
    color: #ffffff;
    gap: 5px;
}
body.light .register-form .phone-select__value{
    color: #1C1F3E;
}
.register-form .img-drop-down{
    width: 100%;
    border-radius: 0.925rem;
    background-color: #1C1F3E;
    border:1px solid #2C2B64;
    color: #8C90CA;
    padding: .5rem 2rem .5rem 1rem;
    font-size: .925rem;
    font-weight: 500;
}
body.light .register-form .img-drop-down {
    background-color: #FFF;
}
.register-form .img-drop-down__current-value{
    background-color: #1C1F3E;
    color: #8C90CA;
    font-weight: 500;
    font-size: 1rem;
    width: 100%;
}
.register-form .img-drop-down__value{
    background-color: #1C1F3E;
    color: #8C90CA;
    font-weight: 500;
    font-size: 1rem;
    width: 100%;
}

body.light .login-form .img-drop-down{
    background-color: #FFF;
}

body.light .register-form .img-drop-down__value {
    background-color: #FFF;
}
body.light .register-form .img-drop-down__current-value {
    background-color: #FFF;
}

.register-form .img-drop-down__value:hover{
    background-color: #2C2B64;
}
.register-form .terms{
    font-family: 'Gotham Pro', sans-serif;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1rem;
    /*letter-spacing: 0em;*/
    color: #8C90CA;
}

.register-form .terms a{
    text-decoration: none;
    color: #8C90CA;
}
.register-form .terms a:hover{
    text-decoration: none;
    color: #8C90CA;

}

.register-form hr{
    border: none;
    height: 1px;
    background: #545884;
}

.register-form__create-acc {
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    color: #A7DA94;
    text-decoration: none;
    font-weight: 700;
}

.register-form__banner-wrap {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    /*height: 100%;*/
    position: relative;
    block-size: auto;
}
.register-form__banner-wrap-ext {
    display: flex;
    flex-flow: column;
    width: 20rem;
    height: 100%;
    position: relative;
    padding: 1rem;
    min-height: 32rem;
    /*margin-right: -4rem;*/
}
.register-form__banner {
    /*height: 100%;*/
    position: relative;
    /*object-fit: contain;*/
    border-bottom-left-radius: 1rem;
    border-top-left-radius: 1rem;
}
.register-form__banner-t1 {
    position: absolute;
    left: -2rem;
    top: 0;
}
.register-form__banner-t2 {
    position: absolute;
    bottom: -2rem;
    right: 4rem;
}

.register-form__submit-button {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3rem;
    border-radius: 0.5rem;
    border: none;
    background-color: var(--color-green);
    color: #000;
    font-size: 0.875rem;
    font-family: 'Gotham Pro', sans-serif;
    cursor: pointer;
    outline: none;
    padding: 0 2rem;
}
.register-form__submit-button:disabled {
    pointer-events: none;
    opacity: 0.5;
}

.promo-switcher{
    display: flex;
    min-height: 3.2rem;
    cursor: pointer;
}
.promo-switcher.shown{
    align-items: center;
    display: block;
}
/*.promo-switcher::after{*/
/*    content: "+";*/
/*    margin-left: 0.3rem;*/
/*    margin-top: -3px;*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    justify-items: flex-start;*/
/*    border-radius: 50%;*/
/*    height: 1rem;*/
/*    width: 1rem;*/
/*    line-height: 1.2rem;*/
/*    font-size: 1rem;*/
/*    background-color: #0B0D31;*/
/*    color: #FFFFFF;*/
/*    font-weight: 600;*/
/*    cursor: pointer;*/
/*}*/
.promo-switcher.shown::after{
    display: none;
}
.promo-switcher .input__wrap_modal{
    display: none;
}
.promo-switcher.shown .input__wrap_modal{
    display: flex;
}

.hide-promo{
    position: absolute;
    right: 0.75rem;
    bottom: 0.5rem;
    line-height: 1.1rem;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    color: #d0d1e7;
}




.reg-tabs {
    display: flex;
    background: #1C1F3E;
    border-radius: 10px;
    padding: 6px;
    gap: 4px;
}

.reg-tabs__btn {
    flex: 1;
    padding: 12px 0;
    border: none;
    background: transparent;
    color: rgba(255,255,255,0.45);
    font-size: 14px;
    font-weight: 500;
    border-radius: 8px;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.2s, color 0.2s;
}

.reg-tabs__btn--active {
    background: #2B2F5B;
    color: #fff;
}
.input__field-wrap{
    display: flex;
    width: 300px;
    padding: 3px 6px;
    align-items: center;
    gap: 8px;
    border-radius: 12px;
    border: 1px solid #2C2B64;
    background: #1C1F3E;
}
.input__error:empty {
    display: none !important;
}
.input-captcha-field{
    border-radius: 8.41px !important;
    background: #2B2F5B !important;
    height: 36px !important;
    width: 169px !important;
    margin-left: 0 !important;
}
#g-recaptcha img{
    display: flex !important;
    width: 109px !important;
    height: 36px !important;
    padding: 6px 16px !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-radius: 8px !important;
    background: #2B2F5B !important;
}
.border-none{
    border: none !important;
}
.img-drop-down-register-modal{
    padding: 9px 10px !important;
}
#g-recaptcha{
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}
.mt-0{
    margin-top: 0 !important;
}
.mb-0{
    margin-bottom: 0 !important;
}
.phone-select__arrow {
    margin-left: auto;
    font-size: 10px;
    transition: transform 0.25s ease;
    display: inline-block;
}

.phone-select.shown .phone-select__arrow {
    transform: rotate(180deg);
}
.reg-form__currency .shown .phone-select__arrow {
    transform: rotate(180deg);
}
.reg-form__currency .shown {
    border-radius: 14px 14px 0 0;
    border: none;
}
.img-drop-down__values{
    border-radius: 0 0 19px 19px;
}
.img-drop-down__values > :last-child{
    border-radius: 0 0 14px 14px;
}
.phone-select__dropdown{
    border-radius: 8px;
    background: #2B2F5B;
    padding: 5px 6px;
}
.img-drop-down__values{
    background: #181A32;
}

.text-For-Inputs{
    color: #8C90CA !important;
    font-family: "Gotham Pro" !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    opacity: 0.5 !important;
}
.text-For-Currency{
    color: #FFF !important;
    font-family: "Gotham Pro" !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 24px !important; /* 171.429% */
}
.icon-For-Input-Pass{
    top: 12px;
    position: absolute;
    right: 5px;
}


#forgot-pass-form {
    display: flex;
    flex-direction: column;
    background-color: #181A32;
    padding: 2rem;
    border-radius: 1rem;
    min-width: 25rem;
}
#forgot-pass-form .spinner {
    background-color: #ffffffbf;
    border-radius: 1rem;
}

.new-pass-form {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: var(--color-overlay-background);
    padding: 2rem;
    border-radius: 1rem;
    width: 27rem;
}
.new-pass-form .spinner {
    background-color: #ffffffbf;
    border-radius: 1rem;
}

.cabinet {
    display: flex;
    margin-top: 2rem;
}

.cabinet__link {
    color: #2281F6;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    cursor: pointer;
    border-bottom: 1px solid transparent;
}
.cabinet__link:hover {
    border-bottom: 1px solid #3e69fa63;
}
.cabinet__link::after {
    content: '';
    display: inline-block;
    width: 0.25rem;
    height: 0.25rem;
    border-top: 1px solid #2281F6;
    border-right: 1px solid #2281F6;
    transform: rotate(45deg);
    margin-left: 0.15rem;
    margin-bottom: 0.05rem;
}

.cabinet__content-wrap {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    margin-left: 2rem;
}

.cabinet__content {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.cabinet__content-title {
    font-size: 1.3125rem;
    color: #fff;
    font-weight: 700;
    font-family: "Gotham Pro", sans-serif;
    margin: 3rem 0 1rem 0;
}

body.light .cabinet__content-title {
    color: #2c2b63;
    margin: 1rem 0 1rem 0;
}

.cabinet__pad {
    display: flex;
    flex-direction: column;
    padding: 1.5rem;
    background-color: #272660;
    border-radius: 1.25rem;
}
body.light .cabinet__pad {
    background-color: #ffffff;
    box-shadow: 0 0 1rem #0000000d;
}
.cabinet__pad .spinner {
    border-radius: 1rem;
}
.cabinet__pad .message {
    color: #fff;
}
.cabinet__pad-head {
    display: flex;
    margin-bottom: 2rem;
}

.cabinet__pad-title {
    font-family: 'Gotham Pro', sans-serif;
    font-size: 1rem;
    color: #fff;
    font-weight: 700;
}
body.light .cabinet__pad-title {
    color: #2c2b63;
}
.custom-table__money {
    font-weight: 700;
}

.cabinet__pad-status_fail,
.cabinet__pad-status_warn,
.cabinet__pad-status_success {
    display: flex;
    align-items: center;
    font-size: 0.75rem;
}

.cabinet__pad-status_success {
    color: var(--color-green);
}
.cabinet__pad-status_warn::before,
.cabinet__pad-status_fail::before,
.cabinet__pad-status_success::before {
    content: '';
    display: inline-block;
    height: 0.8rem;
    width: 0.8rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 0.25rem;
}
.cabinet__pad-status_fail {
    color: var(--color-red);
}
.cabinet__pad-status_warn {
    color: var(--color-orange);
}
.cabinet__pad-status_success::before {
    background-image: url("/img/ui/icons/check-green.svg");
}
.cabinet__pad-status_fail::before {
    background-image: url("/img/ui/icons/stop-red.svg");
}

.cabinet__pad-status_warn::before {
    background-image: url("/img/ui/icons/check-green.svg");
    filter: hue-rotate(303deg) saturate(1.5);
}

.cabinet__pad p{
    color: #8186BD;
    font-family: "Gotham Pro", "sans-serif";
    /*font-size: 13px;*/
    font-weight: 400;
    line-height: 20px;
    text-align: left;
}

.cabinet__select{
    background: #1C1F3E;
    color: #FFF;
    height: 2.625rem;
    border-radius: .5rem;
    border: none;
    outline: none;
    padding: .5rem;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
}

.self-lock-modal{
    width: 35rem;
    text-align: center;
    background: #171B31;
    border-radius: 1rem;
    padding: 2rem;
}

.self-lock-modal div{
    text-align: center;
}
.self-lock-modal p{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .75rem;
    font-weight: 400;
    line-height: 16px;
    text-align: center;
    color: #8186BD;
}

.self-lock-modal > img{
    width: 96px;
    height: 96px;
}

.red-title{
    color: #C40E1B;
    font-size: 1.2rem;
    line-height: 1.4rem;
    font-weight: 500;
}

.self-lock-modal .locked_to{
    color: #C40E1B;
    font-weight: 500;
}

.red-title > img {
    width: 40px;
    height: 40px;
}

.danger-pad{
    border: 1px solid #C40E1B;
    border-radius: 1rem;
    color: #C40E1B;
    background: #00000029;
    padding: 1rem;
    font-weight: 500;
    font-size: .875rem;
    line-height: 1rem;
}

.self-lock-modal p{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.2rem;
    text-align: left;
}

.cabinet__menu-wrap {
    flex-shrink: 0;
    width: 15rem;
    background-color: #272660;
    border-radius: 1.25rem;
    margin-bottom: auto;
}

body.light .cabinet__menu-wrap {
    background-color: #ffffff;
    box-shadow: 0 0 1rem #0000000d;
}

.cabinet__menu-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem 1rem 2rem 1rem;
    border-radius: 1.25rem 1.25rem 0 0;
}

.cabinet__menu-avatar {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3.625rem;
    width: 3.625rem;
    border-radius: 3rem;
    overflow: hidden;
}
.cabinet__menu-avatar-image {
    height: 100%;
    width: auto;
}

.cabinet__menu-links {
    display: flex;
    flex-direction: column;
    padding: 1rem;
    border-radius: 0 0 1.25rem 1.25rem;
}

.cabinet__menu-link {
    display: flex;
    align-items: center;
    height: 2.5rem;
    padding: 0 1rem;
    color: #8283C0;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    text-decoration: none;
    border-radius: 0.5rem;
    transition: 150ms;
}
.cabinet__menu-link.active{
    background: rgba(22, 21, 58, 0.19);
    color: #FFFFFF;
}
.cabinet__menu-link:hover {
    background: rgba(22, 21, 58, 0.19);
    color: #FFFFFF;
}
.cabinet__menu-link:hover img{
    filter: grayscale(100) contrast(100);
}
.cabinet__menu-link.active img{
    filter: grayscale(100) contrast(100);
}

body.light .cabinet__menu-link.active{
    background: rgba(22, 21, 58, 0.19);
    color: #000000;
}
body.light .cabinet__menu-link:hover {
    background: rgba(22, 21, 58, 0.19);
    color: #000000;
}
body.light .cabinet__menu-link:hover img{
    filter: grayscale(100);
}
body.light .cabinet__menu-link.active img{
    filter: grayscale(100);
}

body.light .cabinet__menu-link:hover {
    background: rgb(243, 243, 252);
}
.cabinet__menu-link + .cabinet__menu-link {
    margin-top: 0.25rem;
}
.cabinet__menu-icon-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.25rem;
    margin-right: 0.75rem;
}
.cabinet__menu-icon {
    max-width: 100%;
    max-height: 100%;
}

.cabinet__logout-button {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.5rem;
    border-radius: 2.5rem;
    border: 1px solid #8283C0;
    margin-top: 1rem;
    color: #8283C0;
    font-size: 0.75rem;
    text-decoration: none;
}
.cabinet__logout-icon {
    margin-left: 0.25rem;
}


.cabinet__menu-hello {
    font-family: 'Gotham Pro', sans-serif;
    color: #8283C0;
    font-size: 0.75rem;
    margin-top: 1rem;
}

.cabinet__menu-hello {
    font-family: 'Gotham Pro', sans-serif;
    color: #8283C0;
    font-size: 0.75rem;
    margin-top: 1rem;
}

.cabinet__menu-name {
    font-family: 'Gotham Pro', sans-serif;
    color: #fff;
    font-weight: 700;
    font-size: 1.35rem;
    margin-top: 0.5rem;
    max-width: 12rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
body.light .cabinet__menu-name {
    color: #2c2b63;
}
.cabinet__change-name-link {
    margin-top: 0.5rem;
    text-decoration: none;
    border-bottom: 1px solid #3e69fa63;
}

.cabinet__acc-wrap {
    display: flex;
    justify-content: space-around;
    padding: 1.5rem;
    background-color: #272660;
    border-radius: 1.25rem;
}
body.light .cabinet__acc-wrap {
    background-color: #fff;
    box-shadow: 0 0 1rem #0000000d;
}
.cabinet__acc-rank-info {
    display: flex;
    align-items: center;
}

.cabinet__acc-rank-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3.6875rem;
    height: 3.6875rem;
    border-radius: 3rem;
    border: 2px solid #5B4CF1;
    margin-right: 1rem;
}
.cabinet__acc-rank-name {
    display: flex;
    align-items: center;
    font-family: 'Gotham Pro', sans-serif;
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
}
body.light .cabinet__acc-rank-name {
    color: #2c2b63;
}
.cabinet__acc-rank-hint {
    display: flex;
    margin-left: 0.5rem;
}

.cabinet__acc-rank-progress-wrap {
    display: flex;
    align-items: center;
    margin-top: 0.35rem;
}

.cabinet__acc-rank-progress-track {
    display: flex;
    width: 7.5rem;
    height: 0.5rem;
    margin-right: 0.5rem;
    background-color: #1E1D4F;
    border-radius: 0.5rem;
    position: relative;
}
body.light .cabinet__acc-rank-progress-track {
    background-color: #f3f3fc;
}
.cabinet__acc-rank-progress-bar {
    content: '';
    display: block;
    height: 0.5rem;
    border-radius: 0.5rem;
    background-color: var(--color-green);
}

.cabinet__acc-rank-next {
    font-family: 'Gotham Pro', sans-serif;
    color: #8184BC;
    font-size: 0.75rem;
    margin-top: 0.25rem;
}

.cabinet__acc-rank-next-name {
    color: var(--color-green);
}

.cabinet__acc-rank-percents {
    color: #fff;
    font-weight: 700;
}

.cabinet__acc-verification {
    display: flex;
    flex-direction: column;
    z-index: 5;
}

.cabinet__acc-vrf-title {
    display: flex;
    align-items: center;
    font-size: 0.75rem;
    font-family: 'Gotham Pro', sans-serif;
    color: #fff;
}
body.light .cabinet__acc-vrf-title {
    color: #2c2b63;
}
.cabinet__acc-vrf-hint {
    display: flex;
    margin-left: 0.5rem;
}

.cabinet__acc-vrf-status {
    display: flex;
    align-items: center;
    margin-top: 0.5rem;
    font-size: 0.75rem;
    color: #fff;
    font-family: 'Gotham Pro', sans-serif;
}
.cabinet__acc-vrf-status.status-verified{
    color: var(--color-green);
}
body.light .cabinet__acc-vrf-status {
    color: #2c2b63;
}
.cabinet__acc-vrf-icon {
    margin-right: 0.5rem;
}
.cabinet__acc-vrf-link {
    margin-top: 0.35rem;
}

.cabinet__acc-cashback {
    display: flex;
    align-items: center;
    z-index: 5;
}

.cabinet_acc-cashback-icon {
    width: 3.5rem;
    height: 3.5rem;
    overflow: visible;
    position: relative;
    margin-right: 1rem;
}

.cabinet__acc-cashback-image {
    position: absolute;
    left: -3.25rem;
    top: -3.2rem;
    max-width: 300px;
}


.cabinet_acc-cashback-texts {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    z-index: 5;
}

.cabinet__acc-cashback-percents {
    font-size: 1.3125rem;
    font-weight: 700;
    color: #fff;
    font-family: 'Gotham Pro', sans-serif;
    margin: 0.35rem 0;
}
body.light .cabinet__acc-cashback-percents {
    color: #5e5d97;
}
.cabinet__acc-divider {
    width: 2rem;
    position: relative;
}
.cabinet__acc-divider::before {
    content: '';
    display: block;
    width: 1px;
    height: 100%;
    position: absolute;
    left: 1rem;
    top: 0;
    background-color: #3E3D77;
}
body.light .cabinet__acc-divider::before {
    background-color: #e0e0ef;
}
.cabinet__money {
    display: grid;
    margin-top: 2rem;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem;
}


.cabinet__money-wallets {
    margin-top: 2rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1rem;
}

.cabinet__money-wallet {
    display: flex;
    align-items: center;
    font-weight: 700;
    font-size: 0.95rem;
    cursor: pointer;
    border-radius: 1rem;
    justify-content: flex-start;
}
.cabinet__money-wallet.active{
    background-color: #0f0253;
}
.del-currency{
    background-color: #c60109;
    border-radius: 50%;
    width: 1rem;
    height: 1rem;
    line-height: 1rem;
    margin-left: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -1rem;
}
.cabinet__money-wallet.active .del-currency{
    display: none;
}
body.light .cabinet__money-wallet.active{
    background-color: rgba(22, 21, 58, 0.19);
}
.cabinet__money-wallet-icon {
    margin-right: 0.5rem;
}

.cabinet__recent-bets-wrap {
    padding: 1.5rem;
    margin-top: 2rem;
}

body.light .cabinet__recent-bets-wrap {
    background-color: #ffffff;
    box-shadow: 0 0 1rem #0000000d;
    padding: 1.5rem;
    margin-top: 2rem;
    border-radius: 1rem;
}

body.light .cabinet__transactions {
    background-color: #ffffff;
    box-shadow: 0 0 1rem #0000000d;
    padding: 1rem;
    border-radius: 1rem;
}
.cabinet__hint {
    position: relative;
}
.cabinet__hint-popup {
    display: none;
    position: absolute;
    background-color: #3e3d77;
    padding: 1rem;
    border-radius: 0.25rem;
    right: -5px;
    top: 1.5rem;
    z-index: 5;
}
.cabinet__hint-popup::before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    background-color: #3e3d77;
    transform: rotate(45deg);
    position: absolute;
    right: 8px;
    top: -4px;
}
body.light .cabinet__hint-popup {
    background-color: #fff;
    box-shadow: 0 0 25px #00000020;
}
body.light .cabinet__hint-popup::before {
    background-color: #fff;
}
.cabinet__hint-popup::after {
    content: '';
    display: block;
    width: 100%;
    height: 15px;
    position: absolute;
    right: 0;
    top: -10px;
}
.cabinet__hint:hover .cabinet__hint-popup {
    display: block;
}
.cabinet__hint div {
    font-size: 0.75rem;
    font-weight: 400;
}
.cabinet__hint a {
    margin-top: 0.5rem;
}

@media screen and (max-width: 1080px) {
    .cabinet__acc-rank-icon{
        display: none;
    }
    .cabinet__content-wrap{
        max-width: calc(100% - 240px);
    }
    .cabinet__money{
        grid-template-columns: 1fr;
    }

    .cabinet__content-wrap .cabinet__bonuses-trn{
        grid-template-columns: repeat(auto-fit, minmax(10rem, 15rem));
        justify-content: center;
        padding: 1rem;
    }
    .cabinet__bonuses-trn-img-wrap{
        grid-column-start: 1;
        grid-column-end: 3;
        align-self: center;
        justify-self: center;
        margin-bottom: 0.5rem;
    }
    .cabinet__content-wrap .cabinet__bonuses-trn-img{
        border-radius: 1rem;
    }
    .cabinet__content-wrap .cabinet__sett-top{
        grid-template-columns: 1fr;
    }
}

.cabinet__bonuses {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
    grid-gap: 2rem 1rem;
}

.cabinet__bonuses-item {
    border-radius: 1rem;
    padding: 0;
    overflow: hidden;
    position: relative;
    min-height: 12rem;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.cabinet__bonuses-item.multidays-bonus{
    /*background-image: url("/img/bonuses/multidep-bg.png");*/
    /*background-position-x: right;*/
    /*background-size: contain;*/
    border: 2px solid #F57D00;
}
.cabinet__bonuses-item.welcome-bonus{
    background-image: var(--bgImg, var(--bgimg, url("/img/bonuses/wb.png")));
    background-position-x: right;
    background-size: contain;
    border: 2px solid #F57D00;
}
body.light .cabinet__bonuses-item {
    /*background-image: none;*/
    background-color: #fff;
    box-shadow: 0 0 1rem #0000000d;
}
.cabinet__bonus-status {
    display: flex;
    align-items: center;
    font-size: 0.75rem;
}

.cabinet__bonus-status-icon {
    margin-right: 0.5rem;
}

.cabinet__bonus-corner {
    position: absolute;
    right: 1.4rem;
    top: 1.4rem;
    display: flex;
    justify-content: flex-end;
}
.cabinet__bonus-info-btn {
    width: 1rem;
    cursor: pointer;
    z-index: 10;
}
.cabinet__bonus-info-dd {
    position: absolute;
    display: none;
    width: 15rem;
    background-color: #323476;
    z-index: 5;
    padding: 0.5rem;
    border-radius: 0.5rem;
    font-size: 0.75rem;
    color: #8283c0;
    box-shadow: 0 0 0.5rem #00000026;
    border: 1px solid #47459c;
    right: 0;
    top: 1.25rem;
}
body.light .cabinet__bonus-info-dd {
    background-color: #fff;
    color: #333;
}
.cabinet__bonus-info-btn:hover .cabinet__bonus-info-dd {
    display: block;
}
.cabinet__bonus-delete-btn {
    cursor: pointer;
    position: absolute;
    right: 3rem;
    top: 1rem;
    display: flex;
    align-items: center;
    background: var(--secondaryBtn, #2B2F5B);
    border-radius: .5rem;
    padding: 0 .5rem;
    font-size: .75rem;
    font-weight: 700;
    line-height: .75rem;
    height: 2rem;
}
.cabinet__bonus-delete-btn img{
    padding-right: 5px;
}
.cabinet__bonuses-wrapper.info-shown .cabinet__bonus-delete-btn{
    visibility: visible;
}

.cabinet__bonus-delete-btn img{
    width: 1.3rem;
    height: 1.3rem;
}

.cabinet__bonus-pause-btn {
    cursor: pointer;
    position: absolute;
    left: 1rem;
    top: 1rem;
    display: flex;
    align-items: center;
    background: var(--secondaryBtn, #2B2F5B);
    border-radius: .5rem;
    padding: 0 .5rem;
    font-size: .75rem;
    font-weight: 700;
    line-height: .75rem;
    height: 2rem;
}
.cabinet__bonus-pause-btn img{
    padding-right: 5px;
}
.cabinet__bonuses-wrapper.info-shown .cabinet__bonus-pause-btn{
    visibility: visible;
}

.cabinet__bonus-pause-btn img{
    width: 1.3rem;
    height: 1.3rem;
}

.cabinet__bonus-content {
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    height: 12rem;
    background: linear-gradient(90deg, #2c245fFF, #2c245fDF 75%, #2c245f00);
    width: 70%;
    padding: .5rem 1rem;
}
body.light .cabinet__bonus-content {
    background: linear-gradient(90deg, #80B3EFFF, #80B3EFDF 75%, #80B3EF00);
}
.cabinet__bonuses-item.multidays-bonus .cabinet__bonus-content{
    background: #2c245f30;
    width: 100%;
}
.cabinet__bonuses-item.welcome-bonus .cabinet__bonus-content{
    background: #2c245f10;
    width: 100%;
}
body.light .cabinet__bonuses-item.multidays-bonus .cabinet__bonus-content{
    background: #80B3EF30;
    width: 100%;
}
body.light .cabinet__bonuses-item.multidays-bonus .cabinet__bonus-content{
    background: #80B3EF10;
    width: 100%;
}


.cabinet__bonus-left {
    width: 50%;
    margin-right: 1rem;
}

.cabinet__bonus-title {
    color: #fff;
    font-weight: 700;
    font-size: 1.1rem;
    line-height: 1.4rem;
    position: absolute;
    top: 5.1rem;
    max-width: 200px;
    max-height: 5rem;
}
.bonuses__wb-wrapper .cabinet__bonus-title{
    position: relative;
    top: initial;
}
.cabinet__bonuses-item.welcome-bonus .cabinet__bonus-title{
    max-width: 60%;
}
body.light .cabinet__bonus-title {
    color: #2C2B63;
}
.cabinet__bonus-sub_title {
    color: var(--secondaryText);
    font-weight: 400;
    font-size: .875rem;
    line-height: 1.5rem;
}
.cabinet__bonus-goal{
    color: var(--secondaryText);
    font-weight: 400;
    font-size: .75rem;
    line-height: 1.5rem;
}

.cabinet__bonus-plus {
    font-size: 0.75rem;
    margin-top: 1rem;
    color: #fff;
}

.cabinet__bonuses-item_disabled{
    opacity: 0.5;
    order: 200;
}
.cabinet__bonuses-item_active .cabinet__bonus-plus {
    color: var(--color-red);
}

.cabinet__bonuses-item_disabled .cabinet__bonus-plus {
    color: var(--color-orange);
}
.cabinet__bonuses-item_pending .cabinet__bonus-plus {
    color: var(--color-orange);
}

.cabinet__bonus-countdown {
    margin-top: 2rem;
    margin-bottom: 0.5rem;
    color: #fff;
    font-size: 0.75rem;
}
.cabinet__bonus-right {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    flex-grow: 1;
}
.cabinet__bonus-image-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 6rem;
    height: 6rem;
    border-radius: 6rem;
    border: 1px solid #8283C0;
    position: relative;
    margin-top: 2rem;
}

.cabinet__bonus-image-wrap::before {
    content: '';
    display: block;
    background: rgba(120, 123, 247, 0.08);
    width: 7.5rem;
    height: 7.5rem;
    position: absolute;
    border-radius: 8rem;
    left: calc(-0.75rem - 1px);
    top: calc(-0.75rem - 1px);
}
body.light .cabinet__bonus-image-wrap::before {
    background: rgba(120, 123, 247, 0.03);
}
.cabinet__bonus-image-wrap::after {
    content: '';
    display: block;
    background: rgba(120, 123, 247, 0.08);
    width: 9rem;
    height: 9rem;
    position: absolute;
    border-radius: 8rem;
    left: calc(-1.5rem - 1px);
    top: calc(-1.5rem - 1px);
}
body.light .cabinet__bonus-image-wrap::after {
    background: rgba(120, 123, 247, 0.03);
}
.cabinet__bonus-wager {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 1rem;
}

.cabinet__bonus-wager-label {
    color: #8283C0;
    font-size: 0.75rem;
    margin-top: 0.25rem;
}


.cabinet__bonus-wager-value {
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
}


.cabinet__bonus-wager-green {
    color: var(--color-green);
    font-size: 1.15rem;
}
.bonus_yes_btn{
    height: 2.5rem;
    display: flex;
    align-items: center;
    padding: 0 1.25rem;
    border-radius: 0.5rem;
    background-color: var(--color-green);
    color: #3D3E6D;
    font-size: 0.75rem;
    font-weight: 700;
    margin-top: 1rem;
    cursor: pointer;
    outline: none;
    border: none;
    text-decoration: none;
    text-align: center;
}
.bonus__green-btn,
.cabinet__event-activate-btn {
    height: 2.5rem;
    display: flex;
    align-items: center;
    padding: 0 1.25rem;
    border-radius: 0.5rem;
    background-color: var(--color-green);
    color: #3D3E6D;
    font-size: 0.75rem;
    font-weight: 700;
    margin-top: 1rem;
    cursor: pointer;
    outline: none;
    border: none;
    text-decoration: none;
    text-align: center;
}


.cabinet__bonus-modal-wrap {
    display: none;
}
.cabinet__bonus-menu {
    background-color: #fff;
    border-radius: 1rem;
    padding: 3rem;
    display: flex;
    flex-direction: column;
}
.cabinet__bonus-menu-item {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.5rem;
    background-color: var(--color-blue);
    border-radius: 0.5rem;
    color: #e6e7ff;
    font-size: 0.875rem;
    font-weight: 700;
    cursor: pointer;
}
.cabinet__bonus-menu-item + .cabinet__bonus-menu-item {
    margin-top: 0.5rem;
}
.cabinet__bonus-menu-item:hover {
    background-color: #6366ef;
}
.cabinet__bonus-menu + .spinner {
    background-color: #ffffffbf;
    border-radius: 1rem;
}

.cabinet__bonuses-item .spinner .message {
    color: var(--color-blue);
}
.cabinet__gift {
    background-image: linear-gradient(270deg, #2B2A64 0%, rgba(43, 42, 100, 0.27) 100%);
    border-radius: 1rem;
    padding: 1.5rem;
    position: relative;
    min-height: 10.5rem;
}
.cabinet__gift-title {
    color: #fff;
    padding-top: 1rem;
    font-weight: 700;
    font-size: 1rem;
}
.cabinet__gift-expire-label {
    margin-top: 2rem;
    color: #76779e;
    font-size: 0.875rem;
    font-weight: 700;
}
.cabinet__gift-expire-value {
    margin-top: 0.5rem;
    font-size: 0.75rem;
    color: var(--color-orange);
    margin-bottom: 0.5rem;
}
.cabinet__gift-take-btn {
    height: 2.5rem;
    display: flex;
    align-items: center;
    padding: 0 2rem;
    border-radius: 0.5rem;
    background-color: var(--color-green);
    color: #3D3E6D;
    font-size: 0.75rem;
    font-weight: 700;
    margin-top: 1rem;
    cursor: pointer;
    outline: none;
    border: none;
    text-decoration: none;
    z-index: 50;
}
.cabinet__code-form {
    /*background-image: url(/img/bonuses/promo-bg.png);*/
    /*background-repeat: no-repeat;*/
    /*background-size: contain;*/
    /*border-radius: 1rem;*/
    /*width: 30rem;*/
    /*height: 25rem;*/
    display: flex;
    flex-direction: column;
    position: fixed !important;
    z-index: 50;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: clamp(360px, 100%, 600px);
    align-items: center;
}
.cabinet__code-form .promo-bg{
    width: 100%;
}
.cabinet__code-form-wrap {
    content: '';
    display: none;
    opacity: 0;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background-color: var(--color-overlay-background);
    z-index: 990;
}
.cabinet__promo-code-icon {
    display: flex;
    width: 6rem;
    height: 6rem;
    margin: 0 auto 1rem auto;
    border-radius: 5rem;
    border: 1px dashed #535597;
    justify-content: center;
    align-items: center;
}
.cabinet__promo-code-title {
    text-align: center;
    color: #000;
    font-weight: 700;
    font-size: 1.35rem;
    margin: auto auto 0.5rem auto;
}
.cabinet__promo-code-hint {
    width: 12rem;
    margin: 0 auto 3rem auto;
    color: #444;
    font-family: "Montserrat";
    font-size: .75rem;
    line-height: .875rem;
    font-weight: 700;
    text-align: center;
}
#cabinet__promo-code-form {
    position: absolute;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: 2rem;
}
#cabinet__promo-code-form .page-info-icon::after{
    border: #000000 1px solid;
    color: #000000;
    font-weight: 600;
}
.cabinet__promo-code-input {
    background-color: transparent;
    border: none;
    border-bottom: 3px solid #444;
    padding: 0 0.5rem;
    height: 4rem;
    text-align: center;
    margin-bottom: .5rem;
    outline: none;
    width: 15rem;
    color: #262659;
    font-size: 1.8rem;
    text-transform: uppercase;
    font-weight: 700;
}
.cabinet__promo-code-input::placeholder {
    color: #262659;
    font-weight: 800;
    font-stretch: expanded;
    font-size: 2.5rem;
    line-height: 3rem;
}
.cabinet__promo-code-btn {
    font-family: "Gotham Pro", "sans-serif";
    height: 3rem;
    border-radius: 2rem;
    font-size: 1.2rem;
    color: #000;
    width: 14rem;
}
.cabinet__code-form .spinner {
    background-color: rgba(56, 55, 129, 0.05);
}
.cabinet__code-form .spinner .message {
    color: #fff;
}
.cabinet__gift-taken {
    margin-top: 1rem;
    color: #e4b556;
    font-weight: 700;
    font-size: 1.25rem;
    border-radius: 0.5rem;
}
.cabinet__gift-play-btn {
    height: 2rem;
    display: flex;
    align-items: center;
    padding: 0 2rem;
    border-radius: 0.25rem;
    background-color: var(--color-green);
    color: #3D3E6D;
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
    outline: none;
    border: none;
    text-decoration: none;
    justify-content: center;
    z-index: 2;
}
.cabinet__bonus-balance {
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1rem;
    margin-bottom: 4px;
    position: absolute;
    top: 2.2rem;
}
body.light .cabinet__bonus-balance {
    color: #2c2b63;
}
.cabinet__bonus-balance-name {
    color: #8b8dc2;
}
.cabinet__bonus-balance-value {
    margin-top: 0.25rem;
    font-weight: 700;
}

.cabinet__bonus-dep {
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1rem;
    margin-bottom: 4px;
    position: absolute;
    bottom: 2.7rem;
}
body.light .cabinet__bonus-dep {
    color: #2c2b63;
}

.cabinet__code-form-close {
    font-family: Arial, sans-serif;
    position: absolute;
    width: 3rem;
    height: 3rem;
    background-color: var(--color-green);
    color: #000;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 3rem;
    line-height: 3rem;
    font-weight: 600;
    right: 1rem;
    top: 2rem;
    cursor: pointer;
}
.cabinet__event-user-data{
    margin-top: 10px;
}
.cabinet__event-user-data input{
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #ccc;
    padding: 0 0.2rem;
    height: 20px;
    text-align: left;
    width: 10rem;
    color: #fff;
    outline: none;
    font-size: 14px;
}

.cabinet__bonus-time {
    display: flex;
    align-items: center;
    font-family: "Gotham Pro", "sans-serif";
    font-style: normal;
    font-weight: 500;
    font-size: 0.75rem;
    line-height: 1rem;
    position: absolute;
    color: var(--primaryText);
}
.cabinet__bonus-time > img {
    margin: 0 0.4rem 0 0;
    width: 1.2rem;
    height: 1.2rem;
}
.bonus-btn-wrap{
    position: relative;
    display: flex;
    height: 2.5rem;
    align-items: center;
}
.bonus-btn-main {
    /*left: 0;*/
    display: flex;
    width: 8rem;
    height: 2.2rem;
    background-color: var(--color-green);
    color: #000;
    border-radius: 1rem;
    justify-content: center;
    align-items: center;
    cursor: pointer;

    font-family: "Gotham Pro", "sans-serif";
    font-style: normal;
    font-weight: 500;
    font-size: .875rem;
    line-height: 1rem;
    text-align: center;
    /*z-index: 3;*/

    text-decoration: none;
}
.bonus-btn-main.disabled{
    background-color: #98A1FF50;
    color: #FFFFFF50;
}
.bonus-btn-main.bonus-drop-btn{
    background-color: #bd1f1f;
    height: 1.6rem;
    font-size: .75rem;
}

.full-wide-btn .bonus-btn-main{
    width: 100%;
    border-radius: .5rem;
}
body.light .bonus-btn-main {
    /*background-color: #470966;*/
}
.bonus-btn-left-border{
    position: absolute;
    /*margin-left: -5px;*/
    padding: 0;
    width: 8.5rem;
    height: 2rem;
    border-radius: 1rem;
    justify-content: center;
    align-items: center;
    border-right: #FFFFFF 3px solid;
    z-index: 2;
    background-color: #19192E;
}
body.light .bonus-btn-left-border {
    background-color: #accdf4;
}
.bonus-btn-info {
    display: flex;
    cursor: pointer;
    width: 5rem;
    height: 2rem;
    background: none;
    border-radius: 1rem;
    justify-content: center;
    align-items: center;
    border: var(--primaryText) 2px solid;
    z-index: 1;
    color: var(--primaryText);
    margin-left: 1rem;
    font-family: "Gotham Pro", "sans-serif";
    font-style: normal;
    font-weight: 500;
    font-size: .875rem;
    line-height: 1rem;
    text-align: center;
}

.bonus-btn-info > div:last-child{
    display: none;
}
.info-shown .bonus-btn-info > div:last-child{
    display: block;
}
.info-shown .bonus-btn-info > div:first-child{
    display: none;
}

.bonus-btn-info .bonus-info-arrow{
    position: absolute;
    right: 0.7rem;
    top: 0.6rem;
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 7px solid white;
    transition: all 0.5s;
}

.cabinet__bonuses-wrapper.info-shown .bonus-info-arrow{
    transform: rotate(180deg);
}

.cabinet__bonuses-wrapper{
    position: relative;
    overflow: hidden;
}
.bonus-info-wrapper{
    position: relative;
    border-radius: 1rem;
    width: 100%;
    background: var(--bgMainColor);
    padding-top: 3rem;
}
.bonus-info-wrapper .bonus-info-content{
    padding: 0 1rem 1rem 1rem;
}


.bonus-info-content{
    display: flex;
    flex-flow: column;
    max-height: calc(100dvh - 14rem);
    overflow: auto;
}
.bonus-info-content .conditions{
    text-transform: capitalize;
    font-size: 1rem;
    font-weight: 600;
    color: var(--primaryText);
    margin: 0.5rem 0;
}
.bonus-info-content .bonus_name{
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 2rem;
    color: var(--primaryText);
}
.bonus-info-content .bonus_subtitle{
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1rem;
    color: var(--secondaryText);
}
.bonus-info-content .params{
    margin-top: 1rem;
    padding: 0 0.2rem;
    font-size: .75rem;
    line-height: 1rem;
    font-weight: 400;
    color: #FFFFFF;
    /*overflow-y: auto;*/
}
.bonus-info-content .params .param{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .75rem;
    font-weight: 500;
    line-height: 1rem;
    text-align: left;
    color: var(--secondaryText);
}
.bonus-info-content .params .param .value{
    color: var(--primaryText);
}

/* MultiDays bonus */
.cabinet__bonuses-item.bonus-multi-days-form{
    padding: 1rem;
    background: #181A32;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .75rem;
    font-weight: 400;
    line-height: 1rem;
    max-width: 370px;
}
.bonus-multi-days-form .title{
    font-family: "Gotham Pro", "sans-serif";
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    text-align: left;
}
.bonus-multi-days-form .sub-title{
    font-family: "Gotham Pro", "sans-serif";
    font-size: .75rem;
    font-weight: 400;
    line-height: 1rem;
    color: #8186BD;
}
.bonus-multi-days-form .days-wrapper{
    display: flex;
    width: 100%;
    overflow: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
}
.bonus-multi-days-form .days-wrapper .day{
    display: flex;
    flex-flow: column;
    justify-content: space-around;
    align-items: center;
    height: 64px;
    scroll-snap-align: start;
    border-radius: 1rem;
    margin: 0 2px;
    padding: .5rem 1rem;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
    font-weight: 400;
    line-height: 1rem;
    background: #1C1F3E;
    color: #8186BD;
}
.bonus-multi-days-form .days-wrapper .day.active{
    background: #2C2B64;
}
.bonus-multi-days-form .days-wrapper .day .status-icon{
    position: absolute;
    top: 1px;
    right: 1px;
    width: 14px;
    height: 14px;
}

.bonus-multi-days-form .days-wrapper .day .spins img{
    width: 20px;
    height: 20px;
}
.bonus-multi-days-form .day .spins{
    color: #FFF;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.2rem;
    text-align: left;
}
.bonus-multi-days-form .timeout{
    width: 100%;
    background: #2C2B64;
    border-radius: 1rem;
    display: flex;
    flex-flow: column;
    justify-content: center;
    padding: .5rem;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1rem;
    align-items: center;
    height: 6rem;
}
.timeout .time{
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
}
.timeout .time > div{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-grow: 1;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.2rem;
    background: #211F5E;
    border-radius: 1rem;
    height: 2rem;
    margin-top: .5rem;
}
.bonus-multi-days-form .delay-info{
    display: flex;
    justify-content: center;
    width: 100%;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1rem;
    text-align: center;
    color: #8186BD;
}

.bonuses__item-progress {
    position: absolute;
    top: 3.5rem;
    height: 1.2rem;
    border-radius: 0.5rem;
    background-color: #2C2B63;
    vertical-align: center;
    padding: 0 .2rem;
    /*width: 180px;*/
    background: linear-gradient(90deg, #A7DA94AA var(--progress), #181A32 var(--progress))
}
body.light .bonuses__item-progress {
    background-color: #e3e3e3;
}
.bonuses__item-progress .progress-label{
    line-height: 1.2rem;
    font-size: .7rem;
}

.bonuses__wb-wrapper .line-through{
    width: 90%;
    height: 1px;
    border-bottom: #620C90 1px solid;
    margin-top: 2rem;
    margin-bottom: -2rem;
    margin-left: 1rem;
}

.bonuses__wb-wrapper{
    background: var(--bgMainColor);
    padding: 1rem;
    border-radius: 1rem;
    position: relative;
}

.bonuses__wb-wrapper p{
    font-size: .875rem;
    font-weight: 400;
    line-height: 1rem;
    text-align: left;
    color: var(--secondaryText);
    max-width: 30rem;
}

.bonuses__wb-wrapper .deposits-wrapper{
    display: flex;
    overflow: auto;
    margin-top: 1rem;
}

.bonuses__wb-wrapper .deposits-wrapper .dep{
    margin-right: 1rem;
    flex-shrink: 0;
}

.bonuses__wb-wrapper .deposits-wrapper .dep > * {
    margin-bottom: .5rem;
    font-size: .875rem;
    font-weight: 600;
}

.bonuses__wb-wrapper .deposits-wrapper .dep .title{
    background: linear-gradient(135deg, #3A42E1 0%, #620C90 100%);
    font-weight: 400;
    width: 100%;
    text-align: center;
    border-radius: 1rem;
    padding: .4rem .7rem;
}
body.light .bonuses__wb-wrapper .deposits-wrapper .dep .title{
    color: #FFFFFF;
}
.bonuses__wb-wrapper .deposits-wrapper .dep.disabled > *:nth-child(2){
    opacity: .6;
}
.bonuses__wb-wrapper .deposits-wrapper .dep.disabled > *:nth-child(3){
    opacity: .6;
}
.bonuses__wb-wrapper .deposits-wrapper .dep.disabled .title{
    background: var(--secondaryBtn);
    color: var(--secondaryText);
}

.bonuses__wb-wrapper .deposits-wrapper .dep img{
    margin-right: .5rem;
    width: 20px;
    height: 20px;
}

.bonuses__wb-wrapper .deposits-wrapper .dep.done img,
.bonuses__wb-wrapper .deposits-wrapper .dep.canceled img{
    height: 30px;
    width: 30px;
}

.bonuses__wb-wrapper .rewards{
    margin-top: 5px;
    display: flex;
    width: 100%;
}
.bonuses__wb-wrapper .rewards img{
    width: 20px;
    height: 20px;
    margin-bottom: 5px;
}

.bonuses__wb-wrapper .rewards > div:first-child{
    margin-right: .5rem;
}

.bonuses__wb-wrapper .rewards > * {
    padding: .5rem;
    display: flex;
    flex-flow: column;
    align-items: center;
    flex: 1 0 50%;
    background-color: var(--baseColor);
    border-radius: .5rem;
}

.bonuses__wb-wrapper .amount{
    color: var(--primaryText);
    font-size: 1.2rem;
    line-height: 1.4rem;
    font-weight: 600;
    margin-top: 8px;
}

.bonuses__wb-wrapper .range-amount{
    border-radius: 1rem;
    background-color: var(--secondaryBtn);
    padding:.5rem;
}

.bonuses__wb-wrapper .conditions{
    position: absolute;
    display: flex;
    align-items: center;
    top: 1rem;
    right: 3rem;
    padding:.5rem;
    border-radius: .5rem;
    background-color: var(--secondaryBtn, #2B2F5B);
    cursor: pointer;
    font-size: .875rem;
    font-weight: 700;
    line-height: 1rem;
    text-align: left;
}

.wb-conditions{
    position: absolute;
    display: flex;
    align-items: center;
    top: 1rem;
    left: 1rem;
    padding:.5rem;
    border-radius: .5rem;
    background-color: var(--secondaryBtn, #2B2F5B);
    cursor: pointer;
    font-size: .875rem;
    font-weight: 700;
    line-height: 1rem;
    text-align: left;
}

.conditions-modal{
    background-color: var(--bgMainColor);
    border-radius: 1rem;
    max-width: 30rem;
    padding: 1rem;
}
.conditions-modal p{
    color: var(--primaryText);
    text-indent: .5rem;
    margin-top: .5rem;
}
#wb-amount-input{
    border: none;
    outline: none;
}
#wb-amount-input:active{
    border: none;
    outline: none;
}

.cabinet__tournaments {
    display: grid;
    grid-gap: 2rem;
}

.cabinet__bonuses-empty-msg {
    display: flex;
    height: 3rem;
    justify-content: center;
    align-items: center;
    border-radius: 3rem;
    border: 1px dashed #37396e;
    color: #8283C0;
    font-size: 0.875rem;
}

.cabinet__bonuses-empty-msg-img {
    margin-right: 0.75rem;
    height: 1.5rem;
}

.cabinet__bonuses-list {
    margin: 2rem 0;
}
.cabinet__bonuses-list + .cabinet__bonuses-list {
    margin-top: 3rem;
}

.cabinet__bonuses-list-title {
    font-size: 1.25rem;
    color: #fff;
    font-weight: 700;
}
body.light .cabinet__bonuses-list-title {
    color: #2c2b63;
}
.cabinet__bonuses-trn {
    align-items: center;
    background-color: #2C2B63;
    border-radius: 1rem;
    border: 1px solid #33346a;
    margin-top: 1.25rem;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}
body.light .cabinet__bonuses-trn {
    background-color: #ffffff;
    border: none;
    box-shadow: 0 0 1rem #0000000d;
}
.cabinet__bonuses-trn-img-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 9.35rem;
    width: 19.75rem;
    flex-shrink: 0;
}

.cabinet__bonuses-trn-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 1rem 0 0 1rem;
}

.cabinet__bonuses-trn-img_past {
    filter: grayscale(1);
}

.cabinet__bonuses-trn-info {
    display: flex;
    flex-direction: column;
    margin-left: 1rem;
}

.cabinet__bonuses-trn-name {
    color: #fff;
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0.75rem 0 0.75rem 0;
}
body.light .cabinet__bonuses-trn-name {
    color: #2c2b63;
}
.cabinet__bonuses-trn-fund-label {
    color: #8184BC;
    font-size: 0.625rem;
    margin-bottom: 0.65rem;
}

.cabinet__bonuses-trn-fund-value {
    display: flex;
    align-items: center;
    color: var(--color-orange);
    font-weight: 700;
    font-size: 1.25rem;
}

.cabinet__bonuses-trn-fund-value_past {
    display: flex;
    align-items: center;
    color: #8283C0;
    font-weight: 700;
    font-size: 1.25rem;
}

.cabinet__bonuses-trn-fund-icon {
    margin-right: 1rem;
    height: 1.5rem;
    filter: hue-rotate(160deg) saturate(2) brightness(1.25);
}
.cabinet__bonuses-trn-fund-icon_past {
    margin-right: 1rem;
    height: 1.5rem;
}

.cabinet__bonuses-trn-dates {
    display: flex;
    flex-direction: column;
    margin-left: auto;
    margin-right: 1rem;
}

.cabinet__bonuses-trn-expire-label {
    color: #fff;
    font-size: 0.75rem;
    text-align: center;
}
body.light .cabinet__bonuses-trn-expire-label {
    color: #2c2b63;
}
.cabinet__bonuses-trn-expire-value {
    margin-top: 0.75rem;
    color: var(--color-orange);
    font-size: 0.875rem;
    font-weight: 700;
    text-align: center;
}

.cabinet__bonuses-trn-expire-value_past {
    margin-top: 0.75rem;
    color: #8283C0;
    font-size: 0.875rem;
    font-weight: 700;
    text-align: center;
}

.cabinet__bonuses-trn-ptcp-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.5rem;
    margin-top: 1.5rem;
    color: #fff;
    font-size: 0.75rem;
    border-radius: 2rem;
    border: 1px solid #A3DC8E;
    padding: 0 1.5rem;
    cursor: pointer;
    outline: none;
}
body.light .cabinet__bonuses-trn-ptcp-btn {
    color: #1a1944;
    font-size: 0.875rem;
}
.cabinet__bonuses-trn-ptcp-btn_past {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.5rem;
    margin-top: 1.5rem;
    color: #fff;
    font-size: 0.75rem;
    border-radius: 2rem;
    border: 1px solid #A3DC8E;
    padding: 0 1.5rem;
    cursor: pointer;
    outline: none;
    opacity: 0.5;
}
body.light .cabinet__bonuses-trn-ptcp-btn_past {
    color: #1a1944;
    font-size: 0.875rem;
}

.cabinet__sett {
    display: flex;
    flex-direction: column;
}

.cabinet__sett-top {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem;
}

.cabinet__sett-personal {
    margin-top: 2rem;
}

.cabinet__sett-pass-fields {
    display: grid;
    grid-template-rows: 1fr 1fr 1fr;
    grid-gap: 1rem;
    margin-bottom: 2rem;
}

.cabinet__sett-submit-btn {
    height: 3rem;
    border-radius: 0.625rem;
    border: none;
    background-color: #4E7CFF;
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    outline: none;
    cursor: pointer;
}

.cabinet__sett-personal-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem;
}

.cabinet__sett-personal-user {
    display: grid;
    grid-template-rows: auto auto auto auto;
    grid-gap: 1rem;
}

.cabinet__sett-personal-passport {
    display: grid;
    grid-template-rows: auto auto auto;
    grid-gap: 1rem;
}

.cabinet__sett-address {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1rem;
}

.input__file-hint {
    color: #8283C0;
    text-align: center;
    margin-top: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    max-width: 12rem;
}

.input__file-hint-link {
    color: #2281F6;
    border-bottom: 1px solid #3e69fa63;
}

.cabinet__prtn-submit-btn {
    margin-top: 2rem;
    height: 2.5rem;
    margin-right: auto;
    padding: 0 2rem;
    border-radius: 0.5rem;
    background-color: transparent;
    border: 2px solid #787BF7;
    color: #fff;
    font-size: 0.75rem;
    cursor: pointer;
    outline: none;
}
body.light .cabinet__prtn-submit-btn {
    color: #1a1944;
}

.cabinet__verify-fields {
    display: flex;
    flex-direction: column;
}
.cabinet__verify-link {
    margin-top: 0.5rem;
    margin-right: auto;
}

@media screen and (max-width: 1000px) {
    .cabinet__sett-personal-cols{
        grid-template-columns: 1fr;
    }
    .cabinet__sett-personal-passport{
        grid-row-start: 1;
    }
}

.cabinet__prtn-ref-title {
    color: #fff;
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.75em;
}
body.light .cabinet__prtn-ref-title{
    color: #1a1944;
}

.cabinet__prtn-ref {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
}
.cabinet__prtn-ref-link {
    display: flex;
    align-items: center;
    border: 1px solid #4E7CFF;
    background-color: #262558;
    position: relative;
    padding: 0 3rem 0 1rem;
    height: 2.5rem;
    color: #fff;
    font-size: 0.875rem;
    border-radius: 0.625rem;
    margin-bottom: 0.5rem;
    width: 100%;
    overflow: hidden;
}
body.light .cabinet__prtn-ref-link {
    background-color: #fff;
    color: #1a1944;
}
.cabinet__prtn-ref-copy {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.625rem;
    background-color: #4E7CFF;
    background-size: auto;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    right: -1px;
    top: -1px;
    cursor: pointer;
}

.cabinet__prtn-share {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    margin-left: 3rem;
}

.cabinet__prtn-share-links {
    display: grid;
    grid-template-columns: repeat(auto-fill, 2.25rem);
    grid-gap: 0.75rem;
}

.cabinet__prtn-digests {
    margin-top: 2rem;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1rem;
}

.cabinet__prtn-digest-item {
    display: flex;
    flex-direction: column;
    border: 1px solid #3b3a75;
    background-color: #292861;
    padding: 1rem;
    border-radius: 0.95rem;
    position: relative;
}
body.light .cabinet__prtn-digest-item {
    background-color: #fff;
    border: 1px solid #e0e0ef;
}
.cabinet__prtn-digest-icon {
    position: absolute;
    right: 0.75rem;
    top: 0.75rem;
}
body.light .cabinet__prtn-digest-icon {
    filter: brightness(0.75);
}
.cabinet__prtn-digest-name {
    color: #aaaace;
    font-size: 0.75rem;
    padding-right: 1.5rem;
}

.cabinet__prtn-digest-value {
    color: #fff;
    font-size: 1.875rem;
    font-weight: 700;
    margin-top: 1rem;
}
body.light .cabinet__prtn-digest-value {
    color: #2c2b63;
}
@media screen and (max-width: 800px) {
    .cabinet__prtn-digests{
        grid-template-columns: repeat(auto-fit, minmax(6rem, 1fr));
    }
}

.ranks-wrapper{
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    margin: 1.8rem;
    padding: 2rem 2rem;
}
.rank-card{
    scroll-snap-align: start;
    margin: 0 .5rem;
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-flow: column;
    align-items: center;
    background: linear-gradient(180deg, #2B2F5B 20%, #2B2F5BA0 50%, #181A3200 90%);

    width: clamp(360px, 33%, 400px);
    /*height: 590px;*/
    height: min-content;
    border-radius: 1rem;

    transform: scale(.9);
    transition: all .5s;
}
.rank-card .veil {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 50;
    background-color: #0c0c30C0;
    border-radius: 1rem;
}
.rank-card.selected{
    transform: none;
}
.rank-card.selected .veil{
    display: none;
}
.rank-card.rank-1{
    background: linear-gradient(180deg, #2B2F5B 20%, #2B2F5BA0 40%, #181A3200 80%);
}
.rank-card.rank-2{
    background: linear-gradient(180deg, #004D2C 20%, #004D2C 40%, #181A3200 80%);
}
.rank-card.rank-3{
    background: linear-gradient(180deg, #044360 20%, #044360 40%, #181A3200 80%);
}
.rank-card.rank-4{
    background: linear-gradient(180deg, #783001 20%, #783001 40%, #181A3200 80%);
}
.rank-card.rank-5{
    background: linear-gradient(180deg, #2D6206 20%, #2D6206 40%, #181A3200 80%);
}
.rank-card.rank-6{
    background: linear-gradient(180deg, #B26D0A 20%, #B26D0A 40%, #181A3200 80%);
}
.rank-card.rank-7{
    background: linear-gradient(180deg, #000000 20%, #000000 40%, #181A3200 80%);
}
.rank-card.rank-8{
    background: linear-gradient(180deg, #963126 20%, #963126 40%, #181A3200 80%);
}
.rank-card.rank-9{
    background: linear-gradient(180deg, #FF7300 20%, #FF7300 40%, #181A3210 80%);
}


.rank-card .rank-bg{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    object-fit: contain;
}

.rank-card .rank-info{
    position: absolute;
    top: 30px;
    left: 0;
    right: 0;
    width: 100%;
    display: flex;
    flex-flow: column;
    align-items: center;
    color: #FFFFFF7A;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
    font-weight: 400;
    line-height: 1rem;
    letter-spacing: 0.01em;
    height: 380px;
    justify-content: space-around;
}
.rank-info .rank-icon{
    width: 196px;
    height: 196px;
}
.rank-info .rank-name{
    font-family: "Gotham Pro", "sans-serif";
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2rem;
    text-align: center;
    color: #FFF;
}

.rank-info .current-value{
    color: #FFF;
    font-size: 1rem;
    line-height: 2rem;
    letter-spacing: 0.01em;
}
.rank-info .achievements__popup-progress-bar{
    background-color: #00000033;
}
.rank-info .achievements__popup-progress{
    background-color: #A7DA94;
}

.rank-card .rewards{
    /*position: absolute;*/
    /*bottom: 0;*/
    /*left: 0;*/
    /*right: 0;*/
    margin-top: 420px;
    width: 100%;
    /*margin: 0 .5rem;*/
    background: #2C2B64;
    border-radius: 1rem;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: space-between;
    padding: .5rem;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .875rem;
    font-weight: 700;
    line-height: 1rem;
    letter-spacing: 0.03em;
    text-align: left;
    color: #FFF;
}
.rewards .items{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    /*overflow-x: auto;*/
    /*scroll-behavior: smooth;*/
    /*scroll-snap-type: x mandatory;*/
}
.rewards .reward-item{
    /*scroll-snap-align: start;*/
    flex-shrink: 0;
    position: relative;
    width: calc(50% - 10px);
    background: #211F5E;
    border-radius: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: .5rem 5px;
    height: 90px;
}
.reward-item .title{
    font-size: .75rem;
    position: absolute;
    top: 5px;
    text-align: center;
    z-index: 3;
}
.reward-item > img{
    height: 90px;
    padding: 30px 10px 10px 10px;
}
.reward-item .amount{
    position: absolute;
    bottom: 12px;
    z-index: 2;
    font-weight: 600;
    font-size: 1rem;
    text-shadow: #FFF 0 0 2px;
}
.ranks{
    position: relative;
}
.ranks .scroll-control{
    position: absolute;
    top: 40%;
    background-color: #2B2F5B;
    width: 3rem;
    height: 3rem;
    border-radius: .5rem;
    cursor: pointer;
}
.ranks .scroll-control.left{
    left: -20px;
}
.ranks .scroll-control.right{
    right: -20px;
}
.ranks .scroll-control .arrow-right,
.ranks .scroll-control .arrow-left{
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 0;
}
.ranks .scroll-control .arrow-right{
    transform: translate(-50%, -50%) rotate(-45deg);
}
.ranks .scroll-control .arrow-left{
    transform: translate(-50%, -50%) rotate(135deg);
}
.rank-card .current-rank{
    display: none;
    position: absolute;
    top: -1.5rem;
    font-family: "Gotham Pro", "sans-serif";
    font-size: .85rem;
    font-weight: 500;
    line-height: 1rem;
}
.rank-card.current .current-rank{
    display: block;
}

.rank-card.selected .rewards.highlighted{
    border: 2px solid #A3DC8F
}

.ranks .rewards .scroll-control{
    top: 0;
    background: none;
    width: 3rem;
    height: 3rem;
}
.ranks .rewards .scroll-control.left{
    left: 0;
}
.ranks .rewards .scroll-control.right{
    right: 0;
}
.ranks .rewards .button{
    margin: .5rem 0;
    width: 100%;
    height: 2rem;
    font-size: 1rem;
    border-radius: 1rem;
}

.rank-card .rank-required{
    font-family: "Gotham Pro", "sans-serif";
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.2rem;
    text-align: center;
    color: #FFF;
    max-width: 20rem;
}

.rank-card.reqired-modal{
    width: 24rem;
    height: 450px;
}
.reqired-modal.rank-card.rank-1{
    background: linear-gradient(180deg, #2B2F5B 20%, #2B2F5BA0 40%, #181A32 80%);
}
.reqired-modal.rank-card.rank-2{
    background: linear-gradient(180deg, #004D2C 20%, #004D2C 40%, #181A32 80%);
}
.reqired-modal.rank-card.rank-3{
    background: linear-gradient(180deg, #044360 20%, #044360 40%, #181A32 80%);
}
.reqired-modal.rank-card.rank-4{
    background: linear-gradient(180deg, #783001 20%, #783001 40%, #181A32 80%);
}
.reqired-modal.rank-card.rank-5{
    background: linear-gradient(180deg, #2D6206 20%, #2D6206 40%, #181A32 80%);
}
.reqired-modal.rank-card.rank-6{
    background: linear-gradient(180deg, #B26D0A 20%, #B26D0A 40%, #181A32 80%);
}
.reqired-modal.rank-card.rank-7{
    background: linear-gradient(180deg, #000000 20%, #000000 40%, #181A32 80%);
}
.reqired-modal.rank-card.rank-8{
    background: linear-gradient(180deg, #963126 20%, #963126 40%, #181A32 80%);
}
.reqired-modal.rank-card.rank-9{
    background: linear-gradient(180deg, #FF7300 20%, #FF7300 40%, #181A32 80%);
}

.ranks .button.disabled{
    background: #555474;
    color: #b5b4c8;
    font-size: .875rem;
    font-weight: 500;
}

.modal-wrap .modal > .promo-modal__close-button {
    background-color: #ffffff20;
    color: #fff;
    font-size: 1.5rem;
    top: -2rem;
    right: -2rem;
}
.modal-wrap .modal > .promo-modal__close-button:hover {
    background-color: #ffffff30;
}
.promo-modal__bg {
    position: absolute;
    pointer-events: none;
    left: -253px;
    top: -107px;
    z-index: 1;
}
.promo-modal__wrap {
    padding: 1.5rem 2rem 0.5rem 2rem;
    background-color: #fff;
    background: linear-gradient(131.05deg, #301161 37.5%, #ED1D49 91.52%);
    border-radius: 15px;
    z-index: 2;
    position: relative;
    width: 21.5rem;
}
.promo-modal__title {
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    text-align: center;
    margin-bottom: 1.5rem;
}
.promo-modal__banner {
    border-radius: 0.5rem;
    position: relative;
    width: 100%;
    /*height: 5.25rem;*/
}
.promo-modal__banner + .promo-modal__banner {
    margin-top: 1rem;
}
.promo-modal__banner-cond {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    right: 0.5rem;
    top: 0.5rem;
    height: 4.5rem;
    width: 9rem;
}
.promo-modal__banner-cond-label {
    color: #fff;
    font-size: 0.8rem;
}
.promo-modal__banner-cond-text {
    background-color: #FFC660;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.8rem;
    text-align: center;
    font-weight: 900;
    color: #333;
    margin: 0.25rem 0;
}
.promo-modal__banner-cond-hint {
    color: #ffffff;
    font-size: 0.7rem;
}
.promo-modal__banner-img {
    width: 100%;
    object-fit: cover;
    border-radius: 0.5rem;
}
.promo-modal__activate-btn {
    margin-top: 1.5rem;
    background-color: #00C508;
    height: 2.875rem;
    border-radius: 0.5rem;
    position: relative;
    color: #fff;
    font-size: 0.875rem;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.promo-modal__activate-btn:hover {
    background-color: #00C508;
    border-radius: 7px;
}
.promo-modal__activate-icon {
    position: absolute;
    right: 0.25rem;
    top: -0.55rem;
}
.promo-modal__cancel-btn {
    margin-top: 5px;
    width: 100%;
    height: 2.875rem;
    /*border-radius: 0.5rem;*/
    display: flex;
    justify-content: center;
    align-items: center;
    background: none;
    border: none;
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    cursor: pointer;
}
.promo-modal__cancel-btn:hover {
    text-decoration: underline;
}
.promo-modal__promo-texts {
    display: flex;
    flex-flow: column;
    transition: max-height 0.5s, opacity 0.5s;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
}
.promo-modal__promo-texts.expanded {
    max-height: 200px;
    opacity: 1;
}
.promo-modal__promo-texts .promo-description {
    margin: 1rem 0;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-family: Montserrat;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 20px;
    text-align: center;
}
.promo-modal__down-arrow{
    display: flex;
    position: absolute;
    right: 30px;
    top: 50%;
    transition: transform 0.5s;
}
.promo-modal__down-arrow:after{
    content: "";
    width: 8px;
    height: 8px;
    border: white 4px solid;
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
}
.promo-modal__down-arrow.expanded {
    transform: rotate(-180deg);
}

.green-text{
    color: #A7DA94;
}

body.halloween-event::before{
    content: "";
    background-image: url("/img/special_events/halloween/halloween-lt.svg");
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 1;
    top: 0;
    left: calc(((100% - 1230px) / 2) - max(calc((100% - 1230px) / 2), 306px));
    position: absolute;
    z-index: 2;
    width:  max(calc((100% - 1230px) / 2), 306px);
    height: 1000px;
    pointer-events: none;
}
body.light.halloween-event::before {
    background-image: url("/img/special_events/halloween/halloween-lt-light.svg");
}
body.halloween-event::after{
    content: "";
    background-image: url("/img/special_events/halloween/halloween-rt.svg");
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 1;
    top: 0;
    right: calc(((100% - 1030px) / 2) - max(calc((100% - 1030px) / 2), 406px));
    position: absolute;
    z-index: 10;
    width:  max(calc((100% - 1030px) / 2), 406px);
    height: 1000px;
    pointer-events: none;
}
body.light.halloween-event::after {
    background-image: url("/img/special_events/halloween/halloween-rt-light.svg");
}
body.halloween-event #layout-wrap::before{
    content: "";
    background-image: url("/img/special_events/halloween/halloween-lb.svg");
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 1;
    bottom: 0;
    left: calc(((100% - 1230px) / 2) - max(calc((100% - 1230px) / 2), 306px));
    position: absolute;
    z-index: 0;
    width:  max(calc((100% - 1230px) / 2), 306px);
    height: 200px;
    pointer-events: none;
}
body.halloween-event #layout-wrap::after{
    content: "";
    background-image: url("/img/special_events/halloween/halloween-rb.svg");
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 1;
    bottom: 0;
    right: calc(((100% - 1300px) / 2) - max(calc((100% - 1300px) / 2), 306px));
    position: absolute;
    z-index: 0;
    width:  max(calc((100% - 1300px) / 2), 306px);
    height: 200px;
    pointer-events: none;
}
body.halloween-event .logo__image{
    background-image: url("/img/special_events/halloween/logo.svg");
}
body.light.halloween-event .logo__image{
    background-image: url("/img/special_events/halloween/logo-dark.svg");
}
body.halloween-event .menu-button{
    background-image: url("/img/special_events/halloween/eye.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: transparent;
}
body.halloween-event .menu-button .menu-button__line{
    display: none;
}

body.xmass-event::before{
    content: "";
    background-image: url("/img/special_events/xmass/snowflakes-tl.svg");
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 1;
    top: 50px;
    left: calc(((100% - 1230px) / 2) - max(calc((100% - 1230px) / 2), 318px));
    position: absolute;
    z-index: 2;
    width:  max(calc((100% - 1230px) / 2), 318px);
    height: 2000px;
    pointer-events: none;
}
body.light.xmass-event::before {
    filter: contrast(.4);
}
body.xmass-event::after{
    content: "";
    background-image: url("/img/special_events/xmass/snowflakes-tr.svg");
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 1;
    top: 100px;
    right: calc(((100% - 1230px) / 2) - 237px);
    position: absolute;
    z-index: 10;
    width:  237px;
    height: 2100px;
    pointer-events: none;
}
body.light.xmass-event::after {
    filter: contrast(.4);
}
body.xmass-event #layout-wrap::after{
    content: "";
    background-image: url("/img/special_events/xmass/xmass-lb.svg");
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 1;
    bottom: 0;
    left: calc(((100% - 1000px) / 2) - max(calc((100% - 1000px) / 2), 500px));
    position: absolute;
    z-index: 0;
    width:  max(calc((100% - 1000px) / 2), 500px);
    /*height: 400px;*/
    pointer-events: none;
    aspect-ratio: 1;
}
body.xmass-event #layout-wrap::before{
    content: "";
    background-image: url("/img/special_events/xmass/xmass-rb.svg");
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 1;
    bottom: 0;
    right: calc(((100% - 1100px) / 2) - max(calc((100% - 1100px) / 2), 500px));
    position: absolute;
    z-index: 0;
    width:  max(calc((100% - 1100px) / 2), 500px);
    /*height: 400px;*/
    pointer-events: none;
    aspect-ratio: 1;
}
body.xmass-event .logo__image{
    background-image: url("/img/special_events/xmass/logo.svg");
}
body.light.xmass-event .logo__image{
    background-image: url("/img/special_events/xmass/logo-dark.svg");
}
body.xmass-event .menu-button{
    background-image: url("/img/special_events/xmass/Ball_on_the_tree.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: transparent;
}
body.xmass-event .menu-button .menu-button__line{
    display: none;
}