/* cyrillic-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTvWacfw6zH4dthXcyms1lPpC8I_b0juU055qfQOJ0.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTvWacfw6zH4dthXcyms1lPpC8I_b0juU0576fQOJ0.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTvWacfw6zH4dthXcyms1lPpC8I_b0juU055KfQOJ0.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTvWacfw6zH4dthXcyms1lPpC8I_b0juU055afQOJ0.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTvWacfw6zH4dthXcyms1lPpC8I_b0juU0566fQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xGITFCrxG6mA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xGITFA7xG6mA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xGITFCLxG6mA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xGITFCbxG6mA.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xGITFB7xG.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xNIPFCrxG6mA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xNIPFA7xG6mA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xNIPFCLxG6mA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xNIPFCbxG6mA.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xNIPFB7xG.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xUILFCrxG6mA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xUILFA7xG6mA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xUILFCLxG6mA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xUILFCbxG6mA.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xUILFB7xG.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xaIDFCrxG6mA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xaIDFA7xG6mA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xaIDFCLxG6mA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xaIDFCbxG6mA.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat Alternates';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/montserratalternates/v17/mFTiWacfw6zH4dthXcyms1lPpC8I_b0juU0xaIDFB7xG.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
    --font-primary: "Montserrat Alternates", sans-serif;
    --text-xs: 1.2rem;
    --text-sm: 1.4rem;
    --text-base-size: 1.6rem;
    --text-md: 1.8rem;
    --text-lg: 2rem;
    --text-xl: 2.4rem;
    --text-xxl: 2.8rem;
    --container-width: 1110px;
    --space-sm: 1rem;
    --space-md: 2rem;
    --space-lg: 3rem;
    --border-radius-sm: 0.5rem;
    --border-radius: 1rem;
    --border-radius-circle: 50%;
    --border-radius-left: 1rem 0 0 1rem;
    --border-radius-right: 0 1rem 1rem 0;
    --header-height: 8rem
}

*,*::after,*::before {
    box-sizing: inherit
}

* {
    font: inherit
}
:root,
[data-theme=synottip] {
    --color-primary: #6dfdf3;
    --color-primary-dark: #aad9ff;
    --gradient-main: linear-gradient(261.24deg, var(--color-primary) 17.02%, var(--color-primary-dark) 87.64%);
    --gradient-secondary: linear-gradient(212.12deg, var(--color-primary) 20.26%, var(--color-primary-dark) 76.13%);
    --gradient-button: linear-gradient(98.07deg, #14C81F -16.15%, #48E16A 146.12%);
    --gradient-providers-block: linear-gradient(251.73deg, var(--color-primary) -2.29%, var(--color-primary-dark) 115.01%);
    --color-white: #fff;
    --color-gray: #e3e1e1;
    --color-body: #fff;
    --color-text-light: #117770;
    --color-text-dark: #fff;
    --color-heading: #117770;
    --color-link: #F63636;
    --color-link-hover: #F63636;
    --color-anchor-menu-bg: linear-gradient(90deg, #f1fffe 0%, #f6fff0 35.94%, #eefffe 71.88%, #fff9ee 100%);
    --color-anchor-menu-primary: #117770;
    --color-anchor-menu-secondary: #2196f3;
    --color-module-text: #117770;
    --color-body-bg: linear-gradient(90deg, #f1fffe 0%, #f6fff0 35.94%, #eefffe 71.88%, #fff9ee 100%);
    box-shadow: 0 1px 10px #039c9333;
    ;
    --color-faq-bg: #292935;
    --color-cons-bg: #292935;
    --color-cons-text: #fff;
    --color-cons-title: #fff;
    --color-market-switcher-bg: #0645D0;
    --color-market-switcher-text: var(--color-text-light);
    --color-table-bg: #ffffff99;
    --color-table-text: rgb(57 62 88);
    --color-table-sep: #4e4cbc;
    --color-upper-footer-bg: linear-gradient(90deg, #ddf4f3 0%, #e3f1d7 35.94%, #d5f3f1 71.88%, #fff3d9 100%);
    --color-lower-footer-bg: linear-gradient(90deg, #ddf4f3 0%, #e3f1d7 35.94%, #d5f3f1 71.88%, #fff3d9 100%);
    --color-footer-text: #117770;
    --color-slot-text: var(--color-text-dark);
    --logo-width: 100px;
    --logo-height: auto;
    --header-menu-gap: 1.6rem;
    --page404-text-color: #FFF
}
:root {
    --stb-font-primary: "Beaufort for LOL", georgia, serif;
    --stb-font-helper: "Colus", georgia, serif;
    --stb-transition-time: .2s;
    --stb-sidebars-transition-time: .5s;
    --stb-animation-rotation-time: 3s;
    --stb-container-padding: 20px;
    --stb-game-page-container-padding: 20px;
    --stb-gamification-container-inner-width: 1264px;
    --stb-gamification-container: calc(var(--stb-gamification-container-inner-width) + var(--stb-container-padding) * 2);
    --stb-safe-area-inline-start: env(safe-area-inset-left);
    --stb-safe-area-inline-end: env(safe-area-inset-right);
    --stb-page-content-width: 800px;
    --stb-page-content-padding-bottom: 100px;
    --stb-page-indent-padding-top: 20px;
    --stb-page-indent-s-padding-top: 28px;
    --stb-page-indent-padding-bottom: 40px;
    --stb-games-gap: 12px;
    --stb-page-grid-row-gap: 28px;
    --stb-game-page-header-height: 52px;
    --stb-game-page-header-closed-height: 32px;
    --stb-header-height: 60px;
    --stb-sub-menu-height: 48px;
    --stb-navigation-bottom-height: 60px;
    --stb-sidebar-expanded-width: 232px;
    --stb-sidebar-current-width: var(--stb-sidebar-expanded-width);
    --stb-sidebar-collapsed-width: 72px;
    --stb-modal-burger-menu-max-width: 420px;
    --stb-modal-user-menu-max-width: 360px;
    --stb-scrollbar-width: 6px;
    --stb-scrollbar-height: 6px;
    --stb-scrollbar-visibility: initial;
    --stb-scrollbar-thumb-color: rgb(var(--stb-neutral-700));
    --stb-scrollbar-track-color: rgb(var(--stb-white) / 0);
    --stb-scrollbar-border-radius: 6px;
    --stb-scrollbar-width-keyword: none;
    --stb-scroller-correct-scrollbar: 8px;
    --stb-common-scroll-margin-top: calc(var(--stb-header-height) + 40px);
    --stb-modal-dialog-panel-max-width: 540px;
    --stb-modal-dialog-inner-vertical-padding: 24px;
    --stb-modal-dialog-action-bottom-padding: 40px;
    --stb-modal-dialog-body-bottom-padding: 40px;
    --stb-modal-dialog-border-radius: 12px;
    --stb-spinner-loader-inset: 0;
    --stb-spinner-loader-border-radius: 8px;
    --stb-thumbnail-border-radius: 14px;
    --stb-thumbnail-label-opacity: 1;
    --stb-thumbnail-actions-opacity: 0;
    --stb-thumbnail-actions-bottom-position: 100%;
    --stb-thumbnail-hover-time: .8s;
    --stb-thumbnail-favorite-block-opacity: 0;
    --stb-title-grid-template-columns: .5fr 1fr minmax(0, .5fr);
    --stb-text-transform-uppercase: uppercase
}

:root[dir=rtl] {
    --stb-safe-area-inline-start: env(safe-area-inset-right);
    --stb-safe-area-inline-end: env(safe-area-inset-left)
}

@media screen and (min-width:412px) {
    :root {
        --stb-modal-user-menu-max-width: 320px
    }
}

@media screen and (min-width:768px) {
    :root {
        --stb-modal-dialog-panel-max-width: 580px;
        --stb-modal-dialog-inner-vertical-padding: 70px
    }
}

@media screen and (min-width:1280px) {
    :root {
        --stb-game-page-container-padding: 60px;
        --stb-page-indent-s-padding-top: 40px;
        --stb-games-gap: 12px;
        --stb-game-page-header-height: 56px;
        --stb-header-height: 64px;
        --stb-sub-menu-height: 0px
    }
}

:root {
    --stb-black: 9 8 12;
    --stb-white: 255 255 255;
    --stb-neutral-50: 235 236 237;
    --stb-neutral-100: 211 213 214;
    --stb-neutral-150: 189 192 194;
    --stb-neutral-200: 149 154 157;
    --stb-neutral-300: 126 132 136;
    --stb-neutral-400: 96 103 109;
    --stb-neutral-500: 71 80 85;
    --stb-neutral-600: 61 70 77;
    --stb-neutral-700: 53 63 69;
    --stb-neutral-800: 40 50 57;
    --stb-neutral-900: 28 39 46;
    --stb-neutral-940: 22 31 37;
    --stb-neutral-960: 19 27 32;
    --stb-neutral-990: 15 23 28;
    --stb-neutral-1000: 13 18 20;
    --stb-brand-50: 250 249 255;
    --stb-brand-100: 245 243 251;
    --stb-brand-150: 211 211 211;
    --stb-brand-160: 55 248 128;
    --stb-brand-170: 77 191 193;
    --stb-brand-200: 32 188 110;
    --stb-brand-250: 77 144 193;
    --stb-brand-300: 32 115 127;
    --stb-brand-400: 38 167 106;
    --stb-brand-500: 15 87 113;
    --stb-brand-510: 5 38 50;
    --stb-brand-600: 255 210 121;
    --stb-brand-700: 187 141 76;
    --stb-brand-800: 158 117 56;
    --stb-brand-850: 136 101 57;
    --stb-brand-900: 102 73 30;
    --stb-brand-950: 144 115 76;
    --stb-brand-960: 133 114 88;
    --stb-brand-1000: 130 102 145;
    --stb-brand-1100: 45 30 53;
    --stb-brand-1200: 94 56 114;
    --stb-brand-1300: 32 17 40;
    --stb-brand-1400: 26 11 34;
    --stb-brand-1500: 223 181 136;
    --stb-brand-1600: 107 63 31;
    --stb-brand-1700: 32 24 21;
    --stb-brand-1800: 33 25 18;
    --stb-brand-1900: 23 17 10;
    --stb-brand-2000: 24 22 19;
    --stb-green-450: 134 186 66;
    --stb-green-500: 112 176 31;
    --stb-green-600: 31 164 96;
    --stb-green-700: 100 143 43;
    --stb-violet-100: 203 64 222;
    --stb-red-100: 230 106 135;
    --stb-red-200: 255 0 0;
    --stb-red-300: 255 61 0;
    --stb-red-500: 231 106 136;
    --stb-red-600: 201 51 51;
    --stb-yellow-500: 255 184 0;
    --stb-texture-waves: url(../images/texture/waves.png);
    --stb-texture-waves-10: url(../images/texture/waves-10.png);
    --stb-gradient-100: linear-gradient(0deg, #0d5331 0%, #26a76a 11.41%, #277b4f 33.91%, #37f880 65.08%, #20bc6e 88.49%, #0d5331 100%);
    --stb-gradient-200: linear-gradient(180deg, rgb(var(--stb-brand-1100)) 0%, rgb(var(--stb-brand-1000)) 34.88%, rgb(var(--stb-brand-1300)) 58.51%, #5e3872 90.51%, rgb(var(--stb-brand-1400)) 100%);
    --stb-gradient-300: linear-gradient(180deg, rgb(var(--stb-brand-700)) 0%, rgb(var(--stb-brand-600)) 47.91%, rgb(var(--stb-brand-800)) 53.01%, rgb(var(--stb-brand-900)) 100%);
    --stb-gradient-400: linear-gradient(180deg, rgb(var(--stb-brand-1500)) 0%, rgb(var(--stb-brand-1600)) 49.51%, rgb(var(--stb-brand-1700)) 100%);
    --stb-gradient-500: linear-gradient(180deg, rgb(var(--stb-neutral-900)) 0%, rgb(var(--stb-brand-1900)) 78.41%, rgb(var(--stb-brand-1800)) 100%);
    --stb-gradient-600: linear-gradient(180deg, rgb(var(--stb-neutral-1000)) 0%, rgb(var(--stb-neutral-990)) 41.8%, rgb(var(--stb-neutral-900)) 81.05%, rgb(var(--stb-neutral-800)) 100%);
    --stb-gradient-700: linear-gradient(0deg, rgb(var(--stb-neutral-990)) 0%, rgb(var(--stb-neutral-990)) 15.49%, rgb(var(--stb-neutral-800)) 83.35%, rgb(var(--stb-neutral-900)) 100%);
    --stb-gradient-800: linear-gradient(180deg, rgb(var(--stb-neutral-900)) 40%, rgb(var(--stb-neutral-990)) 100%);
    --stb-gradient-900: linear-gradient(180deg, rgb(var(--stb-neutral-900)) 9.55%, rgb(var(--stb-brand-2000)) 86.56%, rgb(var(--stb-brand-1800)) 100%);
    --stb-gradient-1000: linear-gradient(180deg, #ba8c48 0%, rgb(var(--stb-brand-850)) 100%);
    --stb-leadebord-number-circle-silver: linear-gradient(180deg, #677279 0%, #8e99a0 47.91%, #4c565c 53.01%, #424d54 100%);
    --stb-leadebord-number-circle-bronze: linear-gradient(180deg, #906545 0%, #b48a6b 47.91%, #7a5032 53.01%, #673b1b 100%);
    --stb-gradient-accent: var(--stb-gradient-300);
    --stb-gradient-accent-hover: linear-gradient(rgb(var(--stb-brand-600) / .29), rgb(var(--stb-brand-600) / .29)), var(--stb-gradient-accent);
    --stb-text-primary: rgb(var(--stb-brand-700));
    --stb-text-secondary: rgb(var(--stb-brand-960));
    --stb-text-contrast-primary: rgb(var(--stb-neutral-100));
    --stb-text-contrast-secondary: rgb(var(--stb-neutral-200));
    --stb-text-accent: var(--stb-gradient-accent);
    --stb-text-accent-hover: var(--stb-gradient-accent-hover);
    --stb-button-primary: var(--stb-gradient-100);
    --stb-button-primary-hover: linear-gradient(0deg, rgb(55 248 128 / .3) 0%, rgb(55 248 128 / .3) 100%), var(--stb-gradient-100);
    --stb-button-primary-active: linear-gradient(180deg, #0d5331 0%, #26a76a 11.41%, #277b4f 33.91%, #37f880 65.08%, #20bc6e 88.49%, #0d5331 100%);
    --stb-button-secondary: var(--stb-gradient-200);
    --stb-button-secondary-hover: linear-gradient(0deg, rgb(203 64 222 / .2) 0%, rgb(203 64 222 / .2) 100%), var(--stb-gradient-200);
    --stb-button-secondary-active: linear-gradient(0deg, rgb(var(--stb-brand-1100)) 0%, rgb(var(--stb-brand-1000)) 34.88%, rgb(var(--stb-brand-1300)) 58.51%, #5e3872 90.51%, rgb(var(--stb-brand-1400)) 100%);
    --stb-button-tertiary: var(--stb-gradient-700);
    --stb-button-tertiary-hover: linear-gradient(0deg, rgb(var(--stb-brand-250) / .2) 0%, rgb(var(--stb-brand-250) / .2) 100%), var(--stb-gradient-700);
    --stb-button-tertiary-active: linear-gradient(180deg, rgb(var(--stb-neutral-990)) 0%, rgb(var(--stb-neutral-990)) 15.49%, rgb(var(--stb-neutral-800)) 83.35%, rgb(var(--stb-neutral-900)) 100%);
    --stb-button-tertiary-shadow: -2px 2px 2px 0 rgb(255 255 255 / .05) inset, 2px -2px 0 0 rgb(22 29 32) inset;
    --stb-button-disable: rgb(var(--stb-brand-300));
    --stb-button-text-bright: rgb(var(--stb-white));
    --stb-button-text-middle: rgb(var(--stb-neutral-150));
    --stb-button-text-dark: rgb(var(--stb-brand-950));
    --stb-link-primary: rgb(var(--stb-brand-600));
    --stb-link-secondary: rgb(var(--stb-green-600));
    --stb-link-tertiary: rgb(var(--stb-brand-960));
    --stb-link-accent: rgb(var(--stb-green-600));
    --stb-link-alert: rgb(var(--stb-red-100));
    --stb-link-invert-secondary: rgb(var(--stb-brand-700));
    --stb-bg-primary: rgb(var(--stb-neutral-1000));
    --stb-bg-secondary: var(--stb-gradient-500);
    --stb-bg-tertiary: rgb(var(--stb-neutral-900));
    --stb-bg-fourth: rgb(var(--stb-neutral-960));
    --stb-bg-popup: var(--stb-gradient-800);
    --stb-bg-footer: var(--stb-gradient-900);
    --stb-bg-contrast-primary: rgb(var(--stb-neutral-800));
    --stb-bg-contrast-secondary: rgb(var(--stb-neutral-900));
    --stb-bg-contrast-tertiary: rgb(var(--stb-neutral-990));
    --stb-input-fill: rgb(var(--stb-neutral-990));
    --stb-input-fill-hover: rgb(var(--stb-neutral-990));
    --stb-input-fill-selected: rgb(var(--stb-neutral-900));
    --stb-input-stroke: var(--stb-gradient-accent);
    --stb-input-stroke-hover: var(--stb-gradient-accent-hover);
    --stb-input-stroke-selected: var(--stb-gradient-accent-hover);
    --stb-icon-100: rgb(var(--stb-brand-700));
    --stb-icon-400: rgb(var(--stb-brand-800));
    --stb-icon-800: rgb(var(--stb-brand-900));
    --stb-icon-1000: rgb(var(--stb-brand-950));
    --stb-functional-done: rgb(var(--stb-green-500));
    --stb-functional-warning: rgb(var(--stb-yellow-500));
    --stb-functional-error: rgb(var(--stb-red-600));
    --stb-functional-alert: rgb(var(--stb-red-100));
    --stb-functional-info: rgb(var(--stb-brand-500));
    --stb-button-text-bright-filter: invert(100%) sepia(0%) saturate(7487%) hue-rotate(126deg) brightness(108%) contrast(105%);
    --stb-button-text-middle-filter: invert(59%) sepia(22%) saturate(499%) hue-rotate(207deg) brightness(89%) contrast(87%);
    --stb-text-secondary-filter: invert(64%) sepia(11%) saturate(970%) hue-rotate(207deg) brightness(85%) contrast(83%);
    --stb-text-primary-filter: invert(30%) sepia(9%) saturate(1781%) hue-rotate(207deg) brightness(97%) contrast(89%);
    --stb-white-filter: brightness(0) invert(1);
    --stb-brand-500-filter: invert(58%) sepia(23%) saturate(7495%) hue-rotate(217deg) brightness(103%) contrast(98%);
    --stb-brand-950-filter: invert(47%) sepia(50%) saturate(343%) hue-rotate(355deg) brightness(88%) contrast(88%);
    --stb-icon-400-filter: invert(45%) sepia(71%) saturate(346%) hue-rotate(357deg) brightness(91%) contrast(94%);
    --stb-icon-800-filter: invert(27%) sepia(32%) saturate(914%) hue-rotate(357deg) brightness(96%) contrast(90%);
    --stb-primary-text-shadow: 0 1px 3px rgb(0 0 0 / .65);
    --stb-shadow-primary: 0 6px 16px rgb(var(--stb-neutral-990) / .8);
    --stb-filter-drop-shadow: drop-shadow(-1px 6px 6px rgb(37 14 61 / .1))
}

:root {
    --stb-tournament-dropdown-padding: 8px;
    --stb-tournament-card-radius: 12px;
    --stb-tournament-leaderbord-row-radius: 0;
    --stb-tournament-details-list-gap: 4px 16px;
    --stb-tournament-details-list-font-size: 12px;
    --stb-tournament-dropdown-grid-template-columns: none;
    --stb-tournament-dropdown-container-gap: 24px;
    --stb-tournament-description-padding: 20px 16px 16px;
    --stb-tournament-description-details-gap: 8px;
    --stb-tournament-banner-grid-template-columns: 1fr;
    --stb-tournament-banner-title-font-size: 16px;
    --stb-tournament-banner-title-line-height: 1.3;
    --stb-tournament-prize-font-size: 20px;
    --stb-tournament-banner-image-width: 564px;
    --stb-tournament-banner-figure-height: 132px
}

:root {
    --stb-base-shop-card-height: 260px;
    --stb-large-shop-card-height: 310px;
    --stb-scroller-shop-card-width: 240px;
    --stb-shop-card-radius: 12;
    --stb-shop-items-grid-gap: 12px;
    --stb-bonus-crab-card-width: 234px;
    --stb-freebets-columns: 2;
    --stb-free-spins-columns: 1;
    --stb-bonus-money-columns: 2;
    --stb-bonus-crab-columns: auto-fill;
    --stb-bonus-crab-column-size: minmax(var(--stb-bonus-crab-card-width), 1fr);
    --stb-card-bg-size: auto 150%
}

@media screen and (min-width:768px) {
    :root {
        --stb-bonus-money-columns: 3;
        --stb-free-spins-columns: 2;
        --stb-freebets-columns: 3;
        --stb-bonus-crab-columns: 3;
        --stb-bonus-crab-column-size: 1fr
    }
}

@media screen and (min-width:1280px) {
    :root {
        --stb-bonus-money-columns: 4;
        --stb-bonus-crab-columns: 4;
        --stb-free-spins-columns: 3;
        --stb-freebets-columns: 4
    }
}

:root {
    --stb-challenges-intro-actions-flex-direction: column;
    --stb-challenges-intro-actions-align-items: flex-start;
    --stb-challenge-header-flex-direction: column;
    --stb-mission-image-column-width: 72px;
    --stb-challenge-composite-list-columns-amount: 1;
    --stb-challenge-completed-header-display: contents;
    --stb-challenge-completed-countdown-order: 1
}

:root {
    --stb-cookie-banner-border-radius: 12px;
    --stb-cookie-banner-box-shadow: var(--stb-shadow-primary);
    --stb-cookie-banner-scroller-border-radius: 20px;
    --stb-cookie-banner-scrollbar-track-bg: rgb(var(--stb-brand-100));
    --stb-cookie-banner-scrollbar-thumb-bg: var(--stb-bg-fourth);
    --stb-cookie-banner-text-primary: var(--stb-text-primary);
    --stb-cookie-banner-text-secondary: var(--stb-text-secondary);
    --stb-cookie-banner-bg-primary: var(--stb-bg-primary);
    --stb-cookie-banner-bg-tertiary: var(--stb-bg-tertiary);
    --stb-cookie-banner-border: var(--stb-bg-primary);
    --stb-cookie-table-border: var(--stb-bg-tertiary);
    --stb-cookie-banner-link-color: var(--stb-link-accent);
    --stb-cookie-banner-link-color-hover: var(--stb-link-tertiary);
    --stb-cookie-banner-action-border-radius: 4px;
    --stb-cookie-banner-action-bg-primary: var(--stb-link-accent);
    --stb-cookie-banner-action-bg-primary-hover: rgb(var(--stb-brand-200));
    --stb-cookie-banner-action-color-primary: var(--stb-button-text-bright);
    --stb-cookie-banner-action-color-primary-hover: var(--stb-button-text-bright);
    --stb-cookie-banner-action-bg-secondary: var(--stb-bg-tertiary);
    --stb-cookie-banner-action-bg-secondary-hover: rgb(var(--stb-neutral-800));
    --stb-cookie-banner-action-color-secondary: var(--stb-button-text-middle);
    --stb-cookie-banner-action-color-secondary-hover: var(--stb-button-text-bright);
    --stb-cookie-banner-switcher-disabled-pin-bg: var(--stb-link-accent);
    --stb-cookie-banner-switcher-disabled-track-bg: var(--stb-bg-primary);
    --stb-cookie-banner-switcher-disabled-svg-color: var(--stb-text-contrast-primary);
    --stb-cookie-banner-switcher-selected-pin-bg: var(--stb-link-accent);
    --stb-cookie-banner-switcher-selected-track-bg: var(--stb-bg-primary);
    --stb-cookie-banner-switcher-selected-svg-color: var(--stb-text-contrast-primary);
    --stb-cookie-banner-switcher-unselected-pin-bg: rgb(var(--stb-brand-900));
    --stb-cookie-banner-switcher-unselected-track-bg: var(--stb-bg-primary);
    --stb-cookie-banner-switcher-unselected-svg-color: var(--stb-text-contrast-primary)
}

.stb-overlay-container {
    position: fixed
}

.stb-global-overlay-wrapper {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center
}

.stb-overlay-container,
.stb-global-overlay-wrapper {
    z-index: 900;
    top: 0;
    inset-inline-start: 0;
    height: 100%;
    width: 100%;
    pointer-events: none
}

.stb-overlay-container:empty,
.stb-global-overlay-wrapper:empty {
    display: none
}

.stb-overlay-backdrop {
    position: absolute;
    inset: 0;
    z-index: 1000;
    background-color: rgba(var(--stb-neutral-990)/.8);
    opacity: 0;
    transition: opacity .4s cubic-bezier(.25, .8, .25, 1);
    pointer-events: auto;
    -webkit-tap-highlight-color: transparent
}

.stb-overlay-backdrop.stb-overlay-backdrop-showing {
    opacity: 1
}

.stb-overlay-pane {
    position: static;
    z-index: 1000;
    pointer-events: auto
}

*,
*:before,
*:after {
    box-sizing: border-box
}

::-webkit-scrollbar-track {
    background-color: transparent;
    visibility: hidden
}

::-webkit-scrollbar {
    width: 0;
    height: 0;
    visibility: hidden
}

::-webkit-scrollbar-thumb {
    visibility: hidden
}

html,
body {
    height: 100%
}

html {
    min-width: 360px;
    font-family: var(--stb-font-primary);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--stb-text-primary);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    user-select: none
}

html[dir=rtl] {
    --stb-icon-sprite-svg-scale: -1 1
}

html:not([lang=el-gr]) {
    --stb-text-transform-style: var(--stb-text-transform-uppercase)
}

@supports(scrollbar-width:auto) and (not (selector(::-webkit-scrollbar))) {
    html {
        scrollbar-color: var(--stb-scrollbar-thumb-color) var(--stb-scrollbar-track-color);
        scrollbar-width: var(--stb-scrollbar-width-keyword)
    }
}

@supports(scrollbar-gutter:stable) {
    html {
        scrollbar-gutter: stable
    }
}

body {
    background-color: var(--stb-bg-primary)
}

svg,
img {
    display: block
}

img,
video {
    height: auto;
    max-width: 100%
}

iframe {
    border: 0
}

button {
    margin: 0;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer
}

button:focus-visible {
    outline: 1px dashed rgb(var(--stb-brand-500))
}

button:disabled {
    cursor: default
}

button:focus:not(:focus-visible) {
    outline: none
}

input[type=date]::-webkit-inner-spin-button,
input[type=date]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
    appearance: none
}

input[type=date]::-webkit-date-and-time-value {
    text-align: start;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden
}

input::-webkit-datetime-edit,
input::-webkit-datetime-edit-fields-wrapper,
input::-webkit-datetime-edit-day-field,
input::-webkit-datetime-edit-month-field,
input::-webkit-datetime-edit-year-field,
input::-webkit-datetime-edit-text {
    padding-top: 0;
    padding-bottom: 0
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0
}

input[type=number] {
    -webkit-appearance: textfield;
    appearance: textfield
}

input[type=password]:not(:placeholder-shown) {
    font-family: var(--stb-font-helper)
}

input[type=password]::placeholder {
    font-family: var(--stb-font-primary)
}

a {
    text-decoration: none;
    color: #fff;
}

a:focus-visible {
    outline: 1px dashed var(--stb-link-accent)
}

a:focus:not(:focus-visible) {
    outline: none
}

[tabindex="-1"]:focus {
    outline: none
}



.page-indent--s {
    padding-top: var(--stb-page-indent-s-padding-top)
}

.page-grid {
    display: grid;
    grid-row-gap: var(--stb-page-grid-row-gap)
}

.page-content-width {
    max-width: var(--stb-page-content-width);
    margin: 0 auto
}

.grid-games-wrapper {
    position: relative;
    display: block
}

.grid-games-wrapper__action {
    position: absolute;
    inset-inline-start: 0;
    inset-inline-end: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    height: 0;
    padding: 0
}

.grid-games {
    position: relative;
    display: grid;
    grid-gap: var(--stb-games-gap);
    --stb-grid-column-count: var(--stb-custom-grid-column-count, 3);
    --stb-grid-column-dimension: calc(100% / var(--stb-custom-grid-column-count, 3));
    grid-template-columns: repeat(var(--stb-grid-column-count), calc(calc(100%/var(--stb-grid-column-count)) - (var(--stb-games-gap) - (var(--stb-games-gap)/var(--stb-grid-column-count)))))
}

@media screen and (min-width:768px) {
    .grid-games {
        --stb-grid-column-count: var(--stb-custom-grid-column-count, 6);
        --stb-grid-column-dimension: calc(100% / var(--stb-custom-grid-column-count, 6))
    }
}

@media screen and (min-width:1920px) {
    .grid-games {
        --stb-grid-column-count: var(--stb-custom-grid-column-count, 8);
        --stb-grid-column-dimension: calc(100% / var(--stb-custom-grid-column-count, 8))
    }
}

.grid-games:focus-visible {
    outline: 1px dashed rgb(var(--stb-brand-500))
}

.grid-games--scrollable {
    max-width: 1920px;
    margin-inline-end: auto;
    margin-bottom: -6px;
    margin-inline-start: auto;
    padding: 2px var(--stb-container-padding) 6px;
    overflow: auto hidden;
    scroll-snap-type: var(--stb-scroll-snap-type, x mandatory);
    scroll-padding-inline-start: var(--stb-container-padding);
    scroll-behavior: smooth
}

@supports(-webkit-hyphens:none) {
    html[dir=rtl] .grid-games--scrollable:after {
        display: block;
        height: 1px;
        width: calc(var(--stb-container-padding) - var(--stb-games-gap));
        content: ""
    }

    @media(orientation:landscape) {
        html[dir=rtl] .grid-games--scrollable:after {
            --stb-max-inline-end-indentation: max(var(--stb-safe-area-inline-end), var(--stb-container-padding));
            width: calc(var(--stb-max-inline-end-indentation) - var(--stb-games-gap))
        }
    }
}

.grid-games--scrollable:not(.no-custom-scrollbar) {
    --stb-scrollbar-width-keyword: thin
}

@supports(scrollbar-width:auto) {
    .grid-games--scrollable:not(.no-custom-scrollbar) {
        scrollbar-color: var(--stb-scrollbar-thumb-color) var(--stb-scrollbar-track-color);
        scrollbar-width: var(--stb-scrollbar-width-keyword)
    }
}

@media(orientation:landscape) {
    .grid-games--scrollable {
        padding-inline-start: max(var(--stb-safe-area-inline-start), var(--stb-container-padding));
        padding-inline-end: max(var(--stb-safe-area-inline-end), var(--stb-container-padding))
    }
}

@media(orientation:landscape) {
    .grid-games--scrollable {
        scroll-padding-inline-start: max(var(--stb-safe-area-inline-start), var(--stb-container-padding))
    }
}

.grid-games__item {
    position: relative;
    scroll-snap-align: start
}

.grid-games--row-1,
.grid-games--row-2 {
    grid-template-columns: repeat(var(--stb-grid-column-count), calc(var(--stb-custom-grid-column-dimension, var(--stb-grid-column-dimension)) - (var(--stb-games-gap) - (var(--stb-games-gap)/var(--stb-grid-column-count)))));
    grid-auto-columns: calc(var(--stb-custom-grid-column-dimension, var(--stb-grid-column-dimension)) - (var(--stb-games-gap) - (var(--stb-games-gap)/var(--stb-grid-column-count))));
    grid-auto-flow: column;
    grid-template-rows: repeat(var(--stb-grid-rows-count), 1fr)
}

.grid-games--row-1 {
    --stb-grid-rows-count: 1
}

.grid-games--row-2 {
    --stb-grid-rows-count: 2
}

.grid-games--bot-gradient:after {
    position: absolute;
    bottom: 0;
    inset-inline-start: 0;
    inset-inline-end: 0;
    display: block;
    width: 100%;
    height: 120px;
    content: "";
    -webkit-mask-image: linear-gradient(to bottom, rgb(var(--stb-white)/0) 0, var(--stb-bg-primary) 60px);
    mask-image: linear-gradient(to bottom, rgb(var(--stb-white)/0) 0, var(--stb-bg-primary) 60px);
    background-color: var(--stb-bg-primary)
}

:root {
    --stb-checkbox-border-color: var(--stb-icon-1000)
}

.form-checkbox__indicator {
    width: 24px;
    height: 24px;
    border: 2px solid var(--stb-checkbox-border-color);
    border-radius: 4px;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-origin: border-box;
    background-clip: padding-box;
    transition: border var(--stb-transition-time)
}

.form-checkbox__text {
    margin: auto 0;
    font-size: 12px;
    line-height: 1.4;
    color: var(--stb-text-secondary)
}

.form-checkbox__body {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: max-content;
    align-items: start;
    gap: 10px;
    cursor: pointer
}

@media(hover:hover) and (pointer:fine) {
    .form-checkbox__body:hover {
        --stb-checkbox-border-color: var(--stb-icon-100)
    }
}

.form-checkbox__body:active {
    --stb-checkbox-border-color: var(--stb-icon-100)
}

.form-checkbox__input:checked+.form-checkbox__body .form-checkbox__indicator {
    --stb-checkbox-border-color: var(--stb-icon-100);
    background-image: url(../assets/icons/icons-color/checkbox-checked.png)
}

.form-checkbox__input.ng-touched.ng-invalid+.form-checkbox__body .form-checkbox__indicator {
    --stb-checkbox-border-color: var(--stb-functional-alert)
}

.stb-input-errors,
.stb-input-hints,
.stb-form-errors {
    display: block;
    margin-top: var(--stb-error-hint-margin-top, 8px);
    font-size: 12px
}

.stb-input-errors,
.stb-form-errors {
    color: var(--stb-functional-alert)
}

.stb-input-hints {
    color: var(--stb-text-primary)
}

.stb-input-hint.is-invalid {
    color: var(--stb-functional-alert)
}

.stb-input-hint,
.stb-input-error,
.stb-form-error,
.stb-input-hint p,
.stb-input-error p,
.stb-form-error p {
    display: inline
}

.stb-input-hint:not(:last-child) p:after,
.stb-input-error:not(:last-child) p:after,
.stb-form-error:not(:last-child) p:after {
    content: ", "
}

:root {
    --stb-input-icon: linear-gradient(transparent, transparent);
    --stb-input-icon-size: 16px;
    --stb-input-icon-position: 16px;
    --stb-input-background-color: var(--stb-input-fill);
    --stb-input-border: var(--stb-input-stroke);
    --stb-input-border-width: 2px;
    --stb-input-radius: 4px;
    --stb-input-text-color: var(--stb-text-primary)
}

input:-webkit-autofill,
select:-webkit-autofill {
    box-shadow: inset 0 0 0 52px var(--stb-input-background-color);
    border-image-source: var(--stb-input-border);
    border-image-slice: 1;
    border-image-width: var(--stb-input-border-width);
    -webkit-background-clip: text;
    -webkit-text-fill-color: var(--stb-input-text-color);
    caret-color: var(--stb-input-text-color);
    -webkit-clip-path: xywh(0 0 100% 100% round var(--stb-input-radius) var(--stb-input-radius));
    clip-path: xywh(0 0 100% 100% round var(--stb-input-radius) var(--stb-input-radius))
}

input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    --stb-input-border: linear-gradient(#d1a35b, #fdd078 47.91%, #b98e4a 53.01%, #937238)
}

.input-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    overflow: hidden
}

.form-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    align-items: start
}

.form-control {
    display: grid;
    gap: 8px;
    font-size: 16px;
    line-height: 1.2
}

.form-control__container {
    position: relative;
    display: flex
}

.form-control__toggle {
    position: absolute;
    top: 50%;
    inset-inline-end: var(--stb-input-icon-position);
    transform: translateY(-50%);
    width: var(--stb-input-icon-size);
    height: var(--stb-input-icon-size);
    padding: 0;
    border: none;
    color: var(--stb-text-secondary);
    background-color: transparent;
    outline: none;
    cursor: pointer
}

.form-control__label {
    display: block;
    width: 100%;
    height: 14px;
    font-size: 12px;
    line-height: 1.2;
    color: var(--stb-text-secondary);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.form-control__input,
.form-control__select {
    display: block;
    width: 100%;
    height: 52px;
    color: var(--stb-input-text-color);
    transition: color var(--stb-transition-time);
    background-image: var(--stb-input-icon), linear-gradient(var(--stb-input-background-color), var(--stb-input-background-color)), var(--stb-input-border);
    background-size: var(--stb-input-icon-size) var(--stb-input-icon-size), cover, cover, cover;
    background-position: center right var(--stb-input-icon-position), 0 0, 0 0, 0 0;
    background-clip: border-box, padding-box, border-box, border-box;
    background-origin: border-box;
    background-repeat: no-repeat;
    border: var(--stb-input-border-width) solid transparent;
    border-radius: var(--stb-input-radius);
    outline: none;
    -webkit-appearance: none;
    appearance: none
}

.form-control__input::placeholder,
.form-control__select::placeholder {
    visibility: visible;
    color: var(--stb-text-secondary);
    transition: color var(--stb-transition-time)
}

@media(hover:hover) and (pointer:fine) {

    .form-control__input:hover,
    .form-control__select:hover {
        --stb-input-background-color: var(--stb-input-fill-hover);
        --stb-input-border: var(--stb-input-stroke-hover);
        color: var(--stb-input-text-color)
    }

    .form-control__input:hover::placeholder,
    .form-control__select:hover::placeholder {
        color: var(--stb-input-text-color)
    }
}

.form-control__input:focus,
.form-control__select:focus {
    --stb-input-background-color: var(--stb-input-fill-selected);
    --stb-input-border: var(--stb-input-stroke-selected);
    --stb-input-text-color: var(--stb-text-contrast-primary)
}

.form-control__input:disabled,
.form-control__select:disabled {
    opacity: .3;
    cursor: default;
    pointer-events: none
}

html[dir=rtl] .form-control__input,
html[dir=rtl] .form-control__select {
    background-position: center left var(--stb-input-icon-position), 0 0, 0 0, 0 0
}

.form-control__select {
    --stb-input-icon: url(../assets/icons/icons-color/select.svg);
    padding: 14px;
    padding-inline-end: 38px;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.form-control__select--placeholder.ng-pristine {
    color: var(--stb-text-secondary)
}

.form-control__input {
    padding: 14px;
    cursor: text;
    text-align: start
}

.form-control__input:placeholder-shown {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.form-control__input.ng-touched.ng-valid+.form-control__toggle {
    color: var(--stb-icon-400)
}

.form-control__input.ng-touched.ng-invalid:not(:focus, .form-control__input--no-error-state) {
    color: var(--stb-functional-alert)
}

.form-control__input.ng-touched.ng-invalid+.form-control__toggle {
    color: var(--stb-icon-400)
}

.form-control__input--password {
    padding-inline-end: 40px
}

html[dir=rtl] .form-control__input--password {
    direction: ltr;
    padding-inline-start: 40px;
    padding-inline-end: 16px;
    text-align: end
}

html[dir=rtl] .form-control__input--phone {
    direction: ltr;
    padding-inline-end: 16px;
    text-align: end
}

html[dir=rtl] .form-control__input--phone.form-control__input--validation-icon:not(:focus) {
    padding-inline-start: 40px
}

.form-control__input--untouched.ng-untouched {
    color: var(--stb-text-secondary)
}

.form-control__input--validation-icon:not(:focus),
.form-control__input--validation-error:not(:focus),
.form-control__input--optional:not(:focus) {
    padding-inline-end: 40px
}

.form-control__input--validation-icon.ng-touched.ng-invalid:not(:focus),
.form-control__input--validation-error.ng-touched.ng-invalid:not(:focus),
.form-control__input--optional.ng-touched.ng-invalid:not(:focus) {
    --stb-input-icon: url(../assets/icons/icons-color/input-invalid.svg)
}

.form-control__input--validation-icon.ng-touched.ng-valid:not(:focus) {
    --stb-input-icon: url(../assets/icons/icons-color/input-valid.svg)
}

.form-control__input--optional.ng-valid:not(:focus, :placeholder-shown, .ng-pristine) {
    --stb-input-icon: url(../assets/icons/icons-color/input-valid.svg)
}

.form-control--loading {
    position: relative
}

.form-control--loading .form-control__input,
.form-control--loading .form-control__select {
    --stb-input-icon: url(../assets/icons/icons-color/loading-animated.svg);
    padding-inline-end: 40px
}

.mobile-placeholder-imitation {
    position: absolute;
    inset: 0;
    padding: 16px;
    padding-inline-end: 38px;
    line-height: 18px;
    color: var(--stb-text-secondary);
    background-image: var(--stb-input-icon), linear-gradient(var(--stb-input-background-color), var(--stb-input-background-color)), var(--stb-input-border);
    background-origin: border-box;
    background-position: center right var(--stb-input-icon-position), 0 0, 0 0, 0 0;
    background-size: var(--stb-input-icon-size) var(--stb-input-icon-size), cover, cover, cover;
    background-clip: border-box, padding-box, border-box, border-box;
    background-repeat: no-repeat;
    border: var(--stb-input-border-width) solid transparent;
    border-radius: var(--stb-input-radius);
    transition: color var(--stb-transition-time);
    cursor: text;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

@media(hover:hover) and (pointer:fine) {
    .mobile-placeholder-imitation:hover {
        --stb-input-background-color: var(--stb-input-fill-hover);
        --stb-input-border: var(--stb-input-stroke-hover);
        color: var(--stb-input-text-color)
    }
}

.form-control__input:disabled+.mobile-placeholder-imitation {
    opacity: .3;
    cursor: default;
    pointer-events: none
}

.form-control__container:not(.is-android):focus-within .mobile-placeholder-imitation {
    opacity: 0;
    pointer-events: none
}

.form-control__input--validation-icon.ng-touched.ng-invalid:not(:focus)+.mobile-placeholder-imitation,
.form-control__input--validation-error.ng-touched.ng-invalid:not(:focus)+.mobile-placeholder-imitation,
.form-control__input--validation-optional.ng-touched.ng-invalid:not(:focus)+.mobile-placeholder-imitation {
    --stb-input-icon: url(../assets/icons/icons-color/input-invalid.svg)
}

.mobile-input-imitation:disabled {
    opacity: 0
}

html[dir=rtl] .mobile-input-imitation {
    text-align: end
}

html[dir=rtl] .mobile-input-imitation::-webkit-date-and-time-value {
    margin: 0;
    text-align: inherit
}

.search-control {
    height: 52px;
    display: flex;
    align-items: stretch;
    color: var(--stb-input-text-color);
    transition: color var(--stb-transition-time);
    background-image: var(--stb-input-icon), linear-gradient(var(--stb-input-background-color), var(--stb-input-background-color)), var(--stb-input-border);
    background-size: var(--stb-input-icon-size) var(--stb-input-icon-size), cover, cover, cover;
    background-position: center right var(--stb-input-icon-position), 0 0, 0 0, 0 0;
    background-clip: border-box, padding-box, border-box, border-box;
    background-origin: border-box;
    background-repeat: no-repeat;
    border: var(--stb-input-border-width) solid transparent;
    border-radius: var(--stb-input-radius)
}

@media(hover:hover) and (pointer:fine) {
    .search-control:hover {
        --stb-input-background-color: var(--stb-input-fill-hover);
        --stb-input-border: var(--stb-input-stroke-hover);
        color: var(--stb-input-text-color)
    }

    .search-control:hover .search-control__input::placeholder {
        color: var(--stb-input-text-color)
    }
}

.search-control:focus,
.search-control:focus-within {
    --stb-input-background-color: var(--stb-input-fill-selected);
    --stb-input-border: var(--stb-input-stroke-selected);
    --stb-input-text-color: var(--stb-text-contrast-primary)
}

.search-control__container {
    flex-grow: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 16px;
    cursor: text
}

.search-control__input {
    width: 0;
    flex-grow: 1;
    padding: 16px 0;
    text-align: start;
    font-size: 16px;
    font-weight: 500;
    color: inherit;
    border: none;
    background-color: transparent;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    cursor: text
}

.search-control__input::placeholder {
    visibility: visible;
    color: var(--stb-text-secondary);
    transition: color var(--stb-transition-time)
}

.search-control__input:placeholder-shown {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.search-control__icon {
    color: var(--stb-icon-400)
}

.search-control__clear {
    flex-shrink: 0;
    max-width: 50%;
    margin-inline-start: -8px;
    padding: 16px 16px 16px 0;
    font-weight: 500;
    font-size: 16px
}

:root {
    --stb-radio-background: linear-gradient(var(--stb-input-fill), var(--stb-input-fill));
    --stb-radio-border: var(--stb-input-stroke)
}

.form-radio-group {
    display: grid;
    grid-auto-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px
}

.form-radio--contrast {
    --stb-radio-background: linear-gradient(var(--stb-bg-primary), var(--stb-bg-primary))
}

.form-radio__indicator {
    position: relative;
    width: 24px;
    height: 24px;
    border: 2px solid var(--stb-icon-1000);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-origin: border-box;
    background-clip: padding-box;
    border-radius: 50%;
    transition: border var(--stb-transition-time)
}

.form-radio__body {
    display: inline-grid;
    grid-auto-flow: column;
    grid-template-columns: max-content;
    align-items: center;
    gap: 12px;
    width: 100%;
    height: 52px;
    padding: 0 12px;
    color: var(--stb-text-secondary);
    background-image: var(--stb-radio-background), var(--stb-radio-border);
    background-origin: border-box;
    background-clip: padding-box, border-box, border-box;
    border: 2px solid transparent;
    border-radius: 4px;
    transition: color var(--stb-transition-time);
    cursor: pointer
}

@media(hover:hover) and (pointer:fine) {
    .form-radio__body:hover {
        --stb-radio-border: var(--stb-input-stroke-hover)
    }

    .form-radio__body:hover .form-radio__indicator {
        border-color: var(--stb-icon-100)
    }
}

.form-radio__input:checked+.form-radio__body {
    --stb-radio-border: var(--stb-input-stroke-hover);
    color: var(--stb-text-primary)
}

.form-radio__input:checked+.form-radio__body .form-radio__indicator {
    background-image: url(../assets/icons/icons-color/radiobutton-checked.png)
}

.form-radio__input:focus+.form-radio__body,
.form-radio__input:focus-visible+.form-radio__body,
.form-radio__input:focus:not(:focus-visible)+.form-radio__body {
    color: var(--stb-text-primary)
}

.form-radio__input:focus+.form-radio__body .form-radio__indicator,
.form-radio__input:focus-visible+.form-radio__body .form-radio__indicator,
.form-radio__input:focus:not(:focus-visible)+.form-radio__body .form-radio__indicator {
    border-color: var(--stb-icon-100)
}

.button {
    --stb-button-loading-dimension: 24px;
    --stb-hover-opacity-value: 0;
    --stb-active-opacity-value: 0;
    position: relative;
    display: inline-grid;
    grid-auto-flow: column;
    place-items: center;
    justify-content: center;
    column-gap: 8px;
    text-align: center;
    font-family: var(--stb-font-helper);
    font-weight: 400;
    line-height: 1;
    text-transform: var(--stb-text-transform-style);
    text-decoration: none;
    border: none;
    border-radius: var(--stb-button-border-radius, 4px);
    cursor: pointer;
    z-index: 1;
    transition: color var(--stb-transition-time)
}

.button--l {
    font-size: 28px;
    letter-spacing: .03em;
    min-height: 74px;
    padding: 0 40px
}

.button--m {
    font-size: 20px;
    min-height: 56px;
    padding: 0 24px
}

.button--s {
    font-size: 16px;
    letter-spacing: .02em;
    min-height: 48px;
    padding: 0 20px
}

.button--s-header {
    font-size: 16px;
    letter-spacing: .02em;
    min-height: 48px;
    min-width: 60px;
    padding: 0 16px
}

.button--xs {
    --stb-button-loading-dimension: 20px;
    font-size: 16px;
    letter-spacing: .02em;
    min-height: 36px;
    min-width: 36px;
    padding: 0 12px;
    grid-column-gap: 6px
}

.button--xs-icon {
    --stb-button-loading-dimension: 20px;
    font-size: 16px;
    min-height: 36px;
    min-width: 36px;
    padding: 0 20px;
    grid-column-gap: 6px
}

.button--xs-ent {
    --stb-button-loading-dimension: 20px;
    --stb-decor-padding-value: 0 19px;
    font-size: 16px;
    min-height: 36px;
    padding: 0 12px
}

/* .button--xs-ent.button--secondary-invert {
    font-weight: 700;
    line-height: 22px
} */

.button--xs-header {
    --stb-button-loading-dimension: 20px;
    --stb-decor-padding-value: 0 18px;
    font-size: 16px;
    letter-spacing: .02em;
    min-height: 36px;
    min-width: 36px;
    padding: 0 12px;
    grid-column-gap: 6px
}

.button--xs-header:lang(no),
.button--xs-header:lang(pt),
.button--xs-header:lang(cs),
.button--xs-header:lang(pl),
.button--xs-header:lang(es),
.button--xs-header:lang(de),
.button--xs-header:lang(fr) {
    font-size: 12px
}

.button--xs-header:lang(hu) {
    font-size: 11px
}

.button--xs-header:lang(fi) {
    font-size: 10px;
    letter-spacing: 0
}

.button.button--loading:after {
    filter: var(--stb-button-loading-after-filter)
}

/* .button--primary,
.button--secondary {
    --stb-button-loading-after-filter: var(--stb-button-text-bright-filter);
    --stb-button-border-radius: 40px;
    text-shadow: var(--stb-primary-text-shadow)
}

.button--primary:before,
.button--secondary:before,
.button--tertiary:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: var(--stb-before-opacity);
    background: var(--stb-before-background);
    transition: opacity var(--stb-transition-time) linear;
    transform: translateZ(0)
}

.button--primary:after,
.button--secondary:after,
.button--tertiary:after {
    content: "";
    position: absolute;
    z-index: -1
}

.button--primary {
    --stb-before-opacity: 0;
    --stb-before-background: padding-box 0% 50% / contain no-repeat url(../images/decor-primary-hover-left.png), padding-box 100% 0 / contain no-repeat url(../images/decor-primary-hover-right.png), content-box center center / 9px 100% repeat-x url(../images/decor-primary-hover-center.png);
    background: padding-box 0% 50%/contain no-repeat url(../images/decor-primary-left.png), padding-box 100% 0/contain no-repeat url(../images/decor-primary-right.png), content-box center center/9px 100% repeat-x url(../images/decor-primary-center.png);
    color: var(--stb-button-text-bright)
}

.button--primary:before {
    border-radius: 40px;
    padding: var(--stb-decor-padding-value, inherit)
}

.button--primary:after {
    inset: var(--stb-decor-inset-value, 0);
    padding: var(--stb-decor-padding-value, inherit);
    background-image: url(../images/primary-texture.png);
    border-radius: 40px;
    transition: opacity var(--stb-transition-time) linear
}

@media(hover:hover) and (pointer:fine) {
    .button--primary:hover {
        --stb-before-opacity: 1
    }
}

.button--primary:active {
    --stb-before-opacity: 1;
    --stb-before-background: padding-box 0% 50% / contain no-repeat url(../images/decor-primary-active-left.png), padding-box 100% 0 / contain no-repeat url(../images/decor-primary-active-right.png), content-box center center / 9px 100% repeat-x url(../images/decor-primary-active-center.png)
}

.button--primary.button--l {
    --stb-decor-inset-value: 6px 10px
}

.button--primary.button--m {
    --stb-decor-inset-value: 4px 7px;
    --stb-decor-padding-value: 0 30px
}

.button--primary.button--s,
.button--primary.button--s-header {
    --stb-decor-inset-value: 4px 7px;
    --stb-decor-padding-value: 0 26px
}

.button--primary.button--s-header {
    --stb-decor-padding-value: 0 24px
}

.button--primary.button--xs {
    --stb-decor-inset-value: 4px 4px;
    --stb-decor-padding-value: 0 20px
}

.button--primary.button--s-header,
.button--primary.button--xs-header {
    background: padding-box 0% 50%/contain no-repeat url(../images/decor-rounded-primary-active-left.png), padding-box 100% 0/contain no-repeat url(../images/decor-rounded-primary-active-right.png), content-box center center/9px 100% repeat-x url(../images/decor-rounded-primary-active-center.png);
    --stb-before-background: padding-box 0% 50% / contain no-repeat url(../images/decor-rounded-primary-hover-left.png), padding-box 100% 0 / contain no-repeat url(../images/decor-rounded-primary-hover-right.png), content-box center center / 9px 100% repeat-x url(../images/decor-rounded-primary-hover-center.png)
}

.button--primary.button--s-header:active,
.button--primary.button--xs-header:active {
    --stb-before-background: padding-box 0% 50% / contain no-repeat url(../images/decor-rounded-primary-left.png), padding-box 100% 0 / contain no-repeat url(../images/decor-rounded-primary-right.png), content-box center center / 9px 100% repeat-x url(../images/decor-rounded-primary-center.png)
}

.button--primary.button--loading {
    --stb-before-opacity: 1;
    --stb-before-background: 0% 0% / cover url(../images/primary-texture.png)
}

.button--secondary {
    --stb-before-opacity: 0;
    --stb-before-background: var(--stb-button-secondary-hover);
    --stb-after-background: 0% 50% / contain no-repeat url(../images/decor-left.png), content-box center center / 9px 100% repeat-x url(../images/decor-center.png), 100% 0 / contain no-repeat url(../images/decor-right.png), 0% 0% / cover url(../images/primary-texture.png);
    color: var(--stb-text-contrast-primary);
    background: var(--stb-button-secondary)
}

.button--secondary:before {
    content: "";
    border-radius: 40px
}

.button--secondary:after {
    inset: var(--stb-decor-inset-value, 0);
    padding: var(--stb-decor-padding-value, inherit);
    background: var(--stb-after-background);
    border-radius: 40px
}

@media(hover:hover) and (pointer:fine) {
    .button--secondary:hover {
        --stb-before-opacity: 1
    }
}

.button--secondary:active {
    --stb-before-opacity: 1;
    --stb-before-background: var(--stb-button-secondary-active)
}

.button--secondary.button--l {
    --stb-after-background: 0% 50% / contain no-repeat url(../images/decor-arrow-left.png), content-box center center / 9px 100% repeat-x url(../images/decor-arrow-center.png), 100% 0 / contain no-repeat url(../images/decor-arrow-right.png), 0% 0% / cover url(../images/primary-texture.png);
    --stb-decor-inset-value: 0 -5px;
    box-shadow: 0 0 16px 0 rgb(var(--stb-brand-1400)) inset
}

.button--secondary.button--m {
    --stb-decor-padding-value: 0 28px;
    box-shadow: 0 0 12px 0 rgb(var(--stb-brand-1400)) inset
}

.button--secondary.button--s,
.button--secondary.button--s-header {
    --stb-decor-padding-value: 0 23px;
    box-shadow: 0 0 10px 0 rgb(var(--stb-brand-1400)) inset
}

.button--secondary.button--xs,
.button--secondary.button--xs-header {
    --stb-decor-padding-value: 0 18px;
    box-shadow: 0 0 8px 0 rgb(var(--stb-brand-1400)) inset
}

.button--secondary.button--loading {
    background: 0% 50%/contain no-repeat url(../images/decor-left.png), content-box center center/9px 100% repeat-x url(../images/decor-center.png), 100% 0/contain no-repeat url(../images/decor-right.png), 0% 0%/cover url(../images/primary-texture.png), var(--stb-gradient-200);
    box-shadow: none
}

.button--secondary.button--loading.button--l {
    --stb-before-opacity: 1;
    --stb-before-background: 0% 50% / contain no-repeat url(../images/decor-arrow-left.png), content-box center center / 9px 100% repeat-x url(../images/decor-arrow-center.png), 100% 0 / contain no-repeat url(../images/decor-arrow-right.png);
    background: 0% 0%/cover url(../images/primary-texture.png), var(--stb-button-secondary)
}

.button--secondary.button--loading.button--l:before {
    inset: var(--stb-decor-inset-value, 0);
    padding: inherit
} */

/* .button--tertiary {
    --stb-before-opacity: 0;
    --stb-before-background: var(--stb-button-tertiary-hover);
    --stb-button-loading-after-filter: var(--stb-button-text-middle-filter);
    overflow: hidden;
    color: var(--stb-button-text-middle);
    background: var(--stb-button-tertiary);
    transform: translateZ(0);
    box-shadow: var(--stb-button-tertiary-shadow)
}

.button--tertiary:before {
    box-shadow: var(--stb-button-tertiary-shadow)
}

.button--tertiary:after {
    inset: 0;
    background: top center/auto 230% var(--stb-texture-waves);
    box-shadow: var(--stb-button-tertiary-shadow)
}

.button--tertiary.button--loading {
    --stb-before-opacity: 1;
    --stb-before-background: top center / auto 230% var(--stb-texture-waves)
}

.button--tertiary.button--loading:after {
    box-shadow: initial
}

.button--tertiary.button--l,
.button--tertiary.button--m,
.button--tertiary.button--s,
.button--tertiary.button--xs {
    --stb-button-border-radius: 4px
}

@media(hover:hover) and (pointer:fine) {
    .button--tertiary:hover {
        --stb-before-opacity: 1
    }

    .button--tertiary:hover:before {
        border-radius: 4px
    }
}

.button--tertiary:active {
    --stb-before-opacity: 1;
    --stb-before-background: var(--stb-button-tertiary-active)
}

.button--secondary-invert {
    --stb-button-loading-background-color: rgb(var(--stb-neutral-500) / .4);
    --stb-button-loading-after-filter: var(--stb-button-text-bright-filter);
    color: rgb(var(--stb-neutral-200));
    background-color: rgb(var(--stb-neutral-500)/.4)
}

@media(hover:hover) and (pointer:fine) {
    .button--secondary-invert:hover {
        text-decoration: underline
    }
}

.button--secondary-invert:active {
    color: rgb(var(--stb-brand-400));
    text-decoration: none
} */

.button.button--loading,
.button.button--loading:disabled {
    position: relative;
    color: transparent;
    cursor: default;
    pointer-events: none;
    text-shadow: unset
}

.button.button--loading:after,
.button.button--loading:disabled:after {
    position: absolute;
    top: 50%;
    inset-inline-start: 50%;
    width: var(--stb-button-loading-dimension);
    height: var(--stb-button-loading-dimension);
    margin-top: calc(-1 * var(--stb-button-loading-dimension)/2);
    margin-inline-start: calc(-1 * var(--stb-button-loading-dimension)/2);
    background-image: url(../assets/icons/icons-sprite/loading.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    animation: animation-rotation var(--stb-animation-rotation-time) linear infinite;
    content: "";
    padding: initial
}

.button:disabled:not(.button--loading) {
    opacity: .3;
    cursor: default;
    pointer-events: none
}

.button .icon {
    filter: drop-shadow(var(--stb-primary-text-shadow))
}

.button-notification-indicator {
    --stb-indicator-dimension: 12px;
    position: absolute;
    inset-inline-end: 2px;
    top: 2px;
    padding: 0 2px;
    min-width: var(--stb-indicator-dimension);
    height: var(--stb-indicator-dimension);
    color: var(--stb-text-contrast-primary);
    font-size: 9px;
    font-weight: 700;
    line-height: 1.2;
    border-radius: calc(var(--stb-indicator-dimension)/2);
    background-color: var(--stb-functional-error);
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: nowrap
}

@media screen and (min-width:1280px) {
    .button-notification-indicator {
        inset-inline-end: 7px;
        top: 7px
    }
}

.button-reload {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    grid-gap: 4px;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 700;
    color: var(--stb-text-primary)
}

.button-flag {
    width: 20px;
    height: 20px;
    object-fit: cover;
    border-radius: 2px
}

.arrow-button {
    --stb-decor-background: 0% 50% / contain no-repeat url(../images/decor-left.png), 100% 0 / contain no-repeat url(../images/decor-right.png);
    --stb-button-background: var(--stb-button-secondary);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--stb-button-background);
    color: var(--stb-button-secondary);
    border-radius: 100%;
    transition: opacity var(--stb-transition-time), color var(--stb-transition-time);
    cursor: pointer;
    z-index: 1
}

.arrow-button:before {
    content: "";
    position: absolute;
    inset: var(--stb-decor-inset-value, 0);
    background: var(--stb-decor-background);
    z-index: -1
}

@media(hover:hover) and (pointer:fine) {
    .arrow-button:hover {
        --stb-button-background: var(--stb-button-secondary-hover)
    }
}

.arrow-button:active {
    --stb-button-background: var(--stb-button-secondary-active)
}

.arrow-button:disabled {
    pointer-events: none;
    cursor: default;
    opacity: .3
}

.arrow-button--right .arrow-button__icon {
    transform: rotateY(180deg);
    z-index: -1
}

.icon-btn {
    --stb-icon-btn-border: 2px solid transparent;
    --stb-icon-btn-loading-dimension: 20px;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: var(--stb-text-contrast-primary);
    border: var(--stb-icon-btn-border);
    border-radius: 4px;
    background: url(../images/primary-texture.png), var(--stb-icon-btn-background) padding-box, var(--stb-icon-btn-border-background);
    box-shadow: var(--stb-icon-btn-box-shadow, none)
}

@media(hover:hover) and (pointer:fine) {
    .icon-btn:hover {
        --stb-icon-btn-hover-opacity: 1
    }
}

.icon-btn:active {
    --stb-icon-btn-active-opacity: 1
}

.icon-btn:before,
.icon-btn:after {
    position: absolute;
    z-index: -1;
    inset: 0;
    border-radius: inherit;
    transition: opacity var(--stb-transition-time);
    box-shadow: inherit;
    will-change: opacity;
    content: ""
}

.icon-btn:after {
    background: var(--stb-icon-btn-active-background);
    opacity: var(--stb-icon-btn-active-opacity, 0)
}

.icon-btn:before {
    background: var(--stb-icon-btn-hover-background);
    opacity: var(--stb-icon-btn-hover-opacity, 0)
}

.icon-btn--primary {
    --stb-icon-btn-border-background: var(--stb-gradient-300) border-box;
    --stb-icon-btn-background: var(--stb-button-primary);
    --stb-icon-btn-hover-background: var(--stb-button-primary-hover);
    --stb-icon-btn-active-background: var(--stb-button-primary-active)
}

.icon-btn--secondary {
    --stb-icon-btn-border-background: var(--stb-gradient-300) border-box;
    --stb-icon-btn-background: var(--stb-button-secondary);
    --stb-icon-btn-hover-background: var(--stb-button-secondary-hover);
    --stb-icon-btn-active-background: var(--stb-button-secondary-active)
}

.icon-btn--tertiary {
    --stb-icon-btn-background: var(--stb-button-tertiary);
    --stb-icon-btn-border-background: var(--stb-button-tertiary) border-box;
    --stb-icon-btn-hover-background: var(--stb-button-tertiary-hover);
    --stb-icon-btn-active-background: var(--stb-button-tertiary-active);
    --stb-icon-btn-box-shadow: inset -2px 2px 2px 0 #293136, inset 2px -2px 0 0 #231c14;
    --stb-icon-btn-border: none
}

.icon-btn--is-loading {
    position: relative;
    color: transparent;
    text-shadow: unset;
    cursor: default;
    pointer-events: none
}

.icon-btn--is-loading:after {
    position: absolute;
    inset: 0;
    margin: auto;
    width: var(--stb-icon-btn-loading-dimension);
    height: var(--stb-icon-btn-loading-dimension);
    background-image: url(../assets/icons/icons-sprite/loading.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    box-shadow: initial;
    filter: var(--stb-button-text-bright-filter);
    animation: animation-rotation var(--stb-animation-rotation-time) linear infinite;
    opacity: 1;
    content: ""
}

.icon-btn--is-disabled {
    cursor: default;
    opacity: .3
}

.icon-btn .icon {
    filter: drop-shadow(var(--stb-button-text-shadow))
}

.button-icon-link {
    display: grid;
    place-content: center;
    width: 36px;
    height: 36px;
    color: rgb(var(--stb-brand-700));
    cursor: pointer;
    transition: color var(--stb-transition-time)
}

@media(hover:hover) and (pointer:fine) {
    .button-icon-link:hover {
        color: rgb(var(--stb-brand-600))
    }
}

.button-icon-link:active {
    color: rgb(var(--stb-brand-700))
}

.button-icon-link:disabled {
    cursor: default;
    opacity: .3
}

.notification-button {
    display: inline-flex;
    color: rgb(var(--stb-brand-700));
    transition: color var(--stb-transition-time)
}

@media(hover:hover) and (pointer:fine) {
    .notification-button:hover {
        color: rgb(var(--stb-brand-600))
    }
}

.notification-button:active {
    color: rgb(var(--stb-brand-700))
}

.link {
    display: inline-grid;
    grid-auto-flow: column;
    align-items: center;
    grid-column-gap: 8px;
    transition: color var(--stb-transition-time);
    cursor: pointer
}

.link:not(.text-underline) {
    text-decoration: none
}

.link--primary {
    color: var(--stb-link-primary)
}

@media(hover:hover) and (pointer:fine) {
    .link--primary:hover {
        color: rgb(var(--stb-white))
    }
}

.link--primary:active {
    color: var(--stb-link-primary)
}

.link--secondary {
    color: var(--stb-link-secondary)
}

@media(hover:hover) and (pointer:fine) {
    .link--secondary:hover {
        color: rgb(var(--stb-white))
    }
}

.link--secondary:active {
    color: var(--stb-link-secondary)
}

.link--tertiary {
    color: var(--stb-link-tertiary)
}

@media(hover:hover) and (pointer:fine) {
    .link--tertiary:hover {
        color: rgb(var(--stb-white))
    }
}

.link--tertiary:active {
    color: var(--stb-link-tertiary)
}

.link--accent {
    color: var(--stb-link-accent)
}

@media(hover:hover) and (pointer:fine) {
    .link--accent:hover {
        color: rgb(var(--stb-white))
    }
}

.link--accent:active {
    color: var(--stb-link-accent)
}

.link--alert {
    color: var(--stb-link-alert)
}

@media(hover:hover) and (pointer:fine) {
    .link--alert:hover {
        color: rgb(var(--stb-red-200))
    }
}

.link--alert:active {
    color: var(--stb-link-alert)
}

.link--invert {
    color: var(--stb-link-secondary)
}

@media(hover:hover) and (pointer:fine) {
    .link--invert:hover {
        color: rgb(var(--stb-white))
    }
}

.link--invert:active {
    color: var(--stb-link-secondary)
}

.link--invert-secondary {
    color: var(--stb-link-invert-secondary)
}

@media(hover:hover) and (pointer:fine) {
    .link--invert-secondary:hover {
        color: rgb(var(--stb-white))
    }
}

.link--invert-secondary:active {
    color: var(--stb-link-invert-secondary)
}

.link--invert-tertiary {
    color: rgb(var(--stb-white))
}

@media(hover:hover) and (pointer:fine) {
    .link--invert-tertiary:hover {
        color: var(--stb-link-accent)
    }
}

.link--invert-tertiary:active {
    color: rgb(var(--stb-white))
}

.link--inline {
    color: inherit
}

@media(hover:hover) and (pointer:fine) {
    .link--inline:hover {
        color: rgb(var(--stb-white))
    }
}

.link--inline:active {
    color: inherit
}

.link--gap-4 {
    grid-column-gap: 4px
}

.modal-dialog-panel {
    max-height: 100%;
    height: auto;
    width: 100%;
    max-width: var(--stb-modal-dialog-panel-max-width);
    margin: 0 auto;
    overflow: hidden auto
}

@media(pointer:fine) {
    .modal-dialog-panel {
        scrollbar-width: none
    }
}

.modal-dialog-panel>* {
    position: relative;
    width: 100%
}

.burger-menu-backdrop,
.user-menu-backdrop {
    top: var(--stb-header-height)
}

.burger-menu-backdrop~.stb-global-overlay-wrapper,
.burger-menu-backdrop~.stb-global-overlay-wrapper+.stb-global-overlay-wrapper,
.user-menu-backdrop~.stb-global-overlay-wrapper,
.user-menu-backdrop~.stb-global-overlay-wrapper+.stb-global-overlay-wrapper {
    top: var(--stb-header-height);
    height: calc(100% - var(--stb-header-height))
}

.burger-menu-modal {
    inset-inline-start: 0;
    max-width: var(--stb-modal-burger-menu-max-width);
    height: 100%;
    margin-inline-start: 0
}

.user-menu-modal {
    inset-inline-end: 0;
    max-width: var(--stb-modal-user-menu-max-width);
    height: 100%;
    margin-inline-end: 0
}

.dialog {
    display: block;
    padding: 20px
}

@media screen and (min-width:768px) {
    .dialog {
        padding: 40px
    }
}

.dialog-inner:not(.dialog-inner--simple, .dialog-inner--search) {
    --stb-border-size: 38;
    position: relative;
    display: block;
    border-radius: var(--stb-modal-dialog-border-radius);
    background-image: var(--stb-texture-waves), var(--stb-bg-popup);
    background-size: 135% auto, cover;
    box-shadow: var(--stb-shadow-primary)
}

.dialog-inner:not(.dialog-inner--simple, .dialog-inner--search):before {
    position: absolute;
    inset: 0;
    z-index: 4;
    border-image-source: url(../images/dialog-border@2x.png);
    border-image-slice: calc(var(--stb-border-size) * 2);
    border-image-width: calc(var(--stb-border-size) * .8 * 1px);
    pointer-events: none;
    transform-style: preserve-3d;
    content: ""
}

@supports(border-image-source:url(../images/dialog-border@2x.webp)) {
    .dialog-inner:not(.dialog-inner--simple, .dialog-inner--search):before {
        border-image-source: url(../images/dialog-border@2x.webp)
    }
}

@media screen and (min-width:768px) {
    .dialog-inner:not(.dialog-inner--simple, .dialog-inner--search):before {
        border-image-width: calc(var(--stb-border-size) * 1px)
    }
}

.dialog-inner--search {
    --stb-border-size: 38;
    position: relative;
    border-radius: var(--stb-modal-dialog-border-radius);
    background-color: var(--stb-bg-primary);
    box-shadow: 0 6 16 0 rgba(var(--stb-neutral-990)/.8)
}

.dialog-inner--search:before {
    position: absolute;
    inset: 0;
    z-index: 4;
    border-image-source: url(../images/dialog-border@2x.png);
    border-image-slice: calc(var(--stb-border-size) * 2);
    border-image-width: calc(var(--stb-border-size) * .8 * 1px);
    pointer-events: none;
    transform-style: preserve-3d;
    content: ""
}

@supports(border-image-source:url(../images/dialog-border@2x.webp)) {
    .dialog-inner--search:before {
        border-image-source: url(../images/dialog-border@2x.webp)
    }
}

@media screen and (min-width:768px) {
    .dialog-inner--search:before {
        border-image-width: calc(var(--stb-border-size) * 1px)
    }
}

.dialog-inner--simple {
    --stb-border-size: 12;
    position: relative;
    border-radius: calc(var(--stb-border-size) * 1px);
    background: var(--stb-bg-primary)
}

.dialog-inner--simple:before {
    position: absolute;
    inset: 0;
    z-index: 4;
    border-image-source: url(../images/card-border@2x.png);
    border-image-slice: calc(var(--stb-border-size) * 2);
    border-image-width: calc(var(--stb-border-size) * 1px);
    pointer-events: none;
    transform-style: preserve-3d;
    content: ""
}

@supports(border-image-source:url(../images/card-border@2x.webp)) {
    .dialog-inner--simple:before {
        border-image-source: url(../images/card-border@2x.webp)
    }
}

.dialog-header {
    display: flex;
    align-items: flex-start;
    width: 100%;
    margin: 0 auto;
    padding: 24px var(--stb-modal-dialog-inner-vertical-padding)
}

.dialog-header--centered {
    align-items: center
}

.dialog-header__title {
    padding-top: 4px;
    font-size: 20px;
    font-weight: 700
}

@media screen and (min-width:768px) {
    .dialog-header__title {
        padding-top: 2px;
        font-size: 24px
    }
}

.dialog-header--search {
    padding: 34px var(--stb-modal-dialog-inner-vertical-padding) 24px
}

.dialog-header--search .dialog-header__title {
    font-size: 28px;
    text-transform: uppercase;
    background-image: var(--stb-text-accent);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent
}

.dialog-action {
    position: sticky;
    bottom: 0;
    display: grid;
    margin-top: 20px;
    padding: 0 var(--stb-modal-dialog-inner-vertical-padding) var(--stb-modal-dialog-action-bottom-padding);
    border-radius: var(--stb-modal-dialog-border-radius)
}

.dialog-action__info-text {
    margin-top: 16px;
    color: var(--stb-text-contrast-primary);
    text-align: center
}

.dialog-close {
    flex-shrink: 0;
    margin-inline-start: auto;
    margin-inline-end: -6px
}

.dialog-body {
    display: grid;
    grid-gap: 20px;
    width: 100%;
    margin: 0 auto;
    padding: 0 var(--stb-modal-dialog-inner-vertical-padding) var(--stb-modal-dialog-body-bottom-padding)
}

.dialog-body--search {
    display: block;
    grid-gap: 0;
    min-height: 450px
}

.dialog-item {
    display: grid;
    grid-gap: 16px;
    padding: 0 var(--stb-modal-dialog-inner-vertical-padding)
}

.dialog-bottom {
    padding: 20px var(--stb-modal-dialog-inner-vertical-padding) 40px
}

.dialog-back {
    margin-inline-end: 4px;
    margin-inline-start: -4px
}

.dialog-result {
    display: grid;
    grid-gap: 20px
}

.dialog-result__icon {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--stb-functional-done)
}

.actions-grid {
    display: grid;
    grid-row-gap: 12px
}

.dialog-separator {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    grid-column-gap: 12px;
    place-items: center;
    font-size: 12px;
    line-height: 1.4;
    color: var(--stb-text-secondary)
}

.dialog-separator:before,
.dialog-separator:after {
    width: 100%;
    height: 1px;
    background-color: rgb(var(--stb-neutral-800));
    content: ""
}

.dialog-separator:empty {
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 0
}

@media screen and (min-width:768px) {
    .dialog--bonus .dialog-header__title {
        font-size: 28px;
        text-transform: uppercase
    }
}

.search-modal {
    --stb-modal-dialog-panel-max-width: 100%
}

@media screen and (min-width:1280px) {
    .search-modal {
        --stb-modal-dialog-panel-max-width: 1280px
    }
}

.cashier-modal {
    --stb-modal-dialog-panel-max-width: 100%;
    --stb-modal-dialog-inner-vertical-padding: 16px
}

@media screen and (min-width:768px) {
    .cashier-modal {
        --stb-modal-dialog-panel-max-width: 768px;
        --stb-modal-dialog-inner-vertical-padding: 70px
    }
}

.documents-verification-modal {
    --stb-modal-dialog-panel-max-width: 100%;
    height: 100%;
    padding: 0
}

.notifications-panel {
    max-width: 400px;
    width: 100%
}

.stb-notification {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    grid-gap: 12px;
    width: 100%;
    padding: 14px 14px 14px 48px;
    background-color: var(--stb-bg-primary);
    background-size: 24px 24px;
    background-position: 12px center;
    background-repeat: no-repeat;
    border: 1px solid var(--stb-bg-tertiary);
    border-radius: 8px
}

.stb-notification.success {
    background-image: url(../assets/icons/icons-color/notification-success.png);
    background-image: -webkit-image-set(url(../assets/icons/icons-color/notification-success.webp) 1x, url(../assets/icons/icons-color/notification-success@2x.webp) 2x);
    background-image: image-set(url(../assets/icons/icons-color/notification-success.webp) 1x, url(../assets/icons/icons-color/notification-success@2x.webp) 2x);
    background-image: -webkit-image-set(url(../assets/icons/icons-color/notification-success.webp) type("image/webp") 1x, url(../assets/icons/icons-color/notification-success@2x.webp) type("image/webp") 2x, url(../assets/icons/icons-color/notification-success.png) type("image/png") 1x, url(../assets/icons/icons-color/notification-success@2x.png) type("image/png") 2x);
    background-image: image-set(url(../assets/icons/icons-color/notification-success.webp) type("image/webp") 1x, url(../assets/icons/icons-color/notification-success@2x.webp) type("image/webp") 2x, url(../assets/icons/icons-color/notification-success.png) type("image/png") 1x, url(../assets/icons/icons-color/notification-success@2x.png) type("image/png") 2x)
}

.stb-notification.warning {
    background-image: url(../assets/icons/icons-color/notification-warning.png);
    background-image: -webkit-image-set(url(../assets/icons/icons-color/notification-warning.webp) 1x, url(../assets/icons/icons-color/notification-warning@2x.webp) 2x);
    background-image: image-set(url(../assets/icons/icons-color/notification-warning.webp) 1x, url(../assets/icons/icons-color/notification-warning@2x.webp) 2x);
    background-image: -webkit-image-set(url(../assets/icons/icons-color/notification-warning.webp) type("image/webp") 1x, url(../assets/icons/icons-color/notification-warning@2x.webp) type("image/webp") 2x, url(../assets/icons/icons-color/notification-warning.png) type("image/png") 1x, url(../assets/icons/icons-color/notification-warning@2x.png) type("image/png") 2x);
    background-image: image-set(url(../assets/icons/icons-color/notification-warning.webp) type("image/webp") 1x, url(../assets/icons/icons-color/notification-warning@2x.webp) type("image/webp") 2x, url(../assets/icons/icons-color/notification-warning.png) type("image/png") 1x, url(../assets/icons/icons-color/notification-warning@2x.png) type("image/png") 2x)
}

.stb-notification.info {
    background-image: url(../assets/icons/icons-color/notification-info.png);
    background-image: -webkit-image-set(url(../assets/icons/icons-color/notification-info.webp) 1x, url(../assets/icons/icons-color/notification-info@2x.webp) 2x);
    background-image: image-set(url(../assets/icons/icons-color/notification-info.webp) 1x, url(../assets/icons/icons-color/notification-info@2x.webp) 2x);
    background-image: -webkit-image-set(url(../assets/icons/icons-color/notification-info.webp) type("image/webp") 1x, url(../assets/icons/icons-color/notification-info@2x.webp) type("image/webp") 2x, url(../assets/icons/icons-color/notification-info.png) type("image/png") 1x, url(../assets/icons/icons-color/notification-info@2x.png) type("image/png") 2x);
    background-image: image-set(url(../assets/icons/icons-color/notification-info.webp) type("image/webp") 1x, url(../assets/icons/icons-color/notification-info@2x.webp) type("image/webp") 2x, url(../assets/icons/icons-color/notification-info.png) type("image/png") 1x, url(../assets/icons/icons-color/notification-info@2x.png) type("image/png") 2x)
}

.stb-notification.error {
    background-image: url(../assets/icons/icons-color/notification-error.png);
    background-image: -webkit-image-set(url(../assets/icons/icons-color/notification-error.webp) 1x, url(../assets/icons/icons-color/notification-error@2x.webp) 2x);
    background-image: image-set(url(../assets/icons/icons-color/notification-error.webp) 1x, url(../assets/icons/icons-color/notification-error@2x.webp) 2x);
    background-image: -webkit-image-set(url(../assets/icons/icons-color/notification-error.webp) type("image/webp") 1x, url(../assets/icons/icons-color/notification-error@2x.webp) type("image/webp") 2x, url(../assets/icons/icons-color/notification-error.png) type("image/png") 1x, url(../assets/icons/icons-color/notification-error@2x.png) type("image/png") 2x);
    background-image: image-set(url(../assets/icons/icons-color/notification-error.webp) type("image/webp") 1x, url(../assets/icons/icons-color/notification-error@2x.webp) type("image/webp") 2x, url(../assets/icons/icons-color/notification-error.png) type("image/png") 1x, url(../assets/icons/icons-color/notification-error@2x.png) type("image/png") 2x)
}

.stb-notification__text {
    font-size: 14px;
    line-height: 1.4;
    color: var(--stb-text-secondary)
}

.stb-notification__btn {
    align-self: start;
    width: 16px;
    height: 16px;
    margin-block: 2px;
    -webkit-mask-image: url(../assets/icons/icons-sprite/close.svg);
    mask-image: url(../assets/icons/icons-sprite/close.svg);
    -webkit-mask-size: 16px;
    mask-size: 16px;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: rgb(var(--stb-brand-700));
    transition: background-color var(--stb-transition-time)
}

@media(hover:hover) and (pointer:fine) {
    .stb-notification__btn:hover {
        background-color: rgb(var(--stb-brand-600))
    }
}

.stb-notification__btn:active {
    background-color: rgb(var(--stb-brand-700))
}

.stb-notification--in {
    animation: notification-in .5s both
}

.stb-notification--out {
    animation: notification-out .5s forwards
}

html[dir=rtl] .stb-notification--in {
    animation: notification-in-rtl .5s both
}

html[dir=rtl] .stb-notification--out {
    animation: notification-out-rtl .5s forwards
}

@keyframes notification-in {
    0% {
        transform: translate(calc(100% + 20px))
    }

    to {
        transform: translate(0)
    }
}

@keyframes notification-out {
    0% {
        transform: translate(0)
    }

    to {
        transform: translate(calc(100% + 20px))
    }
}

@keyframes notification-in-rtl {
    0% {
        transform: translate(-100%)
    }

    to {
        transform: translate(0)
    }
}

@keyframes notification-out-rtl {
    0% {
        transform: translate(0)
    }

    to {
        transform: translate(-100%)
    }
}

.toggle {
    position: relative;
    z-index: 1;
    color: var(--stb-text-primary);
    text-shadow: var(--stb-primary-text-shadow);
    border-radius: 8px;
    background-image: var(--stb-gradient-800);
    box-shadow: var(--stb-button-tertiary-shadow);
    transition: color var(--stb-transition-time);
    cursor: pointer;
    display: inline-grid;
    grid-auto-flow: column;
    grid-gap: 4px;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    min-width: 66px;
    padding: 0 8px;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 700;
    text-align: center
}

.toggle:before,
.toggle:after {
    position: absolute;
    inset: 0;
    z-index: -1;
    background-image: var(--stb-gradient-800);
    border-radius: inherit;
    transition: opacity var(--stb-transition-time);
    will-change: opacity;
    content: ""
}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,hr {
    margin: 0;
    padding: 0;
    border: 0
}

html {
    box-sizing: border-box;
    font-size: 62.5%
}

body {
    background: #141b34;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main,form legend {
    display: block
}

ol,ul,menu {
    list-style: none
}

blockquote,q {
    quotes: none
}

button,input,textarea,select {
    margin: 0
}

select::-ms-expand {
    display: none
}

textarea {
    resize: vertical;
    overflow: auto;
    vertical-align: top
}

input::-ms-clear {
    display: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

img,video,svg {
    max-width: 100%
}

b,strong {
    font-weight: 700
}

.container {
    width: 100%;
    margin-inline:auto;max-width: var(--container-width)
}

.container:first-of-type {
    padding-top: .3rem
}

.disable-scroll {
    overflow: hidden
}

body {
    font-size: var(--text-base-size);
    font-family: var(--font-primary)
}

h2,h3,h4,h5,h6 {
    color: #fff;
}

h2 {
    font-size: var(--text-xl);
    font-weight: 700;
    line-height: 3.6rem
}

h2 {
    font-size: 32px;
    font-weight: 700;
    line-height: 3.6rem
}

h3 {
    font-size: 2.4rem;
    font-weight: 600;
    line-height: 2.7rem
}

h4 {
    font-size: 2rem;
    font-weight: 600;
    line-height: 2.7rem
}

h5,h6 {
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 2.7rem
}

a {
text-transform: uppercase;
    line-height: 120%;
    text-shadow: none;
    transition: color var(--transitionTime);
    word-wrap: break-word;
    white-space: nowrap;
    text-decoration: none;
    color: #fff;
}

/* a:hover {
    color: rgb(195 108 20);
} */

.footer {
    padding-top: 8rem;
    /* background: #141b34; */
}

.footer__top {
    padding-block:5rem 5.3rem;
   background-color: #1a0a03;
    color: #fff;
    font-size: var(--text-sm);
    font-weight: 500;
    line-height: 2.1rem;
    text-align: center
}

.footer__top .container {
    padding-inline:5.5rem;padding-block:0}

@media only screen and (min-width: 900px) {
    .footer__top .container {
        padding-top:0;
        padding-inline:var(--space-md);display: flex;
        justify-content: space-between;
        gap: var(--space-sm);
        text-align: left
    }
}

@media only screen and (min-width: 1140px) {
    .footer__top .container {
        padding-inline:0
    }
}

.footer__top .container>div {
    display: flex;
    flex-direction: column;
    gap: 4rem
}

@media only screen and (min-width: 900px) {
    .footer__top .container>div {
        flex-direction:row
    }
}

.footer__top a {
    text-decoration: none;
    color: #ffffff
}

.footer__description {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 0 0 60%;
    color: #c6ab94;

}

.footer__description img {
    width: var(--logo-width);
    height: var(--logo-height);
    margin-bottom: 1.6rem
}

.footer__description b {
    font-size: var(--text-md);
    font-weight: 600;
    line-height: 2.4rem
}

.footer__secondary {
    flex: 0 0 33%
}

.footer__secondary b {
    font-size: var(--text-md);
    font-weight: 600;
    line-height: 2.4rem
}

.footer .footer-menu__title {
    font-size: var(--text-md);
    font-weight: 600;
    line-height: 2.4rem;
    margin-bottom: var(--space-md)
}

.footer .footer-menu__title.language {
    margin-bottom: 1.5rem
}

.footer .footer-menu ul {
    display: flex;
    flex-direction: column;
    gap: 1.5rem
}

.footer__bottom {
    background-color: #1a0a03;
    min-height: 7rem
}

.footer__bottom .container {
    padding-block:3.2rem 2.3rem}

@media only screen and (min-width: 900px) {
    .footer__bottom .container {
        display:flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: center;
        padding-block:2.3rem}
}

.footer__bottom-images {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.7rem;
}
.footer__bottom-images img {
    max-width: 200px;
    max-height: 100px;
    width: 100%;
    height: auto;
    background-color: rgba(255, 255, 255, .05);
    border-radius: 8px;
}

@media only screen and (min-width: 900px) {
    .footer__bottom-images {
        gap:3.7rem
    }
}

.footer__bottom-images img {
    display: block
}

.footer__bottom-copyright {
    font-size: 1.3rem;
    line-height: 2.4rem;
    text-align: center;
    color: #c6ab94;
    margin-top: 1.2rem
}

@media only screen and (min-width: 900px) {
    .footer__bottom-copyright {
        margin-top:0
    }
}

.header {
    background: #201109;
    border-bottom: 2px solid rgb(184,147,122);
    top: 0;
    left: 0;
    width: 100%;
    z-index: 20
}

.header--sticky {
    position: sticky;
    background: rgb(24 22 18);
}

@media only screen and (min-width: 900px) {
    .header .hamburger-btn {
        display:none
    }
}

.header__wrap {
    padding-inline:var(--space-md)}

.header__main {
    margin-inline: auto;
    max-width: var(--container-width);
    min-height: var(--header-height);
    display: flex;
    justify-content: space-between;
    align-items: center
}

.header__logo {
    display: block
}

.header__logo img {

}

.header__mob-menu {
    display: none;
    position: absolute;
    top: 0;
    height: 100vh;
    left: 0;
    width: 100%;
    background: rgba(0,0,0,.5)
}

.header__mob-menu.open {
    display: block
}

.header__mob-menu .mobile-language-controls {
    display: flex;
    gap: var(--space-md)
}

.header__mob-menu-close {
    position: absolute;
    top: 1rem;
    right: 28rem;
    width: 3rem;
    height: 3rem;
    background: var(--color-white);
    border-radius: var(--border-radius-circle);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #111;
    font-weight: 700;
    font-size: var(--text-sm);
    cursor: pointer
}

.header__mob-menu-main {
    position: relative;
    padding: var(--space-lg);
    padding-top: 1.9rem;
    max-width: 27rem;
    width: 100%;
    height: 100%;
    margin-left: auto;
    background: var(--color-body-bg);
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.header__mob-menu-main nav a {
    color: #117770;
    font-size: var(--text-lg);
    text-decoration: none
}

.header__mob-menu-main nav ul {
    margin-top: 3.2rem;
    display: flex;
    flex-direction: column;
    gap: 1.7rem
}

.header__mob-menu-main .button {
    padding-inline:0;width: 100%;
    margin-top: 1.5rem;
    font-weight: 700
}

.header__nav ul {
    display: none
}

@media only screen and (min-width: 900px) {
    .header__nav ul {
        display:flex;
        gap: var(--header-menu-gap, 5rem)
    }

    .header__nav ul a {
        color: #117770;
        line-height: 2.4rem;
        text-decoration: none;
        text-transform: uppercase
    }
    .header__nav ul a:hover {
        color: #06cebf;
    }
}

.header__extra {
    display:flex;
    align-items: center;
    gap: 1.5rem
}

@media only screen and (min-width: 900px) {

    .header__extra .language-selector {
        margin-top: unset;
        position: relative
    }

    .header__extra .language-selector__selected {
        background: rgba(0,0,0,.15);
        color: var(--color-market-switcher-text);
        padding-block:.6rem}

    .header__extra .language-selector__selected>img {
        display: none
    }

    /* .header__extra .button {
        padding: 1.3rem 0;
        font-size: 1.4rem;
        font-weight: 700;
        line-height: 2rem;
            position: relative;
                padding-left: var(--stb-custom-button__padding-left);
                padding-top: 6px;
                padding-right: var(--stb-custom-button__padding-right);
                padding-bottom: 6px;
                font-weight: 700;
                border-radius: 48px;
                background: linear-gradient(rgb(195 108 20), rgb(223, 142, 29), rgb(250, 162, 38)0);
                padding: 10px 15px;
                border: none;
    } */
}

@media only screen and (min-width: 900px)and (min-width: 900px) {
    .header__extra .button {
        padding-inline:2.4rem
    }
}

.hero {
    padding-top: calc(var(--header-height) + 2rem);
    padding-inline:var(--space-md);padding-bottom: var(--space-lg);
    background: var(--gradient-main);
    background-size: cover
}

@media only screen and (min-width: 900px) {
    .hero {
        padding-top:calc(var(--header-height) + 4rem);
        padding-bottom: 2.6rem
    }
}

.hero__wrap {
    max-width: var(--container-width);
    color: var(--color-white);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md)
}

@media only screen and (min-width: 900px) {
    .hero__wrap {
        flex-direction:row;
        position: relative;
        margin-inline:auto;align-items: flex-start
    }
}

@media only screen and (min-width: 900px) {
    .hero__content {
        width:55%
    }
}

.hero__image {
    flex: 1
}

.hero__image img {
    width: 100%;
    height: 100%;
    /*max-height: 40rem;*/
    object-fit: scale-down
}

.hero__title h1 {
    font-weight: 700;
    font-size: 40px;
    line-height: 3.9rem;
    text-align: right;
    color: #000000;
    margin-bottom: 15px;
    text-transform: uppercase;
}

@media only screen and (min-width: 900px) {
 .hero__title h2,.hero__title h3,.hero__title h4,.hero__title h5,.hero__title h6, h1 {
        text-align:left;
        font-size: 4rem;
        line-height: 6rem
    }

}

.hero__title span {
    font-size: 4.8rem;
    line-height: 7.2rem;
    display: inline-block;
    width: 100%
}

@media only screen and (min-width: 900px) {
    .hero__title span {
        all:unset
    }
}

.hero__text {
    font-weight: 700;
    font-size: var(--text-sm);
    line-height: 2.9rem;
    text-align: center;
    color: #117770;
}

@media only screen and (min-width: 900px) {
    .hero__text {
        font-size:var(--text-base-size);
        text-align: left
    }
}

@media only screen and (min-width: 900px) {
    .hero__text.mobile-image {
        display:block
    }
}

.hero__text .cta {
    margin-top: 3rem;
    font-size: var(--text-lg);
    font-weight: bold
}

.hero__text h2,.hero__text h3,.hero__text h4,.hero__text h5,.hero__text h6, .bonus-title {
    color: var(--color-text-light);
    margin-top: var(--space-sm);
    font-size: 22px;
    font-weight: 700
}

.sitemap {
    margin-top: var(--space-md)
}

.sitemap__wrap {
    display: flex;
    flex-wrap: wrap;
    margin-block:var(--space-xl);row-gap: var(--space-lg);
    margin-top: 3rem
}

.sitemap__item {
    flex: 1 1 33%;
    min-width: 30rem
}

.sitemap__title {
    display: flex;
    align-items: center;
    gap: var(--space-md)
}

.sitemap__count {
    position: relative;
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 50%;
    background: var(--color-primary);
    background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 640 512%27%3E%3Cpath fill=%27%23ffffff%27 d=%27M640 264v-16c0-8.84-7.16-16-16-16H344v-40h72c17.67 0 32-14.33 32-32V32c0-17.67-14.33-32-32-32H224c-17.67 0-32 14.33-32 32v128c0 17.67 14.33 32 32 32h72v40H16c-8.84 0-16 7.16-16 16v16c0 8.84 7.16 16 16 16h104v40H64c-17.67 0-32 14.33-32 32v128c0 17.67 14.33 32 32 32h160c17.67 0 32-14.33 32-32V352c0-17.67-14.33-32-32-32h-56v-40h304v40h-56c-17.67 0-32 14.33-32 32v128c0 17.67 14.33 32 32 32h160c17.67 0 32-14.33 32-32V352c0-17.67-14.33-32-32-32h-56v-40h104c8.84 0 16-7.16 16-16zM256 128V64h128v64H256zm-64 320H96v-64h96v64zm352 0h-96v-64h96v64z%27/%3E%3C/svg%3E");
    background-position: center;
    background-size: 50%;
    background-repeat: no-repeat
}

.sitemap__count.casino {
    background-image: url("data:image/svg+xml,%3Csvg width=%2745%27 height=%2745%27 viewBox=%270 0 45 45%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27m13.938 12.183 3.145 5.273c.31-.188.645-.335.996-.434l12.475-3.602-6.789-12.413a1.28 1.28 0 0 0-.163-.246l-9.665 11.422Zm7.85-.77c.515-.376 1.193-.016 1.528.803.335.819.196 1.785-.31 2.162-.515.376-1.193.016-1.528-.803-.343-.818-.196-1.785.31-2.161ZM.335 11.39l12.042-.214L21.853 0 10.678 1.032a1.92 1.92 0 0 0-1.242.614L.425 11.275c-.033.04-.066.065-.09.114Zm15.236-8.925c.686-.32 1.405-.246 1.61.188.204.426-.18 1.04-.867 1.367-.678.32-1.396.246-1.609-.18-.204-.426.188-1.04.866-1.375Zm-4.795 5.747c.686-.319 1.405-.245 1.6.18.213.434-.17 1.04-.857 1.376-.678.327-1.397.246-1.61-.188-.204-.426.188-1.04.867-1.368Zm-.474-5.47c.678-.335 1.397-.245 1.601.181.204.426-.18 1.032-.858 1.36-.686.335-1.413.245-1.617-.173-.196-.425.188-1.048.874-1.367ZM5.612 8.05c.679-.328 1.397-.246 1.602.18.204.434-.18 1.031-.858 1.367-.686.328-1.405.246-1.618-.18-.204-.426.188-1.04.874-1.367ZM0 13.223c.04.123.098.238.155.344l7.222 12.691c.343.598.972.958 1.658.974l1.961.017 3.726.024.057-3.086c-.482-.434-.67-.991-.433-1.335a.626.626 0 0 1 .465-.262l.025-1.31a4.573 4.573 0 0 1 .858-2.571l-3.399-5.699L0 13.223Zm8.643 6.387c.27-.393.989-.352 1.618.082.613.425.907 1.088.637 1.482-.278.393-1.005.352-1.617-.082-.621-.426-.907-1.098-.638-1.482Zm-5.13-3.505c.27-.393.988-.352 1.61.082.62.434.906 1.097.637 1.49-.27.385-.997.344-1.618-.082-.62-.433-.899-1.105-.63-1.49Zm12.679 19.79c0 1.016.515 1.957 1.365 2.481l10.228 6.207a2.873 2.873 0 0 0 1.487.417c.335 0 .678-.057.997-.18l12.327-4.569a2.868 2.868 0 0 0 1.871-2.595l.531-15.008a2.832 2.832 0 0 0-.482-1.695 2.834 2.834 0 0 0-1.152-1l-10.146-4.855a2.889 2.889 0 0 0-2.026-.172l-12.655 3.66a2.855 2.855 0 0 0-1.413.934 2.908 2.908 0 0 0-.646 1.777l-.277 14.598h-.009Zm25.522-14.697-12.606 4.323-9.37-5.363 11.952-3.455a1.021 1.021 0 0 1 .727.057l9.28 4.446.017-.008Zm-11.74 21.78-.049-15.803 13.243-4.536-.53 14.96a1.035 1.035 0 0 1-.679.941l-11.985 4.438ZM18.022 35.92l.278-14.484 9.803 5.616.05 15.615-9.632-5.855a1.059 1.059 0 0 1-.49-.892h-.009Z%27 fill=%27%23fff%27/%3E%3Cpath d=%27M37.351 21.624c-.751-.066-1.331-.508-1.29-.983.04-.475.686-.802 1.446-.728.751.065 1.331.507 1.29.982-.04.475-.686.802-1.446.729Zm-6.192-.491c-.752-.066-1.332-.508-1.29-.983.04-.475.686-.802 1.445-.728.752.065 1.332.507 1.291.982-.04.475-.686.802-1.446.729Zm-6.56 0c-.752-.066-1.332-.508-1.291-.983.04-.475.686-.802 1.446-.728.751.065 1.331.507 1.29.982-.04.475-.686.802-1.445.729Zm15.114 7.033c-.376-.287-.31-1.007.147-1.613.457-.606 1.135-.86 1.511-.573.376.286.31 1.007-.147 1.613-.457.606-1.135.86-1.511.573Zm-7.378.074c.458-.606 1.136-.86 1.512-.573.376.286.31 1.007-.147 1.613-.458.605-1.136.86-1.512.573-.375-.287-.31-1.007.147-1.613Zm8.986 6.517c.376.287.31 1.007-.147 1.613-.457.606-1.135.86-1.511.573-.376-.286-.31-1.007.147-1.613.457-.606 1.136-.86 1.511-.573Zm-3.651-3.774c.376.286.31 1.007-.147 1.613-.458.605-1.136.86-1.511.573-.376-.287-.31-1.008.147-1.613.457-.606 1.135-.86 1.511-.573Zm-3.472 5.567c.376.287.31 1.007-.147 1.613-.457.606-1.135.86-1.511.573-.376-.286-.31-1.007.147-1.613.458-.606 1.136-.86 1.511-.573Zm-8.218-6.812c-.417.221-1.046-.14-1.397-.81-.352-.672-.303-1.393.114-1.614.417-.22 1.046.14 1.397.81.351.672.302 1.393-.114 1.614Zm-5-2.488c-.417.22-1.046-.14-1.397-.811-.352-.672-.303-1.392.114-1.613.417-.221 1.046.139 1.397.81.351.672.302 1.392-.114 1.613Zm3.529 4.87c.416-.22 1.045.14 1.397.811.35.672.302 1.392-.115 1.613-.416.221-1.046-.14-1.397-.81-.351-.672-.302-1.392.115-1.614Zm-4.999-2.497c.416-.22 1.045.14 1.396.811.352.671.303 1.392-.114 1.613-.417.221-1.046-.14-1.397-.81-.351-.672-.302-1.392.114-1.614Zm5.097 7.754c.417-.22 1.046.14 1.397.81.351.672.302 1.393-.114 1.614-.417.221-1.046-.14-1.397-.81-.351-.672-.302-1.393.114-1.614Zm-4.902-2.865c.417-.221 1.046.139 1.397.81.351.672.302 1.392-.114 1.613-.417.221-1.046-.139-1.398-.81-.35-.672-.302-1.392.115-1.613Z%27 fill=%27%23fff%27/%3E%3C/svg%3E");
    background-size: 60%
}

.sitemap__count.slot {
    background-image: url("data:image/svg+xml,%3Csvg width=%27104%27 height=%27125%27 viewBox=%270 0 104 125%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M28.55 39.5H15.88c-1.64 0-2.97 1.31-2.97 2.93v12.51c0 1.62 1.33 2.93 2.97 2.93h12.67c1.64 0 2.97-1.31 2.97-2.93V42.43c0-1.62-1.33-2.93-2.97-2.93ZM17.53 54.96a1.6 1.6 0 0 1-1.22-1.23c-.21-1.03.59-1.93 1.59-1.93.89 0 1.62.72 1.62 1.6 0 1-.94 1.79-1.99 1.56Zm.74-4.71c-1.18.26-2.22-.76-1.95-1.93.13-.59.61-1.06 1.21-1.19 1.18-.26 2.22.76 1.95 1.93-.13.59-.61 1.06-1.21 1.19Zm-.37-4.67c-1 0-1.8-.9-1.59-1.93.12-.61.61-1.1 1.22-1.23 1.05-.23 1.99.56 1.99 1.56 0 .89-.73 1.6-1.62 1.6Zm8.27 9.38a1.6 1.6 0 0 1-1.22-1.23c-.21-1.03.59-1.93 1.59-1.93.89 0 1.62.72 1.62 1.6 0 1-.94 1.79-1.99 1.56Zm.74-4.71c-1.18.26-2.22-.76-1.95-1.93.13-.59.61-1.06 1.21-1.19 1.18-.26 2.22.76 1.95 1.93-.13.59-.61 1.06-1.21 1.19Zm-.37-4.67c-1 0-1.8-.9-1.59-1.93.12-.61.61-1.1 1.22-1.23 1.05-.23 1.99.56 1.99 1.56 0 .89-.73 1.6-1.62 1.6Zm16.12-5.79v6.68h3.07s1.1-1.99 3.05-1.99c1.95 0 2.19.96 4.91.98-5.47 3.6-8.81 6.51-8.27 12.13h10.72s-2.48-5.03.47-9.75c2.96-4.72 4.65-5.68 4.65-5.68l-1.82-1.94s-2.19 1.85-6.51.67c-4.32-1.18-5.08-1.38-7.22-.39 0-.58.01-.68.01-.68l-3.06-.03Zm46.338 2.18c-1.42-.11-2.68-.02-3.78.21-.49-.51-2.9-2.88-5.82-2.88-3.26 0-5.91 2.98-5.91 2.98s2.64 2.98 5.91 2.98c.12 0 .24 0 .36-.01-.59.64-1.02 1.28-1.33 1.81.4.05.79.14 1.16.27a8.73 8.73 0 0 1 3.01-2.95c.11-.06.21-.12.31-.18.96-.51 2.12-.9 3.54-1.06-.06.06-.12.12-.17.18-.8.9-1.22 2.16-1.25 3.73.24-.03.48-.05.73-.05.15 0 .29 0 .43.02.03-1.26.35-2.24.95-2.93.79-.9 1.8-.97 1.84-.98.31-.01.55-.26.55-.56 0-.3-.23-.55-.53-.58Zm2.023 10.91c0 2.87-2.35 5.19-5.26 5.19-1.37 0-2.63-.52-3.56-1.38a5.802 5.802 0 0 0-.01-7.62 5.26 5.26 0 0 1 3.57-1.38c2.9 0 5.26 2.33 5.26 5.19Z%27 fill=%27%23fff%27/%3E%3Cpath d=%27M77.67 58.07c2.905 0 5.26-2.324 5.26-5.19 0-2.866-2.355-5.19-5.26-5.19s-5.26 2.324-5.26 5.19c0 2.866 2.355 5.19 5.26 5.19Z%27 fill=%27%23fff%27/%3E%3Cpath d=%27M10.35 18.89C4.64 18.89 0 23.46 0 29.11v39.15c0 5.65 4.64 10.23 10.35 10.23h83.22c5.72 0 10.36-4.58 10.36-10.23V29.11c0-5.65-4.64-10.22-10.36-10.22H10.35Zm23.84 43.63c0 2.54-2.08 4.6-4.65 4.6H14.89c-2.56 0-4.65-2.06-4.65-4.6V34.84c0-2.53 2.08-4.59 4.65-4.59h14.66c2.56 0 4.65 2.06 4.65 4.59v27.68h-.01Zm29.75 0c0 2.54-2.08 4.6-4.65 4.6H44.63c-2.56 0-4.65-2.06-4.65-4.6V35.25c0-2.76 2.27-5 5.07-5h14.24c2.57 0 4.65 2.05 4.65 4.59v27.68Zm29.75 0c0 2.54-2.07 4.6-4.65 4.6H74.38c-2.56 0-4.65-2.06-4.65-4.6V34.84c0-2.53 2.08-4.59 4.65-4.59h14.66c2.57 0 4.65 2.06 4.65 4.59v27.68Zm-.23 20.98H10.24c-1.36 0-2.68-.17-3.93-.5l-.02 32c0 5.53 4.54 10 10.13 10h70.83c5.59 0 10.13-4.47 10.13-10l.02-32.01c-1.26.33-2.58.51-3.94.51ZM66.812 13.88C66.742 6.2 60.422 0 52.622 0s-14.12 6.2-14.2 13.88h28.39Z%27 fill=%27%23fff%27/%3E%3C/svg%3E")
}

.sitemap__count.payment_method {
    background-image: url("data:image/svg+xml,%3Csvg width=%2745%27 height=%2745%27 viewBox=%270 0 45 45%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M32.12 3.585.593 15.081l-.35-.97a3.973 3.973 0 0 1 2.37-5.1L26.67.24a3.971 3.971 0 0 1 5.092 2.382l.35.963h.008Zm3.716 16.163H14.614c-3.544 0-6.428 2.888-6.428 6.43v3.67a3.984 3.984 0 0 1-3.16-2.57l-3.17-8.713L33.392 7.07l3.169 8.714a4.011 4.011 0 0 1-.725 3.965Z%27 fill=%27%23fff%27/%3E%3Cpath d=%27M40.21 44.992H14.613a4.802 4.802 0 0 1-4.79-4.798V26.185a4.796 4.796 0 0 1 4.79-4.797H40.21c.228 0 .448.016.668.057 2.338.31 4.122 2.35 4.122 4.749v14.009A4.798 4.798 0 0 1 40.202 45l.008-.008Zm-25.597-21.98a3.166 3.166 0 0 0-3.16 3.165v14.01a3.166 3.166 0 0 0 3.16 3.165H40.21a3.173 3.173 0 0 0 3.169-3.166V26.177a3.158 3.158 0 0 0-2.737-3.133 2.836 2.836 0 0 0-.432-.04H14.613v.008Z%27 fill=%27%23fff%27/%3E%3Cpath d=%27M18.842 39.909h-3.153a.999.999 0 0 1-.994-.996c0-.546.448-.995.994-.995h3.153c.546 0 .994.449.994.995a.999.999 0 0 1-.994.996Zm6.769 0H22.46a.999.999 0 0 1-.994-.996c0-.546.448-.995.994-.995h3.152c.546 0 .994.449.994.995a.999.999 0 0 1-.994.996Zm6.77 0h-3.153a.999.999 0 0 1-.994-.996c0-.546.448-.995.994-.995h3.153c.546 0 .994.449.994.995a.999.999 0 0 1-.994.996Zm6.77 0H36a.999.999 0 0 1-.994-.996c0-.546.448-.995.994-.995h3.152c.546 0 .994.449.994.995a.999.999 0 0 1-.994.996Zm-6.208-7.751a2.968 2.968 0 0 0 2.965-2.97c0-1.64-1.327-2.97-2.965-2.97a2.968 2.968 0 0 0-2.965 2.97c0 1.64 1.327 2.97 2.965 2.97Z%27 fill=%27%23fff%27/%3E%3Cpath d=%27M37.171 32.158a2.968 2.968 0 0 0 2.966-2.97c0-1.64-1.328-2.97-2.966-2.97a2.968 2.968 0 0 0-2.965 2.97c0 1.64 1.328 2.97 2.965 2.97Z%27 fill=%27%23fff%27/%3E%3Cpath d=%27M40.21 44.992H14.613a4.802 4.802 0 0 1-4.79-4.798V26.185a4.796 4.796 0 0 1 4.79-4.797H40.21c.228 0 .448.016.668.057 2.338.31 4.122 2.35 4.122 4.749v14.009A4.798 4.798 0 0 1 40.202 45l.008-.008Zm-25.597-21.98a3.166 3.166 0 0 0-3.16 3.165v14.01a3.166 3.166 0 0 0 3.16 3.165H40.21a3.173 3.173 0 0 0 3.169-3.166V26.177a3.158 3.158 0 0 0-2.737-3.133 2.836 2.836 0 0 0-.432-.04H14.613v.008Z%27 fill=%27%23fff%27/%3E%3C/svg%3E");
    background-size: 60%
}

.sitemap__count::after {
    display: flex;
    align-items: center;
    justify-content: center;
    content: attr(data-count);
    position: absolute;
    color: var(--color-white);
    background: var(--color-primary-dark);
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    right: -1.3rem;
    top: -1.3rem;
    border: .1rem solid var(--color-white);
    font-size: var(--text-sm)
}

.sitemap__list {
    margin-top: var(--space-md);
    list-style-type: disc;
    padding-left: 2.5rem
}

.sitemap__list-item {
    position: relative;
    line-height: 3.5rem
}

.sitemap__list-item:last-of-type::after {
    height: 50%
}

.sitemap__list-item a::before {
    content: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 576 512%27 width=%2713%27 height=%2713%27%3E%3Cpath fill=%27%23000000%27 d=%27M544 0h-.056l-96.167.167c-28.442.049-42.66 34.539-22.572 54.627l35.272 35.272L163.515 387.03c-4.686 4.686-4.686 12.284 0 16.97l8.484 8.485c4.687 4.686 12.285 4.686 16.971 0l296.964-296.964 35.272 35.272c20.023 20.023 54.578 5.98 54.627-22.572L576 32.055C576.03 14.353 561.675 0 544 0zm-.167 128.167l-96-96L544 32l-.167 96.167zM448 227.681V464c0 26.51-21.49 48-48 48H48c-26.51 0-48-21.49-48-48V112c0-26.51 21.49-48 48-48h323.976c3.183 0 6.235 1.264 8.485 3.515l8 8c7.56 7.56 2.206 20.485-8.485 20.485H48c-8.837 0-16 7.163-16 16v352c0 8.837 7.163 16 16 16h352c8.837 0 16-7.163 16-16V235.68c0-3.183 1.264-6.235 3.515-8.485l8-8c7.559-7.559 20.485-2.205 20.485 8.486z%27%3E%3C/path%3E%3C/svg%3E");
    margin-right: .8rem
}

.sitemap__list-date {
    font-size: var(--text-xs);
    color: var(--text-dark)
}

.splash-screen__background {
    height: 100vh;
    background: var(--splash-screen-bg, var(--gradient-secondary))
}

.splash-screen__main {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: max-content;
    width: calc(100% - 4rem);
    padding: 4rem 4rem;
    background: var(--gradient-secondary);
    box-shadow: 8px 8px 20px 0px rgba(0,0,0,.2196078431);
    border-radius: var(--border-radius);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem
}

.splash-screen__logo {
    border: 5px solid #f0f8ff;
    border-radius: var(--border-radius);
    padding: 3rem;
    margin-bottom: 2.5rem;
    box-shadow: inset 0px 0px 20px 5px rgba(0,0,0,.09)
}

.splash-screen__logo img {
    display: block;
    width: 90px;
    height: auto
}

.splash-screen__title {
    color: var(--splash-screen-text-color, var(--color-white));
    font-size: var(--text-lg);
    font-weight: 700;
    text-align: center
}

.splash-screen__bar {
    width: 95%;
    height: 1.2rem;
    margin-block:1rem .4rem;margin-inline:auto;padding-inline:.3rem;border-radius: var(--border-radius);
    background: linear-gradient(rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.3));
    box-shadow: 8px 8px 20px 0px rgba(0,0,0,.2196078431);
    overflow: hidden;
    display: flex;
    align-items: center
}

.splash-screen__bar--progress {
    width: 0%;
    height: .6rem;
    margin-bottom: 0;
    animation: full 2s ease-in-out forwards;
    border-radius: var(--border-radius);
    background: var(--color-white)
}

@keyframes full {
    from {
        width: 0%
    }

    to {
        width: 100%
    }
}

.splash-screen__text {
    color: var(--splash-screen-text-color, var(--color-white));
    font-size: var(--text-sm);
    font-weight: 500;
    text-align: center
}

.splash-screen__link {
    text-decoration: none;
    font-size: var(--text-sm);
    text-align: center;
    background: var(--splash-screen-cta-bg, var(--gradient-button));
    padding: 1.4rem 3rem;
    border-radius: .8rem;
    color: var(--color-white);
    transition: box-shadow .2s ease-in-out
}

.splash-screen__link:hover {
    color: var(--color-white);
    box-shadow: inset 0px 0px 20px 5px rgba(0,0,0,.2196078431)
}

.template-404 .header {
    background: var(--gradient-main)
}

.page-404 {
    padding: var(--space-lg) var(--space-default)
}

.page-404__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-md);
    font-size: 9.6rem;
    font-weight: 700;
    margin-bottom: var(--space-lg);
    color: var(--page404-text-color, var(--color-text))
}

.page-404__logo svg {
    width: 80px;
    height: 80px
}

.page-404__heading {
    font-size: var(--text-lg);
    font-weight: bold;
    text-align: center;
    margin-bottom: var(--space-md);
    color: var(--page404-text-color, var(--color-text))
}

.page-404__text {
    font-size: var(--text-sm);
    color: var(--page404-text-color, var(--color-text));
    text-align: center;
    margin-bottom: var(--space-md)
}

.page-404__controls {
    padding: 0 2.6rem;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm)
}

.page-404__controls .btn {
    border-radius: var(--border-radius-sm)
}

.page-404__controls a {
    font-size: var(--text-sm)
}

.anchorMenu {
    padding: 0;
    height: 8.7rem
}

.anchorMenu .inner {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 1.5rem
}

.anchorMenu .inner.js-fixed {
    position: fixed;
    top: 0;
    z-index: 10;
    width: 100%
}

.anchorMenu .inner.scroll {
    transform: translate3d(0, -80px, 0)
}

.anchorMenu .inner__menu {
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    height: 5rem;
    padding: 0;
    max-width: var(--container-width);
    margin-inline:auto;-ms-overflow-style: none;
    scrollbar-width: none
}

.anchorMenu .inner__menu::-webkit-scrollbar {
    display: none
}

.anchorMenu .inner__menu ul {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start
}

.anchorMenu .inner__menu ul li {
    position: relative
}

.anchorMenu .inner__menu ul li[data-bonus-count]:before {
    position: absolute;
    content: attr(data-bonus-count);
    color: var(--color-white);
    background: var(--color-anchor-menu-secondary);
    font-weight: bold;
    font-size: var(--text-xs);
    text-align: center;
    bottom: -0.7rem;
    left: 50%;
    transform: translate(-50%, 0);
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 10px;
    padding: .3rem;
    pointer-events: none
}

.anchorMenu .inner__menu ul li:not(:last-child) {
    margin-right: .8rem
}

.anchorMenu .inner__menu ul li a {
    background: linear-gradient(180deg, #1b120d 0%, #31231b 100%);
    border-radius: 8px;
    color: #fec393;
    font-size: var(--text-sm);
    line-height: 2.1rem;
    white-space: nowrap;
    padding: 1rem 2rem;
    display: block;
    text-decoration: none;
    font-weight: 400;
    text-transform: capitalize;
}

.anchorMenu .inner__menu ul li a.active,.anchorMenu .inner__menu ul li a:active {
    background: #d8c8bb;
    color: #1b120d;
    font-weight: 600
}

.anchorMenu .inner__menu ul li a::after {
    display: block;
    content: attr(title);
    font-weight: 600;
    height: 0;
    overflow: hidden;
    visibility: hidden
}

.anchorMenu .inner .js-progressbar {
    display: block;
    width: 100%;
    background: linear-gradient(180deg, #1b120d 0%, #31231b 100%);
    border-radius: .8rem;
    max-width: var(--container-width);
    margin-inline:auto}

.anchorMenu .inner .js-progressbar div {
    height: .7rem;
    border-radius: .8rem;
    background: linear-gradient(180deg, #d8c8bb, #837264);
    max-width: 100%
}

/* .button,.cta {
    background: linear-gradient(rgb(195 108 20),rgb(223, 142, 29),rgb(250, 162, 38)0);
    box-shadow: 0 0 4px #fd4707b3;
    border-radius: 10%;
padding-top: 6px;
padding-bottom: 6px;
    color: var(--color-button-text, #fff);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    text-transform: uppercase;
}

.button:hover,.button:active,.cta:hover,.cta:active {
    color: var(--color-button-text-hover, #fff);
    background: linear-gradient(#f80, #ff5c00, #ff8c00);
} */

.cookie-notice {
    position: fixed;
    right: 1.4rem;
    bottom: 1.4rem;
    margin-left: 1.4rem;
    z-index: 20;
    max-width: 350px;
    background: var(--color-body);
    padding: 2rem 3rem;
    border-radius: var(--border-radius);
    box-shadow: 8px 8px 20px 0px rgba(0,0,0,.2196078431);
    font-size: var(--text-sm)
}

@media only screen and (max-width: 479px) {
    .cookie-notice {
        max-width:unset;
        width: calc(100% - 2.8rem)
    }
}

.cookie-notice__close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    color: #979797;
    font-size: 1.8rem;
    line-height: 1.8rem;
    cursor: pointer;
    transition: color .2s ease-in-out
}

.cookie-notice__close:hover {
    color: #717171
}

.cookie-notice__title {
    font-weight: 700;
    margin-bottom: 1rem
}

.cookie-notice__text {
    margin-bottom: 2rem
}

.cookie-notice__text a {
    display: inline-block;
    margin-top: .6rem
}

.cookie-notice__buttons {
    display: flex;
    gap: 1.8rem
}

@media only screen and (max-width: 399px) {
    .cookie-notice__buttons {
        flex-direction:column;
        gap: .8rem
    }
    .hero__title h1 {
        font-size: 15px;
    }
}

.cookie-notice__buttons button {
    flex: 1;
    padding-block:1rem;border-radius: var(--border-radius);
    border: none;
    cursor: pointer;
    font-weight: 500
}

.cookie-notice__accept {
    background: var(--gradient-button);
    color: var(--color-white)
}

.cookie-notice__read-more {
    background: var(--color-gray)
}

.hamburger-btn {
    width: 30px;
    height: 30px;
    position: relative;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
    outline: none;
    appearance: none;
    background-color: rgba(0,0,0,0);
    border: none;
    will-change: transform
}

.hamburger-btn span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    background: #117770;
    border-radius: var(--border-radius);
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .1s ease-in-out;
    -moz-transition: .1s ease-in-out;
    -o-transition: .1s ease-in-out;
    transition: .1s ease-in-out;
    pointer-events: none
}

.hamburger-btn span:nth-child(1) {
    top: .5rem;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center
}

.hamburger-btn span:nth-child(2) {
    top: 1.5rem;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center
}

.hamburger-btn span:nth-child(3) {
    top: 2.5rem;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center
}

.hamburger-btn.open span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 4px;
    left: 5px
}

.hamburger-btn.open span:nth-child(2) {
    width: 0%;
    opacity: 0
}

.hamburger-btn.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 25px;
    left: 4px
}

.language-selector {
    color: var(--color-heading);
    margin-top: var(--space-lg);
    font-size: var(--text-sm);
    line-height: 2.4rem;
    position: relative
}

.language-selector__options {
    position: absolute;
    top: 52px;
    right: 0;
    width: max-content;
    padding: 1rem 1.5rem;
    border-radius: var(--border-radius-sm);
    background: var(--color-white);
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,.12)
}

.language-selector__options.hidden {
    display: none
}

.language-selector__options .language-selector__item {
    border-bottom: 1px solid #eee;
    padding: .9rem 1.3rem;
    text-decoration: none;
    color: #333;
    text-transform: initial
}

.language-selector__options .language-selector__item:last-of-type {
    border-bottom: none
}

.language-selector__item {
    display: flex;
    gap: .9rem;
    align-items: center;
    cursor: pointer;
    text-transform: capitalize
}

.language-selector__item img {
    border-radius: 50%
}

.language-selector__selected {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding-block:.9rem;padding-inline:1.5rem 1.3rem;border-radius: var(--border-radius-sm);
    background: rgba(0,0,0,.15);
    cursor: pointer;
    color: var(--color-white)
}

.language-selector__selected .language-selector__item {
    width: max-content;
    gap: .7rem;
    justify-content: center;
    text-transform: initial
}

.newsletter {
    z-index: 10;
    opacity: 0;
    position: fixed;
    bottom: 15%;
    right: -250px;
    width: 250px;
    background: var(--color-white);
    padding-block:4rem 3rem;padding-inline:2.4rem;border-radius: var(--border-radius-left);
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,.2509803922);
    transition-property: opacity right;
    transition-duration: .2s;
    transition-timing-function: ease-in-out
}

@media only screen and (min-width: 900px) {
    .newsletter {
        padding-block:3rem
    }
}

.newsletter.visible {
    opacity: 100%
}

.newsletter.open {
    right: 0
}

@media only screen and (min-width: 900px) {
    .newsletter.open .newsletter__toggle--desktop img {
        transform:rotate(0)
    }
}

.newsletter.open .newsletter__toggle--mobile {
    opacity: 0
}

.newsletter__close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    font-weight: 700;
    font-size: var(--text-lg);
    line-height: 2rem
}

@media only screen and (min-width: 900px) {
    .newsletter__close {
        display:none
    }
}

.newsletter__toggle--desktop {
    display: none
}

@media only screen and (min-width: 900px) {
    .newsletter__toggle--desktop {
        display:flex;
        align-items: center;
        gap: 1rem;
        position: absolute;
        height: 85%;
        right: 250px;
        top: 50%;
        transform: translateY(-50%) rotate(180deg);
        writing-mode: vertical-rl;
        padding: 1rem .7rem;
        border-radius: var(--border-radius-right);
        background: var(--gradient-main);
        box-shadow: 0px 0px 20px 0px rgba(0,0,0,.2509803922);
        text-align: center;
        color: var(--color-white);
        font-weight: 500;
        cursor: pointer
    }

    .newsletter__toggle--desktop img {
        transform: rotate(180deg);
        transition: transform .4s ease-in-out
    }

    .newsletter__toggle--desktop span {
        flex: 1;
        padding-bottom: 1.4rem
    }
}

.newsletter__toggle--mobile {
    position: absolute;
    right: 250px;
    width: 42px;
    height: 42px;
    top: calc(100% - 42px);
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--gradient-main);
    border-radius: var(--border-radius-left);
    opacity: 100%;
    transition: opacity .25s ease-in-out;
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,.2509803922)
}

@media only screen and (min-width: 900px) {
    .newsletter__toggle--mobile {
        display:none
    }
}

.newsletter__title {
    margin-bottom: var(--space-md)
}

.newsletter__inputs {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    margin-bottom: 1.5rem
}

.newsletter__inputs input {
    border-radius: var(--border-radius);
    border: 1px solid #20202d;
    height: 4rem;
    text-indent: 1.2rem
}

.newsletter__text {
    margin-bottom: 1.2rem
}

.newsletter .button {
    padding-block:1.3rem;padding-inline:0;width: 100%;
    cursor: pointer
}

.ctaBox {
    background: var(--gradient-ctabox, var(--gradient-main));
    border-radius: var(--border-radius);
    padding: 6rem var(--space-md);
    display: flex;
    flex-direction: column;
    gap: 2.4rem;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    color: var(--color-ctabox-text, #117770);
    text-align: center;
    position: relative
}

.ctaBox-text {
    max-width: 80%;
    margin: 0 auto;
    font-size: 14px;
    font-weight: 400
}

.ctaBox-main-text {
    display: flex;
    font-size: 28px;
    line-height: 32px;
    font-weight: bold;
    flex-direction: column;
    gap: var(--space-sm);
    max-width: 80%;
    margin: 0 auto
}

.ctaBox .button {
    background-color: var(--ctabox-button-bg, #48E16A);
    color: var(--ctabox-button-text, #fff) !important
}

.card-welcome {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0
}

@media only screen and (min-width: 900px) {
    .card-welcome {
        width:255px
    }
}

.card-welcome__container {
    margin-top: 2.5rem;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    display: flex;
    gap: 1.5rem
}

.card-welcome__container::-webkit-scrollbar {
    display: none
}

@media only screen and (min-width: 900px) {
    .card-welcome__container {
        gap:var(--space-lg)
    }
}

.card-welcome__title {
    font-size: var(--text-lg);
    line-height: 3rem;
    font-weight: 700;
    color: var(--color-heading);
    text-align: center
}

@media only screen and (min-width: 900px) {
    .card-welcome__title {
        font-size:var(--text-lg);
        line-height: 2.7rem;
        display: flex;
        align-items: flex-end;
        min-height: 10%
    }
}

.card-welcome__image {
    width: 100%
}

.card-welcome__image img {
    width: 100%;
    margin-top: 1.1rem;
    border-radius: var(--border-radius);
    height: 311px
}

@media only screen and (min-width: 900px) {
    .card-welcome__image img {
        height:255px !important;
        object-fit: cover
    }
}

.card-welcome .button {
    margin-top: 1.5rem;
    width: 100%;
    padding-inline:0;font-weight: 700;
    font-size: var(--text-base-size);
    color: var(--welcome-btn-text-color, #fff) !important
}

.card-welcome__deposit {
    margin-top: .9rem;
    font-size: var(--text-md);
    font-weight: 700;
    line-height: 2.7rem;
    color: var(--color-heading);
    text-align: center
}

.card-welcome__deposit span {
    font-size: 2.2rem;
    line-height: 3.3rem;
    margin-left: .8rem
}

.card-welcome__oneliner {
    text-align: center;
    font-size: var(--text-sm);
    color: var(--color-module-text);
    line-height: 2.4rem
}

@media only screen and (min-width: 900px) {
    .card-welcome__oneliner {
        margin-top:.4rem;
        font-size: var(--text-base-size)
    }
}

.cardsList {
    display: flex;
    flex-direction: column;
    gap: 3rem
}

@media only screen and (min-width: 560px) {
    .cardsList {
        flex-wrap:wrap;
        flex-direction: row;
        gap: 2rem
    }
}

.module {
    padding-block:2.7rem;padding-inline:var(--space-md)}

@media only screen and (min-width: 900px) {
    .module {
        padding-inline:0
    }
}

.module .before-content {
    margin-bottom: var(--space-md)
}

.module .after-content {
    margin-top: var(--space-md)
}

.module .before-content,.module .after-content {
    color: var(--color-module-text)
}

.module .before-content>*,.module .after-content>* {
    margin-top: 2.3rem
}

.module .before-content p:first-of-type,.module .after-content p:first-of-type {
    margin-top: 0
}

.module h1+*,.module h2+*,.module h3+*,.module h4+*,.module h5+*,.module h6+* {
    margin-top: 0
}

.module h2,.module h3,.module h4,.module h5,.module h6 {
    margin-bottom: 1.8rem;
    color: #fec393;
    text-align: center;
}

.module img {
    height: auto
}

.module ul {
    margin-left: var(--space-lg)
}

.module ul li {
    list-style-type: disc
}

.module ol {
    margin-left: var(--space-lg)
}

.module ol li {
    list-style-type: decimal;
    padding-left: .3rem
}

.module ul,.module ol {
    color: #c6ab94;
}

.module:not(.content-module) h2,.module:not(.content-module) h3,.module:not(.content-module) h4,.module:not(.content-module) h5,.module:not(.content-module) h6 {
    margin-bottom: .8rem
}

.content-module {
    font-size: var(--text-sm);
    line-height: 2.4rem;
    color: #fff;
    border-bottom: 1px solid #d8c8bb;
}

.content-module img {
    border-radius: 8px;
    margin: 10px auto;
}

.content-module__card>* {
    margin-top: 2.3rem
}

.content-module__card p {
    color: #fff;
    word-wrap: break-word
}

.content-module__card p:first-of-type {
    margin-top: 0
}

@media only screen and (min-width: 900px) {
    .content-module {
        font-size:var(--text-base-size)
    }
}

.content-module .button {
    color: var(--color-white);
    font-weight: 700;
    font-size: var(--text-base-size)
}

@media only screen and (max-width: 479px) {
    .content-module .button {
        width:100%
    }
}

.content-module .overflow-table {
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    box-shadow: 10px 10px 50px 0px rgba(0,0,0,.1019607843)
}

.content-module .overflow-table::-webkit-scrollbar {
    display: none
}

.content-module .overflow-table table {
    /*width: 100%;*/
    min-width: 100%;
    padding: 1rem;
    border-collapse: separate;
    border-radius: 1rem;
    background-color: var(--color-table-bg);
    font-size: var(--text-base-size);
    box-shadow: 10px 10px 50px 0px rgba(0,0,0,.1019607843)
}

.content-module .overflow-table table thead {
    color: var(--color-table-text)
}

.content-module .overflow-table table thead th {
    text-align: left;
    font-weight: bold;
    border-bottom: 1px solid var(--color-table-sep);
    padding: 1rem;
}

.content-module .overflow-table table thead th:first-child {
    padding: 1rem
}

.content-module .overflow-table table td {
    color: #1b120d;
    padding:1rem}

.content-module .overflow-table table:has(thead) tbody td:first-child {
    font-weight: initial;
    color: #1b120d
}

.content-module .overflow-table table td:first-child {
    font-weight: 600;
    color: #1b120d
}

.content-module .overflow-table table tr:not(:last-of-type) td {
    border-bottom: 1px solid #1b120d
}

.content-module .overflow-table table tr td:first-child {
    padding-left: 1rem
}

.content-module .overflow-table table tr td:last-child {
    padding-right: 1rem
}

.content-module .overflow-table .floatfix {
    margin-bottom: var(--space-sm)
}

.content-module .overflow-table .floatfix:first-of-type {
    margin-bottom: 0
}

.content-module .overflow-table .floatfix::after {
    content: "";
    display: block;
    clear: both
}

.content-module__wrapper {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg)
}

@media only screen and (min-width: 900px) {
    .content-module__wrapper {
        flex-direction:row
    }
}

.content-module__content {
    width: 100%
}

@media only screen and (min-width: 900px) {
    .content-module__content {
        flex:50%
    }
}

.content-module .two-col {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg)
}

@media only screen and (min-width: 900px) {
    .content-module .two-col {
        flex-direction:row
    }
}

.content-module .two-col>div {
    flex-basis: 50%
}

.content-module__card h1+*,.content-module__card h2+*,.content-module__card h3+*,.content-module__card h4+*,.content-module__card h5+*,.content-module__card h6+* {
    margin-top: 0
}

.module:not(.hero-module) {
    font-size: var(--text-base-size)
}

.module.content-module p,.module.content-module ul {
    font-size: var(--text-base-size);
    color: #c6ab94;
}

.module.content-module .btn,.module.content-module .cta {
    color: var(--color-button-text, #fff)
}

.module.content-module .btn:hover,.module.content-module .cta:hover {
    color: #fff
}

.module.content-module a {
    color: #fff;
    margin-top: 15px;
    margin-bottom: 15px;

}
.center{
    text-align: center;
}

.module.content-module a:hover {
    color: #fff;
}

.module.content-module table {
    table-layout: fixed
}

.module.content-module table th:first-child {
    padding-left: var(--space-lg)
}

.module.content-module table th:last-child {
    padding-right: var(--space-lg)
}

.module.content-module table td:first-child {
    padding-left: var(--space-lg)
}

.module.content-module table td:last-child {
    padding-right: var(--space-lg)
}

.module.content-module .content-module__wrapper {
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0
}

.module.content-module .content-module__wrapper.top,.module.content-module .content-module__wrapper.bottom {
    flex-direction: column;
    justify-content: center
}

.module.content-module .content-module__wrapper.bottom {
    flex-direction: column-reverse
}

.module.content-module .content-module__wrapper.right {
    flex-direction: column;
    gap: var(--space-lg)
}

@media only screen and (min-width: 900px) {
    .module.content-module .content-module__wrapper.right {
        flex-direction:row-reverse;
        gap: var(--space-lg)
    }
}

@media only screen and (min-width: 900px) {
    .module.content-module .content-module__wrapper.left {
        gap:var(--space-lg)
    }
}

.module.content-module .content-module__image {
    flex-basis: 50%
}

.module.content-module .content-module__image.small {
    flex-basis: 35%
}

.module.content-module .content-module__image.large {
    flex-basis: 80%
}

.module.content-module .content-module__image.full {
    display: block
}

.module.content-module .content-module__image.full img {
    width: 100%
}

.module.content-module .content-module__image.full.bottom img {
    margin-top: var(--space-md)
}

.module.content-module .content-module__card {
    flex: 50%;
    font-size: var(--text-base-size)
}

.module.content-module .content-module__card.dark a:hover {
    color: var(--color-anchor-secondary-hover)
}

.module.content-module .content-module__card .game.card {
    width: 14rem
}

.module.content-module .content-module__card .game__image a:nth-child(2) {
    display: none;
    height: unset;
    bottom: 0
}

.module.content-module .content-module__card .game__image:hover a:nth-child(2) {
    display: flex
}

.module.content-module .content-module__card .game__overlay {
    border-width: .3rem;
    font-size: 1.8rem;
    text-decoration: none
}

.module.content-module .content-module__card .game__overlay svg {
    width: 60px;
    height: 60px;
    margin-top: 1rem
}

.faq {
    display: flex;
    flex-direction: column;
    gap: 1.5rem
}

.faq__item {
    background-color: var(--color-faq-bg);
    padding: 2.8rem var(--space-md);
    border-radius: 1rem;
    cursor: pointer;
    box-shadow: 5px 5px 50px 0px rgba(0,0,0,.1019607843)
}

.faq__question,.faq__answer-content {
    color: var(--color-faq-text, var(--color-text-dark));
    font-size: var(--text-sm);
    line-height: 2.4rem
}

.faq__question {
    font-weight: 600
}

@media only screen and (min-width: 900px) {
    .faq__question {
        font-size:var(--text-base-size);
        display: flex;
        justify-content: space-between;
        align-items: center
    }
}

.faq__icon {
    display: none
}

@media only screen and (min-width: 900px) {
    .faq__icon {
        display:block;
        font-size: var(--text-xxl);
        line-height: 2rem;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none
    }
}

.faq__answer-wrap {
    display: grid;
    grid-template-rows: 0fr;
    overflow: hidden;
    transition: all .3s
}

.faq__answer-wrap.open {
    margin-top: 1.2rem;
    grid-template-rows: 1fr
}

.faq__answer-wrap.open .faq__answer-content {
    visibility: visible
}

.faq__answer-content {
    align-self: end;
    min-height: 0;
    transition: visibility .3s;
    visibility: hidden;
    cursor: text
}

.proscons {
    display: flex;
    flex-direction: column;
    gap: 3.1rem
}

@media only screen and (min-width: 900px) {
    .proscons {
        flex-direction:row;
        gap: var(--space-lg)
    }
}

.proscons__pros,.proscons__cons {
    display: flex;
    flex-direction: column;
    gap: 1.5rem
}

@media only screen and (min-width: 900px) {
    .proscons__pros,.proscons__cons {
        flex-basis:50%
    }
}

.proscons__pros h1,.proscons__pros h2,.proscons__pros h3,.proscons__pros h4,.proscons__pros h5,.proscons__pros h6,.proscons__cons h1,.proscons__cons h2,.proscons__cons h3,.proscons__cons h4,.proscons__cons h5,.proscons__cons h6 {
    margin-bottom: 0
}

.proscons__title {
    font-size: var(--text-md);
    font-weight: 600;
    line-height: 2.7rem;
    color: var(--color-cons-title)
}

.proscons__item {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1.6rem var(--space-md);
    border-radius: 1rem;
    min-height: 8rem;
    background-color: var(--color-cons-bg);
    color: var(--color-cons-text);
    box-shadow: 5px 5px 50px 0px rgba(0,0,0,.1019607843)
}

.proscons__item--icon {
    flex-shrink: 0;
    color: var(--color-white);
    font-size: 1.2rem;
    line-height: 1.2rem;
    width: 3rem;
    height: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%
}

.proscons__item--icon.pro {
    color: #fff;
    background: linear-gradient(83.78deg, #14C81F -3.53%, #48E16A 116.18%)
}

.proscons__item--icon.pro svg {
    width: 1.6rem;
    height: 1.6rem
}

.proscons__item--icon.con {
    color: #fff;
    background: linear-gradient(83.78deg, #9E9E9E -3.53%, #C8C8C8 116.18%)
}

.proscons__item--icon.con svg {
    width: 1.6rem;
    height: 1.6rem
}

.proscons__item p {
    font-weight: 500
}

.proscons-module .module {
    padding: 0
}

.providers-block {
    border-block:solid 2.7rem var(--color-body);background: var(--gradient-providers-block)
}

.providers-block .container {
    padding-block:6.1rem 6.4rem;overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.providers-block .container::-webkit-scrollbar {
    display: none
}

.providers-block__title {
    margin-bottom: .8rem;
    color: var(--color-white)
}

.providers-block__text {
    font-weight: 500;
    font-size: var(--text-sm);
    line-height: 2.4rem;
    margin-bottom: 1.8rem;
    color: var(--color-white)
}

.providers-block__providers {
    display: grid;
    align-items: center;
    gap: 1.8rem 4.3rem;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    width: var(--container-width)
}

.providers-block__providers a {
    width: fit-content
}

.providers-block__providers img {
    display: block
}

.sticky-cta {
    position: sticky;
    bottom: 0;
    background:#201109;
    width: 100%;
    transition: all .3s ease-in-out;
    z-index: 10;
    height: 8rem;
    max-height: 8rem;
    overflow: hidden;
    border-radius: 8px;
}

.sticky-cta.hide {
    position: fixed;
    bottom: -180px
}

.sticky-cta .container {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-sm);
    padding: 0
}

@media only screen and (max-width: 639px) {
    .sticky-cta .container {
        padding:1.5rem;
        padding-right: 2.5rem
    }
}

@media only screen and (min-width: 900px) {
    .sticky-cta .container {
        padding:0 1.3rem;
        padding-right: 2.5rem
    }
}

.sticky-cta__logo {
    display: none
}

.sticky-cta__logo img {
    display: block;
    width: var(--logo-width);
    height: var(--logo-height)
}

@media only screen and (min-width: 640px) {
    .sticky-cta__logo {
        display:block
    }
}

.sticky-cta__oneliner {
    color: #fec393;
    font-weight: 800;
    font-size: 14px;
    line-height: 1.5rem;
    display: flex;
    flex-direction: column;
    max-width: 50%;
    text-align: center;
}

@media only screen and (max-width: 450px) {
    .sticky-cta__oneliner {
        display: none;
    }

    .sticky-cta .container a {
        margin: 0 auto;
    }
}

@media only screen and (min-width: 900px) {
    .sticky-cta__oneliner {
        flex-direction:row;
        gap: 5px;
        font-size: var(--text-md);
        line-height: 2.7rem;
        max-width: initial
    }
}

.sticky-cta .cta {
    font-weight: 700;
    font-size: var(--text-xs);
    line-height: 1.8rem;
    padding: 1.1rem var(--space-md);
    background: var(--sticky-cta-btn-bg, linear-gradient(#fe500c, #fd3307, #ff5a0e));
    color: var(--sticky-cta-btn-text, #fff)
}

@media only screen and (min-width: 900px) {
    .sticky-cta .cta {
        font-size:var(--text-sm);
        line-height: 2.1rem
    }
}

.sticky-cta__close {
    position: absolute;
    right: .2rem;
    top: .2rem;
    color: var(--sticky-cta-cross, #fff);
    width: 2.4rem;
    height: 2.4rem
}

.sticky-cta__close:hover {
    cursor: pointer
}

.card.game {
    width: 150px;
    text-align: center;
    text-decoration: none
}

@media only screen and (min-width: 900px) {
    .card.game {
        width:206px
    }
}

.card.game a {
    display: inline-block
}

.card.game img {
    display: block;
    width: 150px;
    height: 150px;
    border-radius: 5px
}

@media only screen and (min-width: 900px) {
    .card.game img {
        width:206px;
        height: 206px
    }
}

.card.game .game__title {
    margin-top: 1.1rem;
    font-size: var(--text-sm);
    line-height: 2rem;
    font-weight: 600;
    color: var(--color-slot-text);
    max-width: 150px
}

@media only screen and (min-width: 900px) {
    .card.game .game__title {
        max-width:206px
    }
}

.card.game .game__provider {
    font-size: var(--text-xs);
    line-height: 2rem;
    color: var(--color-slot-text)
}

.splide__arrows {
    display: none
}

@media only screen and (min-width: 900px) {
    .splide__arrows {
        display:block
    }
}

@media only screen and (min-width: 900px) {
    .splide__arrow {
        position:absolute;
        z-index: 1;
        top: 45%;
        background: none;
        border: none;
        padding: 0;
        cursor: pointer
    }

    .splide__arrow svg {
        display: block
    }

    .splide__arrow:disabled {
        visibility: hidden
    }

    .splide__arrow--prev {
        color: #d9d9d9;
        left: 0
    }
}

@media only screen and (min-width: 900px)and (min-width: 1248px) {
    .splide__arrow--prev {
        left:-5rem
    }
}

@media only screen and (min-width: 900px) {
    .splide__arrow--next {
        color:#d9d9d9;
        transform: translateY(-50%) rotate(180deg);
        right: 0
    }
}

@media only screen and (min-width: 900px)and (min-width: 1248px) {
    .splide__arrow--next {
        right:-5rem
    }
}

.splide__pagination {
    margin-top: 1rem !important;
    gap: var(--space-sm) !important
}

@media only screen and (min-width: 900px) {
    .splide__pagination {
        margin-top:3rem !important
    }
}

.splide__pagination li {
    display: flex !important
}

.splide__pagination__page {
    border: none;
    cursor: pointer;
    height: 12px;
    width: 12px;
    border-radius: 6px;
    background-color: var(--slider-slide-inactive, #D9D9D9)
}

@media only screen and (min-width: 900px) {
    .splide__pagination__page {
        height:12px;
        width: 12px
    }
}

.splide__pagination__page.is-active {
    background: var(--color-primary, #20202D)
}

@keyframes splide-loading {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(1turn)
    }
}

.splide__track--draggable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.splide__track--fade>.splide__list>.splide__slide {
    margin: 0!important;
    opacity: 0;
    z-index: 0
}

.splide__track--fade>.splide__list>.splide__slide.is-active {
    opacity: 1;
    z-index: 1
}

.splide--rtl {
    direction: rtl
}

.splide__track--ttb>.splide__list {
    display: block
}

.splide__container {
    box-sizing: border-box;
    position: relative
}

.splide__list {
    backface-visibility: hidden;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    margin: 0!important;
    padding: 0!important
}

.splide.is-initialized:not(.is-active) .splide__list {
    display: block
}

.splide__pagination {
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0;
    pointer-events: none
}

.splide__pagination li {
    display: inline-block;
    line-height: 1;
    list-style-type: none;
    margin: 0;
    pointer-events: auto
}

.splide:not(.is-overflow) .splide__pagination {
    display: none
}

.splide__progress__bar {
    width: 0
}

.splide {
    position: relative;
    visibility: hidden
}

.splide.is-initialized,.splide.is-rendered {
    visibility: visible
}

.splide__slide {
    backface-visibility: hidden;
    box-sizing: border-box;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    list-style-type: none!important;
    margin: 0;
    position: relative
}

.splide__slide img {
    vertical-align: bottom
}

.splide__spinner {
    animation: splide-loading 1s linear infinite;
    border: 2px solid #999;
    border-left-color: transparent;
    border-radius: 50%;
    bottom: 0;
    contain: strict;
    display: inline-block;
    height: 20px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 20px
}

.splide__sr {
    clip: rect(0 0 0 0);
    border: 0;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause {
    display: none
}

.splide__toggle.is-active .splide__toggle__pause {
    display: inline
}

.splide__track {
    overflow: hidden;
    position: relative;
    z-index: 0
}
.up_button {
    bottom: 100px;
    cursor: pointer;
    height: 55px;
    opacity: 0;
    position: fixed;
    right: 20px;
    text-align: center;
    transition: opacity .5s ease-in-out;
    width: 55px;
    z-index: 1000
}

@media only screen and (max-width: 768px) {
    .up_button {
        bottom:100px;
        left: auto;
        margin-left: 0;
        right: 20px;
    }
}
.img-wrp {
    margin: 20px auto;
    text-align: center;
}
.img-wrp img {
    width: 100%;
    height: auto;
}
a.disabled {
    cursor: pointer;
    pointer-events: none;
    opacity: 0.7;
}


.categories-menu[_ngcontent-ng-c3944384639] {
    position: sticky;
    top: var(--stb-header-height);
    z-index: 5;
    display: block;
    padding: 16px 0;
    border-bottom: 1px solid var(--stb-bg-tertiary);
    background-color: var(--stb-bg-primary)
}

@media screen and (min-width: 1280px) {
    .categories-menu[_ngcontent-ng-c3944384639] {
        margin-inline-start: calc(-1 * (100vw - 100% - var(--stb-sidebar-current-width)) / 2);
        margin-inline-end: calc(-1 * (100vw - 100% - var(--stb-sidebar-current-width)) / 2)
    }
}

[_nghost-ng-c3944384639] {
    display: contents
}

.entrance-page-layout[_ngcontent-ng-c3944384639] {
    --stb-page-indent-s-padding-top: 16px;
    --stb-gap: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--stb-gap);
    padding-block: var(--stb-page-indent-s-padding-top) var(--stb-page-indent-padding-bottom)
}

@media screen and (min-width: 1280px) {
    .entrance-page-layout[_ngcontent-ng-c3944384639] {
        --stb-page-indent-s-padding-top: 28px;
        --stb-gap: 28px
    }
}

.categories-menu-preloader[_ngcontent-ng-c3944384639] {
    margin: 16px auto
}

.main-banner[_ngcontent-ng-c3944384639] {
    display: block;
    overflow-x: hidden
}



@media screen and (min-width: 1280px) {
    .main-banner[_ngcontent-ng-c3944384639] {
        margin-inline-start: calc(-1 * (100vw - 100% - var(--stb-sidebar-current-width)) / 2);
        margin-inline-end: calc(-1 * (100vw - 100% - var(--stb-sidebar-current-width)) / 2)
    }
}

.order-0[_ngcontent-ng-c3944384639] {
    order: 0
}

.order-4[_ngcontent-ng-c3944384639] {
    order: 4
}

.order-7[_ngcontent-ng-c3944384639] {
    order: 7
}
.cover-button[_ngcontent-ng-c1910434900] {
    z-index: 2;
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    inset-inline-end: 0;
    bottom: 0;
    width: 100%;
    height: 100%
}

.description[_ngcontent-ng-c1910434900] {
    --stb-main-banner-title-font-size: 20px;
    --stb-main-banner-detail-font-size: 24px;
    --stb-main-banner-detail-line-height: 1.4;
    --stb-main-banner-caption-font-size: 14px;
    --stb-main-banner-caption-line-height: 1.4;
    display: inline;
    z-index: 1
}

.description__title[_ngcontent-ng-c1910434900] {
    font-size: var(--stb-main-banner-title-font-size);
    font-weight: 700;
    line-height: 1.4;
    color: var(--stb-text-contrast-primary)
}

@media screen and (min-width: 768px) {
    .description__title[_ngcontent-ng-c1910434900] {
        margin-bottom: 8px
    }
}

.description__detail[_ngcontent-ng-c1910434900] {
    display: inline;
    /* font-family: var(--stb-font-helper); */
    font-size: var(--stb-main-banner-detail-font-size);
    font-weight: 400;
    text-transform: uppercase;
    line-height: var(--stb-main-banner-detail-line-height);
    background-image: var(--stb-text-accent);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent
}

.description__caption[_ngcontent-ng-c1910434900] {
    font-size: var(--stb-main-banner-caption-font-size);
    line-height: var(--stb-main-banner-caption-line-height);
    color: var(--stb-text-contrast-primary)
}

@media screen and (min-width: 768px) {
    .description__caption[_ngcontent-ng-c1910434900] {
        margin-top: 4px
    }
}

@media screen and (min-width: 768px) {
    .description[_ngcontent-ng-c1910434900] {
        --stb-main-banner-title-font-size: 16px;
        --stb-main-banner-detail-font-size: 20px;
        --stb-main-banner-detail-line-height: 1.3
    }
}

@media screen and (min-width: 1280px) {
    .description[_ngcontent-ng-c1910434900] {
        --stb-main-banner-title-font-size: 20px;
        --stb-main-banner-detail-font-size: 28px;
        --stb-main-banner-detail-line-height: 1.4;
        --stb-main-banner-caption-font-size: 16px;
        --stb-main-banner-caption-line-height: 1.2
    }
}

@media screen and (min-width: 1536px) {
    .description[_ngcontent-ng-c1910434900] {
        --stb-main-banner-title-font-size: 24px;
        --stb-main-banner-detail-font-size: 36px
    }
}

@media screen and (min-width: 1920px) {
    .description[_ngcontent-ng-c1910434900] {
        --stb-main-banner-detail-font-size: 48px;
        --stb-main-banner-detail-line-height: 1.2
    }
}

.main-action-wrap[_ngcontent-ng-c1910434900] {
    position: relative
}

.main-action-pulse[_ngcontent-ng-c1910434900] {
    --stb-size: 124px;
    position: absolute;
    inset: 0 5px;
    opacity: 0;
    border-radius: 100%;
    box-shadow: 0 0 24px #31df77, 0 4px 20px #2dd570;
    -webkit-user-select: none;
    user-select: none
}

.main-action-pulse--animate[_ngcontent-ng-c1910434900] {
    animation: pulse-animation 5s ease-out infinite 1.6s
}

@media screen and (min-width: 768px) {
    .main-action-pulse[_ngcontent-ng-c1910434900] {
        box-shadow: 0 0 24px #31df77, 0 4px 100px #2dd570
    }
}

.main-action-hieroglyphs[_ngcontent-ng-c1910434900] {
    --stb-size: 124px;
    position: absolute;
    inset: var(--stb-decor-inset-value);
    z-index: -1;
    border-radius: inherit;
    -webkit-mask-image: radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, .6) 0%, rgba(255, 255, 255, .5) 25%, rgba(255, 255, 255, .25) 55%, rgba(255, 255, 255, .07) 86%, rgba(255, 255, 255, 0) 100%);
    mask-image: radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, .6) 0%, rgba(255, 255, 255, .5) 25%, rgba(255, 255, 255, .25) 55%, rgba(255, 255, 255, .07) 86%, rgba(255, 255, 255, 0) 100%);
    -webkit-mask-size: var(--stb-size) 176px;
    mask-size: var(--stb-size) 176px;
    -webkit-mask-position: calc(var(--stb-size) * -1);
    mask-position: calc(var(--stb-size) * -1);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-size: 196px;
    background-image: url(../images/hieroglyphs@2x.webp);
    background-image: -webkit-image-set(url(../images/hieroglyphs@2x.webp) 1x, url(../images/hieroglyphs@2x.webp) 2x);
    background-image: image-set(url(../images/hieroglyphs@2x.webp) 1x, url(../images/hieroglyphs@2x.webp) 2x);
    background-image: -webkit-image-set(url(../images/hieroglyphs@2x.webp) type("image/webp") 1x, url(../images/hieroglyphs@2x.webp) type("image/webp") 2x, url(../images/hieroglyphs@2x.webp) type("image/webp") 1x, url(../images/hieroglyphs@2x.webp) type("image/webp") 2x);
    background-image: image-set(url(../images/hieroglyphs@2x.webp) type("image/webp") 1x, url(../images/hieroglyphs@2x.webp) type("image/webp") 2x, url(../images/hieroglyphs@2x.webp) type("image/webp") 1x, url(../images/hieroglyphs@2x.webp) type("image/webp") 2x)
}

.main-action-hieroglyphs--animate[_ngcontent-ng-c1910434900] {
    animation: mask 5s cubic-bezier(.42, 0, .58, 1) infinite 1.6s
}

.main-action[_ngcontent-ng-c1910434900] {
    z-index: 3;
    min-width: 187px
}

@media screen and (min-width: 1536px) {
    .main-action[_ngcontent-ng-c1910434900] {
        min-width: 260px
    }
}
.main-banner-container[_ngcontent-ng-c23268459] {
    display: block;
    max-width: 1920px;
    width: 100%;
    margin: 0 auto
}

@media screen and (min-width: 1536px) {
    .main-banner-container[_ngcontent-ng-c23268459] {
        padding-inline-start: var(--stb-container-padding);
        padding-inline-end: var(--stb-container-padding)
    }
}

.main-banner[_ngcontent-ng-c23268459] {
    --stb-main-banner-content-width: initial;
    --stb-main-banner-min-height: 390px;
    --stb-image-size: 170px;
    --stb-animation-width: 135%;
    --stb-animation-height: calc(var(--stb-image-size) + 166px);
    --stb-animation-transform-value: translate(calc(-50% - 4px));
    position: relative;
    z-index: 1;
    display: grid;
    align-items: start;
    min-height: var(--stb-main-banner-min-height);
    overflow: hidden
}

html[dir=rtl][_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459],
html[dir=rtl] [_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459] {
    --stb-animation-transform-value: translate(calc(50% + 4px))
}

@media screen and (min-width: 412px) {
    .main-banner[_ngcontent-ng-c23268459] {
        --stb-image-size: 230px;
        --stb-main-banner-min-height: 407px;
        --stb-animation-height: calc(var(--stb-image-size) + 170px)
    }
}

@media screen and (min-width: 768px) {
    .main-banner[_ngcontent-ng-c23268459] {
        --stb-main-banner-content-width: 352px;
        --stb-main-banner-min-height: 220px;
        --stb-animation-width: 85%;
        --stb-animation-height: 156%;
        --stb-animation-top-value: 0;
        --stb-animation-transform-value: translate(calc(-50% + 79px))
    }

    html[dir=rtl][_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459],
    html[dir=rtl] [_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459] {
        --stb-animation-transform-value: translate(calc(50% - 79px))
    }
}

@media screen and (min-width: 1280px) {
    .main-banner[_ngcontent-ng-c23268459] {
        --stb-main-banner-content-width: 468px;
        --stb-main-banner-min-height: 275px;
        --stb-animation-height: 157%;
        --stb-animation-transform-value: translate(calc(-50% + 95px));
        overflow: initial
    }

    html[dir=rtl][_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459],
    html[dir=rtl] [_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459] {
        --stb-animation-transform-value: translate(calc(50% - 95px))
    }
}

@media screen and (min-width: 1536px) {
    .main-banner[_ngcontent-ng-c23268459] {
        --stb-main-banner-content-width: 540px;
        --stb-main-banner-min-height: 336px;
        --stb-animation-transform-value: translate(calc(-50% + 116px))
    }

    html[dir=rtl][_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459],
    html[dir=rtl] [_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459] {
        --stb-animation-transform-value: translate(calc(50% - 116px))
    }
}

@media screen and (min-width: 1920px) {
    .main-banner[_ngcontent-ng-c23268459] {
        --stb-main-banner-content-width: 768px;
        --stb-main-banner-min-height: 443px;
        --stb-animation-height: 155%;
        --stb-animation-transform-value: translate(calc(-50% + 152px))
    }

    html[dir=rtl][_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459],
    html[dir=rtl] [_nghost-ng-c23268459] .main-banner[_ngcontent-ng-c23268459] {
        --stb-animation-transform-value: translate(calc(50% - 152px))
    }
}

.main-banner__image[_ngcontent-ng-c23268459] {
    position: absolute;
    top: -9px;
    inset-inline-start: 50%;
    transform: translate(-50%);
    max-width: initial;
    height: calc(var(--stb-image-size) + 130px);
    width: auto
}

@media screen and (min-width: 768px) {
    .main-banner__image[_ngcontent-ng-c23268459] {
        top: 0;
        height: 100%
    }
}

html[dir=rtl][_nghost-ng-c23268459] .main-banner__image[_ngcontent-ng-c23268459],
html[dir=rtl] [_nghost-ng-c23268459] .main-banner__image[_ngcontent-ng-c23268459] {
    scale: -1 1
}

.main-banner__animation[_ngcontent-ng-c23268459] {
    position: absolute;
    inset: 0;
    overflow: hidden
}

.main-banner__animation-player[_ngcontent-ng-c23268459] {
    position: absolute;
    top: 0;
    inset-inline-start: 50%;
    width: var(--stb-animation-width);
    height: var(--stb-animation-height);
    max-width: initial;
    transform: var(--stb-animation-transform-value)
}

html[dir=rtl][_nghost-ng-c23268459] .main-banner__animation-player[_ngcontent-ng-c23268459] .spine-player,
html[dir=rtl] [_nghost-ng-c23268459] .main-banner__animation-player[_ngcontent-ng-c23268459] .spine-player {
    scale: -1 1
}

.main-banner__body[_ngcontent-ng-c23268459] {
    --stb-main-banner-body-padding: var(--stb-image-size) 20px 0;
    --stb-main-banner-body-gap: 12px;
    --stb-main-banner-body-margin: 0 auto;
    display: grid;
    align-content: center;
    justify-items: center;
    padding: var(--stb-main-banner-body-padding);
    margin: var(--stb-main-banner-body-margin);
    grid-gap: var(--stb-main-banner-body-gap);
    max-width: var(--stb-main-banner-content-width);
    text-align: center
}

@media screen and (min-width: 412px) {
    .main-banner__body[_ngcontent-ng-c23268459] {
        --stb-main-banner-body-padding: var(--stb-image-size) 16px 0;
        --stb-main-banner-body-gap: 8px
    }
}

@media screen and (min-width: 768px) {
    .main-banner__body[_ngcontent-ng-c23268459] {
        --stb-main-banner-body-padding: 20px 40px;
        --stb-main-banner-body-margin: 0;
        --stb-main-banner-body-gap: 20px
    }
}

@media screen and (min-width: 1280px) {
    .main-banner__body[_ngcontent-ng-c23268459] {
        --stb-main-banner-body-padding: 30px 45px
    }
}

@media screen and (min-width: 1536px) {
    .main-banner__body[_ngcontent-ng-c23268459] {
        --stb-main-banner-body-padding: 30px
    }
}

@media screen and (min-width: 1920px) {
    .main-banner__body[_ngcontent-ng-c23268459] {
        --stb-main-banner-body-padding: 30px 60px
    }
}

.main-banner--loading[_ngcontent-ng-c23268459] {
    overflow: hidden
}

.actions[_ngcontent-ng-c23268459] {
    display: grid;
    grid-gap: 12px
}

.payments-list[_ngcontent-ng-c23268459] {
    z-index: 1;
    display: flex;
    justify-content: center;
    gap: 4px
}

.payments-list__item[_ngcontent-ng-c23268459] {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center
}
main {
    background-color: #1a0a03;
}
h1 {
    text-align: center;
    color: #fff;
    font-size: 30px;
}
.hero-container {
    background-color: #141b34;
 }

 .bonus {
     padding: 0px;
     border-radius: 1000px;

 }

 .compoff-footer__wrap {
     padding: 70px 0;
     margin: 0 auto;
     display: -ms-grid;
     -ms-grid-columns: 4.5fr 50px 7.5fr;
     grid-template-columns: 4.5fr 7.5fr;
     grid-gap: 0 150px;
     max-width: 1160px;
     -ms-grid-rows: auto 0 auto 0 auto;
     grid-template-areas: "menu paysys" "info paysys" "extra-info paysys"
 }

 .compoff-footer__wrap {
     display: flex;
     justify-content: space-between;
 }

 .compoff-footer__title {
     margin-bottom: 20px;
     text-transform: uppercase;
     line-height: 1.4;
     font-weight: 400;
     font-size: 14px;
     text-align: center;
     color: #fff
 }

 .compoff-footer__menu-nav {
     -ms-grid-row: 1;
     -ms-grid-column: 1;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     grid-area: menu;
     margin-bottom: 60px;
     text-transform: uppercase
 }

 .compoff-footer__menu-nav li {
     margin-bottom: 12px
 }

 .compoff-footer__menu-nav a {
     position: relative;
     line-height: 1;
     font-weight: 400;
     font-size: 14px;
     color: #999
 }

 .compoff-footer__menu-nav a:hover {
     text-decoration: none;
     color: #fff
 }

 .compoff-footer__menu-nav .menu-info {
     min-width: auto;
     margin-right: 65px
 }

 .compoff-footer__info-section {
     -ms-grid-row: 3;
     -ms-grid-column: 1;
     grid-area: info;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     margin-bottom: 60px
 }

 .compoff-footer__info-item {
     display: block;
     -ms-flex-preferred-size: auto;
     flex-basis: auto;
     width: 100%;
     max-width: none
 }

 .compoff-footer__info-item:not(:last-child) {
     margin: 0 30px 60px 0
 }

 .compoff-footer__info-link {
     text-decoration: underline;
     line-height: 1.4;
     font-weight: 400;
     font-size: 16px;
     color: #999
 }

 .compoff-footer__info-link:hover {
     color: #fff
 }

 .compoff-footer__info-link.gagarin span {
     text-transform: uppercase;
     font-weight: 700;
     color: #c500ec
 }

 .compoff-footer__pays-section {
     -ms-grid-row: 1;
     -ms-grid-row-span: 5;
     -ms-grid-column: 3;
     grid-area: paysys;
     display: block;
     margin-bottom: 60px
 }

 .compoff-footer__extra-section {
     -ms-grid-row: 5;
     -ms-grid-column: 1;
     grid-area: extra-info;
     padding: 0px 10px 30px 20px;
     max-width: 1160px;
     margin-left: auto;
     margin-right: auto;
 }

 .compoff-footer__pays-items {
     display: -webkit-box;
     display: -ms-flexbox;
     /* display: flex; */
     justify-content: center;
 }

 .compoff-footer__pays-item {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     width: 105px;
     height: 90px;
     margin: 0 1px 1px 0;
     padding: 10px;
     background-color: rgba(255, 255, 255, .05);
     border-radius: 8px;
 }

 .compoff-footer__pays-item:hover img {
     opacity: 1
 }

 .compoff-footer__pays-item img {
     width: auto;
     height: auto;
     opacity: .8;
     display: block;
     margin: 0 auto
 }

 .compoff-ul {
     display: flex;
     justify-content: space-between;
 }

 .compoff-ul ul {
     padding-left: 0px;
 }

 @media only screen and (max-width: 992px) {
     .compoff-footer__wrap {
         flex-direction: column;
         align-items: center;
     }
 }

 @media only screen and (max-width: 950px) {
     .compoff-footer__pays-items {
         width: 300px;
         flex-wrap: wrap;
     }

     .compoff-footer__pays-section {
         margin-top: 30px;
                display: flex;
                    flex-direction: column;
                    align-items: center;
     }

     .mobile-grid {
         flex-direction: column;
     }

     .footer__description {
         align-items: center;
     }

     .compoff-footer__pays-items {
         display: flex;
         flex-wrap: wrap;
         justify-content: center;
     }
 }

 .compoff-footer__title h3 {
     color: #fec393;
 }
 .top-games-section {
    padding: 56px 10px;
     margin-bottom: -26px
 }

 @media screen and (min-width: 1280px) {
     .top-games-section {
         padding: 45px 0 56px
     }
 }



 @media screen and (min-width: 1280px) {
     .top-games-section .swiper-container:before {
         width: 53px
     }
 }

 @media screen and (min-width: 1440px) {
     .top-games-section .swiper-container:before {
         width: 60px
     }
 }

 @media screen and (min-width: 2500px) {
     .top-games-section .swiper-container:before {
         width: 278px
     }
 }

 .top-games-section--slider {
     position: relative
 }

 .top-games-section--slider._mobile {
     overflow: hidden;
     /* width: calc(100% + 40px);
     transform: translate(-20px) */
 }

 .top-games-section--slider._mobile:lang(ar) {
     transform: translate(20px)
 }

 .top-games-section--scroll {
     display: grid;
     grid-template-columns: repeat(6, 171px) 16px;
     grid-column-gap: 16px;
     overflow-x: scroll;
     /* padding: 0 16px; */
     margin-top: 10px;
 }

 .top-games-section--scroll:after {
     content: ""
 }

 .top-games-section--arrow {
     position: absolute;
     top: calc(50% - 15px);
     z-index: 10;
     display: none
 }

 .top-games-section--arrow:lang(ar) {
     transform: scaleX(-1)
 }

 @media screen and (min-width: 1280px) {
     .top-games-section--arrow {
         display: block
     }
 }

 .top-games-section--arrow._left {
     left: -40px
 }

 .top-games-section--arrow._left:lang(ar) {
     left: unset;
     right: -40px
 }

 .top-games-section--arrow._right {
     right: -40px
 }

 .top-games-section--arrow._right:lang(ar) {
     right: unset;
     left: -40px
 }

 .top-games-section--title {
     margin: 0 0 12px;
     line-height: 100%
 }

 .top-games-section--elem {
     display: grid
 }

 /* [_nghost-jjy-c317] .top-games-section--slider {
     position: relative
 }

 [_nghost-jjy-c317] .top-games-section--slider .swiper-container {
     margin: 0 -20px;
     padding: 0 20px
 }

 @media screen and (min-width: 1280px) {
     [_nghost-jjy-c317] .top-games-section--slider .swiper-container {
         padding: 0;
         margin: 0 auto
     }
 }

 [_nghost-jjy-c317] .swiper-slide {
     height: auto
 }

 [_nghost-jjy-c317] .arrow-button.swiper-button-disabled {
     display: none
 }

 [_nghost-jjy-c317] .swiper-slide-next+.swiper-slide+.swiper-slide+.swiper-slide+.swiper-slide+.swiper-slide .top-games-section--elem:after {
     content: "";
     display: block;
     width: 100%;
     height: 100%;
     background: linear-gradient(270deg, #1e1e1e 0%, rgba(30, 30, 30, .85) 30.34%, rgba(30, 30, 30, .6) 128.14%, rgba(30, 30, 30, 0) 156.07%);
     position: absolute;
     top: 0;
     right: 0;
     z-index: 2
 }*/

 .game-title {
     font-weight: bold;
     text-align: center;
     text-transform: capitalize;
     font-size: 14px;
     margin-top: 10px;
     color: #fec393;
 }

 .title-text {
     color: #fec393;
     /* padding: 0 16px; */
     margin: 0 auto 15px;
     /* text-transform: uppercase; */
 }

 .grid-games--pic img {
     border-radius: 4px;
    
     border: 3px solid #362a03;
     
     box-shadow: 0 4px 8px #362a03;
   
     transition: transform 0.3s ease;
     
 }

 .grid-games--pic img:hover {
     transform: scale(1.05);
    
 }
 .top-games-section--slider._mobile {
     overflow: hidden;
     /* width: calc(100% + 40px);
     transform: translate(-20px); */
 }

 .mobile-grid {
     text-align: center;
  
     margin-top: 15px;
     margin-bottom: 45px;
 }

 .mob-link {
     display: inline-block;
     background-size: contain;
     height: 54px;
     color: transparent;
     border-radius: 8px;
     border: #d8c8bb solid 1px;
 }

 .android-app {
     background: url(../images/android.svg) center center no-repeat;
     width: 196px;
 }

 .appstore {
     background: url(../images/app-store.svg) center center no-repeat;
     width: 196px;
 }


 .nav-control {
     --stb-nav-control-size: 60px;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
     width: var(--stb-nav-control-size);
     height: var(--stb-nav-control-size);
     margin-inline-end: 8px;
     color: var(--stb-text-secondary);
     transition: color var(--stb-transition-time) ease
 }

 @media(hover: hover) and (pointer:fine) {
     .nav-control:hover {
         color: var(--stb-text-contrast-secondary)
     }
 }

 .nav-control:active {
     color: rgb(var(--stb-brand-500))
 }

 .animation-rotation {
     animation: animation-rotation var(--stb-animation-rotation-time) linear infinite
 }

 @keyframes animation-rotation {
     0% {
         transform: rotate(0)
     }

     to {
         transform: rotate(360deg)
     }
 }

 @keyframes pulse-animation {
     44% {
         opacity: 1
     }

     92%,
     to {
         opacity: 0
     }
 }

 @keyframes mask {
     0% {
         -webkit-mask-position: calc(var(--stb-size) * -1);
         mask-position: calc(var(--stb-size) * -1)
     }

     70%,
     to {
         -webkit-mask-position: calc(100% + var(--stb-size));
         mask-position: calc(100% + var(--stb-size))
     }
 }

 @keyframes toggle {
     0% {
         transform: translate(0)
     }

     to {
         transform: translate(3px)
     }
 }

/*11.11*/
.text-btn:not(:disabled) {
    cursor: pointer
}

@font-face {
    font-display: block;
    font-family: icomoon;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/icomoon.988b5b9b..eot);
    src: url(../fonts/icomoon.988b5b9b..eot#iefix) format("embedded-opentype"),url(../fonts/icomoon.8a4a299e..ttf) format("truetype"),url(../fonts/icomoon.263b8bcc..woff) format("woff"),url(../fonts/icomoon.082cbff6..svg#icomoon) format("svg")
}
.text-btn:not(:disabled) {
    cursor: pointer
}

@font-face {
    font-display: block;
    font-family: icomoon;
    font-style: normal;
    font-weight: 400;
    src: url(/fonts/icomoon.988b5b9b..eot);
    src: url(/fonts/icomoon.988b5b9b..eot#iefix) format("embedded-opentype"),url(/fonts/icomoon.8a4a299e..ttf) format("truetype"),url(/fonts/icomoon.263b8bcc..woff) format("woff"),url(/fonts/icomoon.082cbff6..svg#icomoon) format("svg")
}

.link-btn {
    text-decoration: none
}

.input--label .input__native:not(:-moz-placeholder-shown)+.input__label {
    transform: translateY(-12px)
}

@media(min-width: 768px) {
    .input--label .input__native:not(:-moz-placeholder-shown)+.input__label {
        transform:translateY(-20px)
    }
}

.input input:not(:-moz-placeholder-shown)+.input__label,.input textarea:not(:-moz-placeholder-shown)+.input__label {
    font-size: 12px;
    transform: translate3d(0,-8px,0)
}

.plain-btn:not(:disabled) {
    cursor: pointer
}

.game-currency-select-button__wrap:has(.game-currency-select-button--active) {
    background: #283151
}

.game-currency-select-button__wrap:has(.game-currency-select-button--disabled) {
    background: #222b49!important;
    color: hsla(0,0%,100%,.4)!important
}

html:fullscreen .game-controls .game-controls__button .font-icons--fullscreen {
    display: none
}

html:fullscreen .game-controls .game-controls__button .font-icons--fullscreen-close {
    display: block
}

.input-search__native:not(:-moz-placeholder-shown) {
    color: #fff;
    padding: 24px 0 8px
}

.input-search__native:-webkit-autofill:active:not(:hover) {
    -webkit-text-fill-color: #fff!important
}

.input-search__native:not(:-moz-placeholder-shown)+.input-search__label {
    font-size: 12px;
    line-height: 16px;
    top: 8px;
    transform: translate(0)
}

.btn {
    align-items: center;
    background-color: transparent;
    border-radius: 8px;
    color: #fff;
    display: inline-flex;
    flex-wrap: wrap;
    font-size: 16px;
    font-weight: 700;
    height: 40px;
    justify-content: center;
    line-height: 1.2;
    margin: 0;
    min-width: inherit;
    outline: none;
    padding: 12px 16px;
    position: relative;
    text-align: center;
    text-shadow: none;
    transition: background-color .3s ease,box-shadow .3s ease,border-color .3s ease;
    vertical-align: middle
}

.btn,.btn:not(:disabled) {
    cursor: pointer
}

.btn:disabled {
    cursor: not-allowed;
    opacity: .4
}

.btn:active,.btn:focus,.btn:hover {
    color: #fff;
    outline: none;
    text-decoration: none
}

.btn--medium {
    height: 40px;
    padding: 10px 16px
}

.btn--medium {
    font-size: 14px;
    font-weight: 700;
    line-height: 20px
}

.btn--outline {
    border: 1px solid hsla(0,0%,100%,.16)
}

.btn--outline:active,.btn--outline:focus,.btn--outline:hover {
    background: transparent!important;
    border: 1px solid hsla(0,0%,100%,.2)
}

.btn--primary {
    background: linear-gradient(180deg,#47db79,#138f53);
    border: none
}

.btn--primary:hover {
    background: linear-gradient(180deg,#67f597,#138f53);
    box-shadow: 0 12px 24px -8px rgba(53,255,132,.2)
}

.btn--primary:active,.btn--primary:focus {
    box-shadow: none
}

.header__right {
    align-items: center;
    display: flex;
    margin-left: auto
}

a {
    font-size: 14px;
    line-height: 20px;
    text-decoration: none
}

a,a:hover {
    color: #fff
}

@media(min-width: 768px) {
    a {
        font-size:16px;
        line-height: 24px
    }
}

.wheel-page .form__input:-webkit-autofill:active:not(:hover) {
    -webkit-text-fill-color: #fff!important
}

.promo-single-page-header__content:has(.promo-single-page-header__timer) {
    row-gap: 12px
}

@media(min-width: 768px) {

    .promo-single-page-header__content:has(.promo-single-page-header__timer) {
        row-gap: 20px
    }
}

.link-btn {
    text-decoration: none
}

.input--label .input__native:not(:-moz-placeholder-shown)+.input__label {
    transform: translateY(-12px)
}

@media(min-width: 768px) {
    .input--label .input__native:not(:-moz-placeholder-shown)+.input__label {
        transform:translateY(-20px)
    }
}

.input input:not(:-moz-placeholder-shown)+.input__label,.input textarea:not(:-moz-placeholder-shown)+.input__label {
    font-size: 12px;
    transform: translate3d(0,-8px,0)
}

.plain-btn:not(:disabled) {
    cursor: pointer
}

.game-currency-select-button__wrap:has(.game-currency-select-button--active) {
    background: #283151
}

.game-currency-select-button__wrap:has(.game-currency-select-button--disabled) {
    background: #222b49!important;
    color: hsla(0,0%,100%,.4)!important
}

html:fullscreen .game-controls .game-controls__button .font-icons--fullscreen {
    display: none
}

html:fullscreen .game-controls .game-controls__button .font-icons--fullscreen-close {
    display: block
}

.input-search__native:not(:-moz-placeholder-shown) {
    color: #fff;
    padding: 24px 0 8px
}

.input-search__native:-webkit-autofill:active:not(:hover) {
    -webkit-text-fill-color: #fff!important
}

.input-search__native:not(:-moz-placeholder-shown)+.input-search__label {
    font-size: 12px;
    line-height: 16px;
    top: 8px;
    transform: translate(0)
}

.home-bonuses {
    height: 100%;
    overflow: hidden;
    position: relative
}

@media(min-width: 768px) {
    .home-bonuses {
        width:100%
    }
}

.home-bonuses .slick-list,.home-bonuses .slick-slider {
    height: 100%
}

.home-bonuses__wrapper {
    background-color: #1b2341;
    height: 478px;
    margin-bottom: 24px
}

@media(min-width: 768px) {
    .home-bonuses__wrapper {
        min-height:458px;
        width: 100%
    }
}

@media(min-width: 960px) {
    .home-bonuses__wrapper {
        margin-bottom:32px
    }
}

@media(min-width: 1200px) {
    .home-bonuses__wrapper {
        height:524px
    }
}

@media(min-width: 1440px) {
    .home-bonuses__wrapper {
        height:548px
    }
}

@media(min-width: 1920px) {
    .home-bonuses__wrapper {
        margin:0 auto;
        max-width: 100%;
    }
}

.home-slider.slick-slider.home-slider--main {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    box-sizing: border-box;
    display: block;
    position: relative;
    touch-action: pan-y;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.home-slider.slick-slider.home-slider--main .slick-list {
    display: flex;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative
}

.home-slider.slick-slider.home-slider--main .slick-list:focus {
    outline: none
}

.home-slider.slick-slider.home-slider--main .slick-list,.home-slider.slick-slider.home-slider--main .slick-track {
    transform: translateZ(0)
}

.home-slider.slick-slider.home-slider--main .slick-track {
    display: flex;
    left: 0;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 0
}

.home-slider.slick-slider.home-slider--main .slick-track:after,.home-slider.slick-slider.home-slider--main .slick-track:before {
    content: "";
    display: table
}

.home-slider.slick-slider.home-slider--main .slick-track:after {
    clear: both
}

.home-slider.slick-slider.home-slider--main .slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px
}

.home-slider.slick-slider.home-slider--main .slick-slide div:not(.container) {
    width: 100%
}

.home-slider.slick-slider.home-slider--main .slick-slide img {
    display: block
}

.home-slider.slick-slider.home-slider--main.slick-initialized .slick-slide {
    display: flex
}

.home-bonuses-card {
    display: flex;
    height: 100%;
    position: relative;
    width: 100%;
    z-index: 0
}

@media(min-width: 1200px) {
    .home-bonuses-card {
        align-items:center
    }
}

.home-bonuses-card__background {
    height: 100%;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    z-index: -1;
    border-radius: 8px;
}

.home-bonuses-card__background--single .home-bonuses-card__background-image {
    animation: unset!important;
    width: 100%
}

.home-bonuses-card__background-image {
    height: 100%;
    left: 50%;
    -o-object-fit: cover;
    object-fit: cover;
    object-position: top;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 100%
}

.home-bonuses-card__content {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
    padding: 80px 16px 44px;
    position: relative;
    width: 100%;
    z-index: 3;
    margin-top: 120px;
}

@media(min-width: 768px) {
    .home-bonuses-card__content {
        padding:88px 24px 44px
    }
}

@media(min-width: 1200px) {
    .home-bonuses-card__content {
        padding:150px 32px 54px
    }
}

@media(min-width: 1440px) {
    .home-bonuses-card__content {
        padding: 140px 0 66px;
        max-width: 1184px;
        margin: 0 auto;
    }
    .home-bonuses-card__content {
        align-items: flex-start;
    }
}

.home-bonuses-card__content-top {
    align-items: center;
    display: flex;
    flex-direction: column;
    row-gap: 16px
}

@media(min-width: 768px) {
    .home-bonuses-card__content-top {
        align-items:center;
        max-width:650px;
    }
}

.home-bonuses-card__pretitle {
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    color: rgb(255 221 164);
    text-shadow: 0 3px 0 #69431d;
    font-size: 20px;
}

/* @media(min-width: 768px) {
    .home-bonuses-card__pretitle {
        font-size:40px;
        font-weight: 800;
        text-align: left
    }
} */

@media(min-width: 1440px) {
    .home-bonuses-card__pretitle {
        font-size:25px;
        font-weight: 900;
        line-height: 133.33%
    }
}

.home-bonuses-card__title {
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    color: rgb(255 221 164);
    text-shadow: 0 4px 0 #5e3c16;
    text-align: center;
    text-transform: uppercase;
}

@media(min-width: 768px) {
    .home-bonuses-card__title {
        font-size:32px;
    }
}

@media(min-width: 1200px) {
    .home-bonuses-card__title {
        font-size:48px;
        line-height: 116.67%
    }
}

@media(min-width: 1440px) {
    .home-bonuses-card__title {
        font-size:48px;
        line-height: 114.29%
    }
}

.home-bonuses-card .home-bonuses-card__button {
    margin-top: 8px
}

@media(min-width: 1200px) {
    .home-bonuses-card .home-bonuses-card__button {
        margin-top:16px
    }
}

.btn {
    align-items: center;
    background-color: transparent;
    border-radius: 8px;
    color: #fff;
    display: inline-flex;
    flex-wrap: wrap;
    font-size: 16px;
    font-weight: 700;
    height: 40px;
    justify-content: center;
    line-height: 1.2;
    margin: 0;
    min-width: inherit;
    outline: none;
    padding: 12px 16px;
    position: relative;
    text-align: center;
    text-shadow: none;
    transition: background-color .3s ease,box-shadow .3s ease,border-color .3s ease;
    vertical-align: middle
}

.btn,.btn:not(:disabled) {
    cursor: pointer
}

.btn:disabled {
    cursor: not-allowed;
    opacity: .4
}

.btn:active,.btn:focus,.btn:hover {
    color: #fff;
    outline: none;
    text-decoration: none
}

.btn--medium {
    height: 40px;
    padding: 10px 16px
}

.btn--medium {
    font-size: 14px;
    font-weight: 700;
    line-height: 20px
}

.btn--primary {
    background: linear-gradient(180deg,#47db79,#138f53);
    border: none
}

.btn--primary:hover {
    background: linear-gradient(180deg,#67f597,#138f53);
    box-shadow: 0 12px 24px -8px rgba(53,255,132,.2)
}

.btn--primary:active,.btn--primary:focus {
    box-shadow: none
}

.btn--danger {
    border: none
}

.btn--danger,.btn--danger:hover {
    background: linear-gradient(180deg,#ffdf6e,#ffa12b);
    color: #141b34
}

.btn--danger:hover {
    box-shadow: 0 12px 24px -8px rgba(255,161,43,.35)
}

.btn--danger:active,.btn--danger:focus {
    box-shadow: none;
    color: #141b34
}

.btn--pulse {
    animation: pulseBtn 1.5s infinite;
    font-size: 20px;
    font-weight: 700;
    height: 56px;
    line-height: 24px;
    min-width: 184px;
    padding: 12px 20px
}

@media(min-width: 1200px) {
    .btn--pulse {
        font-size:20px;
        font-weight: 800;
        height: 64px;
        line-height: 30px;
        padding: 13px 24px
    }
}

@keyframes pulseBtn {
    0%,to {
        transform: scale(.875)
    }

    50% {
        transform: scale(1)
    }
}

html {
    -webkit-text-size-adjust: 100%;
    line-height: 1.15
}

body {
    margin: 0
}

a {
    background-color: transparent
}

img {
    border-style: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

html {
    height: auto;
    min-height: 100%;
    width: 100%
}

body {
    -webkit-font-smoothing: antialiased;
    background-color: #1a0a03;
    color: #fff;
    font-family:  "Fira Sans",sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 1.2;
    margin: 0;
    max-width: 100%;
    min-height: 100%;
    overflow: auto;
    overflow-x: hidden;
    padding: 0;
    text-align: left;
    width: 100vw
}

* {
    box-sizing: border-box
}

img {
    border: none
}

h3 {
    margin: 0
}

h3 {
    font-size: 25px;
    line-height: 24px
}

h3 {
    font-weight: 700
}

a {
    font-size: 14px;
    line-height: 20px;
    text-decoration: none
}

/* a,a:hover {
    color: #ffd653
} */

@media(min-width: 768px) {
    a {
        font-size:16px;
        line-height: 24px
    }
}

.wheel-page .form__input:-webkit-autofill:active:not(:hover) {
    -webkit-text-fill-color: #fff!important
}

.promo-single-page-header__content:has(.promo-single-page-header__timer) {
    row-gap: 12px
}

@media(min-width: 768px) {

    .promo-single-page-header__content:has(.promo-single-page-header__timer) {
        row-gap: 20px
    }
}
/* 
@font-face {
    font-family: Hero;
    font-style: normal;
    font-weight: 300;
    src: url(../fonts/HeroNew-Light.c5e6cf42..ttf) format("truetype")
}

@font-face {
    font-family: Hero;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/HeroNew-Regular.c5a6469f..ttf) format("truetype")
}

@font-face {
    font-family: Hero;
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/HeroNew-Medium.8e66f7e5..ttf) format("truetype")
}

@font-face {
    font-family: Hero;
    font-style: normal;
    font-weight: 600;
    src: url(../fonts/HeroNew-SemiBold.d88fec32..ttf) format("truetype")
}

@font-face {
    font-family: Hero;
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/HeroNew-Bold.9881358e..ttf) format("truetype")
} */

body::-webkit-scrollbar {
    height: 4px;
    width: 4px
}

body::-webkit-scrollbar-thumb {
    background: #303a5a;
    border-radius: 10px
}
.header__button {
    /* display: inline-block; */
    font-size: 14px;
    margin: 0 0 0 12px;
    max-width: 200px;
    overflow: hidden;
    /* text-overflow: ellipsis; */
    white-space: nowrap;
    text-align: center;
}

.module.content-module .author {
    flex-direction: row;
    display: flex;
    justify-content: center;
    gap: 10px;
    align-items: center;
}


.socials-wrapper{
    max-width: 50px;
    width: 100%;
    margin-top: 0;
    display: flex;
    flex-wrap: wrap;justify-content: center;
}
.socials-wrapper a{margin: auto 0;}
@media only screen and (max-width: 768px) {
.module.content-module .author {
        flex-direction: column;
    }
    .socials-wrapper{    flex-wrap: nowrap;max-width: 200px;}
}

.compoff-footer__menu-nav {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center;
    grid-area: menu;
    margin-top: 30px;
  }
  
  .compoff-footer__menu-nav li {
    margin-bottom: 12px
  }
  
  .compoff-footer__menu-nav a {
    position: relative;
    line-height: 1;
    font-weight: 400;
    font-size: 14px;
    color: #d3bb8b;
    text-decoration: none;
  }
  
  .compoff-footer__menu-nav a:hover {
    text-decoration: none;
    color: #fff
  }
  
  .compoff-footer__menu-nav .menu-info {
    min-width: auto;
    margin-right: 65px
  }
  
  .compoff-footer__title {
    margin-bottom: 20px;
    line-height: 1.4;
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    color: #fff
  }
  
  .compoff-ul {
    display: flex;
    justify-content: space-between;
  }
  
  .compoff-ul ul {
    padding-left: 0px;
    list-style: none
  }
  .hide {
      position: absolute;
      left: -9999px;
      top: -9999px;
      width: 1px;
      height: 1px;
      overflow: hidden;
  }