/*! tailwindcss v3.3.2 | MIT License | https://tailwindcss.com*/

*,
:after,
:before {
    border: 0 solid #e5e7eb;
    box-sizing: border-box
}

:after,
:before {
    --tw-content: ""
}

html {
    -webkit-text-size-adjust: 100%;
    font-feature-settings: normal;
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    font-variation-settings: normal;
    line-height: 1.5;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4
}

body {
    line-height: inherit;
    margin: 0
}

hr {
    border-top-width: 1px;
    color: inherit;
    height: 0
}

abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: inherit
}

a {
    color: inherit;
    text-decoration: inherit
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
pre,
samp {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

table {
    border-collapse: collapse;
    border-color: inherit;
    text-indent: 0
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font-family: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0
}

button,
select {
    text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button;
    background-color: transparent;
    background-image: none
}

:-moz-focusring {
    outline: auto
}

:-moz-ui-invalid {
    box-shadow: none
}

progress {
    vertical-align: baseline
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    display: list-item
}

blockquote,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
pre {
    margin: 0
}

fieldset {
    margin: 0
}

fieldset,
legend {
    padding: 0
}

menu,
ol,
ul {
    list-style: none;
    margin: 0;
    padding: 0
}

textarea {
    resize: vertical
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #9ca3af;
    opacity: 1
}

input::placeholder,
textarea::placeholder {
    color: #9ca3af;
    opacity: 1
}

[role=button],
button {
    cursor: pointer
}

:disabled {
    cursor: default
}

audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
    display: block;
    vertical-align: middle
}

img,
video {
    height: auto;
    max-width: 100%
}

[hidden] {
    display: none
}

:root {
    --body: #0a0a0a;
    --content: #0a0a0a;
    --content-light: #121212;
    --content-light-2: hsla(0, 0%, 84%, .3);
    --primary: #0f48e6;
    --secondary: #f7a41b;
    --primary-outline: #fb5e16;
    --primary-light: #f3f5fa;
    --text-base: #f4f4f5;
    --text-light: #c0c6d9;
    --line: #303030;
    --danger: red
}

*,
:after,
:before {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59, 130, 246, .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia:
}

::backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59, 130, 246, .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia:
}

:root {
    --bg-main: #000000;
    --bg-main-2: #000000;
    --bg-main-top: #000000;
    --bg-main-right: #000000;
    --shadow-main: 0px 0px 10px 3px var(--primary);
    --shadow-main-hover: 0px 12px 10px -6px rgba(251, 94, 22, .53);
    --filter-black: invert(0%) sepia(0%) saturate(7470%) hue-rotate(272deg) brightness(108%) contrast(108%);
    --filter-primary: invert(50%) sepia(50%) saturate(10000%) hue-rotate(360deg) brightness(100%) contrast(100%);
    --color-stop-1: #69a3fa;
    --color-stop-2: #69a3fa;
    --progress-stroke-style: #3c4363;
    --progress-fill-style: var(--body);
    --progress-text-color: var(--text-base);
    --status-red: #e94951;
    --status-green: #6cb943;
    --status-grey: #939698;
    --status-yellow: #ffc84d;
    --status-blue: #0093ff;
    --status-red-bg: #fff;
    --status-yellow-bg: rgba(199, 150, 87, .3);
    --status-green-bg: rgba(87, 149, 65, .3);
    --status-blue-bg: rgba(62, 118, 247, .3);
    --header-text-color: #fff;
    --topbar-menu-bg: var(--secondary);
    --topbar-menu-item-hover: var(--primary);
    --topbar-text-color: #000;
    --topbar-text-color-active: #fff;
    --topbar-img-filter: unset;
    --topbar-img-filter-active: brightness(0) invert(1);
    --footer-top-color: #0a0a0a;
    --footer-bottom-color: #0a0a0a;
    --gamepage-bg: #fff;
    --mobile-menu-icon-filter: unset;
    --mobile-menu-icon-filter-active: brightness(0) invert(1);
    --header-bg: var(--bg-main);
    --marquee-bg: linear-gradient(180deg, #4e5478, #353b55);
    --content-bg: #0b0b0b;
    --content-text: #cea895;
    --sidepanel-header-bg: var(--bg-main);
    --sidepanel-bg: var(--content);
    --sidepanel-btn-bg: var(--content-light);
    --sidebar-btn-bg: #ebebeb;
    --sidebar-btn2-bg: #ebebeb;
    --sidebar-btn-bg-active: var(--bg-main);
    --tab-game-bg: var(--content-light);
    --tab-game-bg-triangle: linear-gradient(to top, #eace5c, var(--content-light));
    --menu-nav-bg: var(--bg-main);
    --game-menu-bg: var(--content);
    --game-search-bg: #18181b;
    --game-search-icon-color: #52525b;
    --game-search-input-color: #27272a;
    --game-tab-menu-bg: var(--content);
    --game-tab-btn-border: var(--line);
    --game-tab-btn-bg-active: var(--secondary);
    --sidebar-btn-arrow-bg: var(--secondary);
    --sidebar-btn-arrow-color: var(--line);
    --game-container-bg: var(--content);
    --auth-modal-bg: #fff;
    --auth-modal-header-bg: var(--auth-modal-bg);
    --auth-input-wrapper-bg: var(--content);
    --auth-input-wrapper-border-color: #d6d6d6;
    --ms-diary-bg: #0e0e11;
    --ms-diary-border-color: #27272a;
    --ms-diary-text-head-color: #0a0a0a;
    --ms-diary-text-color: #f4f4f5;
    --ms-diary-box-bg: #18181b;
    --ms-diary-box-border-color: #52525b;
    --ms-diary-box-green-bg: rgba(59, 181, 74, .1);
    --ms-diary-box-green-border-color: #3bb54a;
    --ms-diary-box-gold-bg: rgba(23, 57, 152, .1);
    --ms-diary-box-gold-border-color: var(--primary);
    --table-odd-bg: #242a42;
    --table-even-bg: #242a42;
    --announcement-active: var(--bg-main);
    --announcement-border: #d6d6d6;
    --announcement-active-text: #fff;
    --announcement-text: #fff;
    --announcement-close-modal: #fff;
    --vip-reward-card: #ededed;
    --vip-reward-title: var(--text-base);
    --vip-reward-desc: #8200fe;
    --mission-progress: #3ab54b;
    --mission-progress-border: transparent;
    --mission-progress-bg: #3c4363;
    --mission-calendar-header: var(--secondary);
    --bg-save-icon-fill: var(--primary);
    --bg-exit-icon-fill: none;
    --bg-edit-icon-fill: var(--secondary);
    --reg-step-text-color: #757575;
    --reg-step-active-text-color: #fff;
    --reg-step-bg-color: #d6d6d6;
    --reg-step-active-bg-color: var(--bg-main);
    --reg-success-box-bg: #ffefe6;
    --reg-success-box-text: #000;
    --game-provider-btn: #1d1d1d;
    --game-provider-btn-active: #fb5e16;
    --category-btn: #757575;
    --category-btn-active: var(--text-base);
    --category-svg-active: var(--text-base);
    --category_tab_game-bg: #1145dd;
    --invite-friends-total-income-bg: linear-gradient(180deg, #222121, #313030);
    --invite-friends-income-amounts-bg: linear-gradient(180deg, #313030, #222121)
}

@media (max-width:767px) {
    :root {
        --header-bg: var(--bg-main)
    }
}

:root {
    --o-primary: var(--text-light);
    --o-primary-light: #fcdecf;
    --o-padding: .5em .875em;
    --o-border-radius: 5px;
    --o-border-width: 1px;
    --o-border-color: #3c4363;
    --o-bg: #2e344f;
    --o-text: #a1a1a9;
    --o-shadow: none;
    --o-shadow-focus: none;
    --o-select-arrow: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23444' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E");
    --o-disabled: #3c3c3c;
    --o-disabled2: #3c3c3c;
    --checbox-bg: #fff;
    --checkbox-border-radius: 2px;
    --checkbox-border-color: #000;
    --checkbox-label-color: #fff;
    --tick-color: #fff;
    --switch-thumb: #94a3b8;
    --switch-thumb-checked: #fff;
    --o-dropdown-bg: var(--content-light);
    --o-dropdown-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
    --o-option-input-bg: #fff;
    --o-option-selected-bg: var(--secondary);
    --o-option-hover-bg: #f7a41b;
    --o-option-selected-text: #0a0a0a;
    --o-text-light: #888;
    --o-date-selected-text: #fff;
    --o-date-selected-bg: var(--bg-main);
    --o-phone-bg: transparent
}

.pointer-events-none {
    pointer-events: none
}

.visible {
    visibility: visible
}

.invisible {
    visibility: hidden
}

.collapse {
    visibility: collapse
}

.static {
    position: static
}

.fixed {
    position: fixed
}

.\  !absolute {
    position: absolute !important
}

.absolute {
    position: absolute
}

.relative {
    position: relative
}

.sticky {
    position: sticky
}

.inset-0 {
    inset: 0
}

.inset-x-0 {
    left: 0;
    right: 0
}

.inset-y-0 {
    bottom: 0;
    top: 0
}

.\  !bottom-\[100px\] {
    bottom: 100px !important
}

.\  !bottom-\[135px\] {
    bottom: 135px !important
}

.\  !bottom-\[unset\] {
    bottom: unset !important
}

.\  !left-7 {
    left: 1.75rem !important
}

.\  !right-6 {
    right: 1.5rem !important
}

.-bottom-3 {
    bottom: -.75rem
}

.-bottom-9 {
    bottom: -2.25rem
}

.-bottom-\[13\.75vw\] {
    bottom: -13.75vw
}

.-bottom-\[14\.5vw\] {
    bottom: -14.5vw
}

.-bottom-\[20px\] {
    bottom: -20px
}

.-left-1 {
    left: -.25rem
}

.-right-0 {
    right: 0
}

.-right-0\.5 {
    right: -.125rem
}

.-right-1 {
    right: -.25rem
}

.-right-2 {
    right: -.5rem
}

.-right-3 {
    right: -.75rem
}

.-right-4 {
    right: -1rem
}

.-right-5 {
    right: -1.25rem
}

.-right-\[1\.1rem\] {
    right: -1.1rem
}

.-right-\[1px\] {
    right: -1px
}

.-right-\[20px\] {
    right: -20px
}

.-top-1 {
    top: -.25rem
}

.-top-1\.5 {
    top: -.375rem
}

.-top-10 {
    top: -2.5rem
}

.-top-2 {
    top: -.5rem
}

.-top-4 {
    top: -1rem
}

.-top-5 {
    top: -1.25rem
}

.-top-6 {
    top: -1.5rem
}

.-top-\[1\.6rem\] {
    top: -1.6rem
}

.-top-\[1px\] {
    top: -1px
}

.-top-\[55px\] {
    top: -55px
}

.-top-\[66px\] {
    top: -66px
}

.-top-\[6vw\] {
    top: -6vw
}

.bottom-0 {
    bottom: 0
}

.bottom-1 {
    bottom: .25rem
}

.bottom-10 {
    bottom: 2.5rem
}

.bottom-14 {
    bottom: 3.5rem
}

.bottom-2 {
    bottom: .5rem
}

.bottom-3 {
    bottom: .75rem
}

.bottom-4 {
    bottom: 1rem
}

.bottom-5 {
    bottom: 1.25rem
}

.bottom-8 {
    bottom: 2rem
}

.bottom-\[-15px\] {
    bottom: -15px
}

.bottom-\[10px\] {
    bottom: 10px
}

.bottom-\[120px\] {
    bottom: 120px
}

.bottom-\[18px\] {
    bottom: 18px
}

.bottom-\[8\%\] {
    bottom: 8%
}

.bottom-\[8rem\] {
    bottom: 8rem
}

.left-0 {
    left: 0
}

.left-1 {
    left: .25rem
}

.left-1\/2 {
    left: 50%
}

.left-10 {
    left: 2.5rem
}

.left-20 {
    left: 5rem
}

.left-3 {
    left: .75rem
}

.left-4 {
    left: 1rem
}

.left-5 {
    left: 1.25rem
}

.left-6 {
    left: 1.5rem
}

.left-8 {
    left: 2rem
}

.left-\[10px\] {
    left: 10px
}

.left-\[15px\] {
    left: 15px
}

.left-\[50\%\] {
    left: 50%
}

.right-0 {
    right: 0
}

.right-1 {
    right: .25rem
}

.right-12 {
    right: 3rem
}

.right-2 {
    right: .5rem
}

.right-2\.5 {
    right: .625rem
}

.right-3 {
    right: .75rem
}

.right-4 {
    right: 1rem
}

.right-5 {
    right: 1.25rem
}

.right-6 {
    right: 1.5rem
}

.right-\[-10px\] {
    right: -10px
}

.right-\[-15px\] {
    right: -15px
}

.right-\[-38px\] {
    right: -38px
}

.right-\[10px\] {
    right: 10px
}

.right-\[18px\] {
    right: 18px
}

.right-\[20px\] {
    right: 20px
}

.right-\[25px\] {
    right: 25px
}

.right-\[4px\] {
    right: 4px
}

.right-\[60px\] {
    right: 60px
}

.top-0 {
    top: 0
}

.top-1 {
    top: .25rem
}

.top-1\/2 {
    top: 50%
}

.top-14 {
    top: 3.5rem
}

.top-2 {
    top: .5rem
}

.top-2\.5 {
    top: .625rem
}

.top-3 {
    top: .75rem
}

.top-3\.5 {
    top: .875rem
}

.top-4 {
    top: 1rem
}

.top-5 {
    top: 1.25rem
}

.top-6 {
    top: 1.5rem
}

.top-7 {
    top: 1.75rem
}

.top-8 {
    top: 2rem
}

.top-\[-10px\] {
    top: -10px
}

.top-\[-15px\] {
    top: -15px
}

.top-\[-25px\] {
    top: -25px
}

.top-\[-5px\] {
    top: -5px
}

.top-\[15px\] {
    top: 15px
}

.top-\[16px\] {
    top: 16px
}

.top-\[22\.5\%\] {
    top: 22.5%
}

.top-\[22px\] {
    top: 22px
}

.top-\[25\%\] {
    top: 25%
}

.top-\[25\.5\%\] {
    top: 25.5%
}

.top-\[36\%\] {
    top: 36%
}

.top-\[4\%\] {
    top: 4%
}

.top-\[45\%\] {
    top: 45%
}

.top-\[48\%\] {
    top: 48%
}

.top-\[48px\] {
    top: 48px
}

.top-\[4px\] {
    top: 4px
}

.top-\[50\%\] {
    top: 50%
}

.top-\[50px\] {
    top: 50px
}

.top-\[55\%\] {
    top: 55%
}

.top-\[57\%\] {
    top: 57%
}

.top-\[63\.5\%\] {
    top: 63.5%
}

.top-\[66\%\] {
    top: 66%
}

.top-\[6px\] {
    top: 6px
}

.top-\[7\%\] {
    top: 7%
}

.top-\[70px\] {
    top: 70px
}

.top-\[77\%\] {
    top: 77%
}

.top-\[7px\] {
    top: 7px
}

.top-\[8px\] {
    top: 8px
}

.top-\[9px\] {
    top: 9px
}

.top-px {
    top: 1px
}

.\  !z-20 {
    z-index: 20 !important
}

.z-10 {
    z-index: 10
}

.z-20 {
    z-index: 20
}

.z-30 {
    z-index: 30
}

.z-50 {
    z-index: 50
}

.z-\[100\] {
    z-index: 100
}

.z-\[10\] {
    z-index: 10
}

.z-\[1\] {
    z-index: 1
}

.z-\[2\] {
    z-index: 2
}

.z-\[51\] {
    z-index: 51
}

.z-\[99\] {
    z-index: 99
}

.order-1 {
    order: 1
}

.order-2 {
    order: 2
}

.order-3 {
    order: 3
}

.order-4 {
    order: 4
}

.order-5 {
    order: 5
}

.col-span-1 {
    grid-column: span 1/span 1
}

.col-span-10 {
    grid-column: span 10/span 10
}

.col-span-11 {
    grid-column: span 11/span 11
}

.col-span-12 {
    grid-column: span 12/span 12
}

.col-span-2 {
    grid-column: span 2/span 2
}

.col-span-3 {
    grid-column: span 3/span 3
}

.col-span-5 {
    grid-column: span 5/span 5
}

.col-span-7 {
    grid-column: span 7/span 7
}

.col-span-8 {
    grid-column: span 8/span 8
}

.float-right {
    float: right
}

.\  !m-0 {
    margin: 0 !important
}

.-m-2 {
    margin: -.5rem
}

.m-2 {
    margin: .5rem
}

.m-3 {
    margin: .75rem
}

.m-4 {
    margin: 1rem
}

.m-\[10px\] {
    margin: 10px
}

.m-auto {
    margin: auto
}

.-mx-4 {
    margin-left: -1rem;
    margin-right: -1rem
}

.-mx-\[10px\] {
    margin-left: -10px;
    margin-right: -10px
}

.mx-1 {
    margin-left: .25rem;
    margin-right: .25rem
}

.mx-2 {
    margin-left: .5rem;
    margin-right: .5rem
}

.mx-3 {
    margin-left: .75rem;
    margin-right: .75rem
}

.mx-4 {
    margin-left: 1rem;
    margin-right: 1rem
}

.mx-5 {
    margin-left: 1.25rem;
    margin-right: 1.25rem
}

.mx-\[10px\] {
    margin-left: 10px;
    margin-right: 10px
}

.mx-\[15px\] {
    margin-left: 15px;
    margin-right: 15px
}

.mx-\[2px\] {
    margin-left: 2px;
    margin-right: 2px
}

.mx-\[5px\] {
    margin-left: 5px;
    margin-right: 5px
}

.mx-auto {
    margin-left: auto;
    margin-right: auto
}

.my-0 {
    margin-bottom: 0;
    margin-top: 0
}

.my-1 {
    margin-bottom: .25rem;
    margin-top: .25rem
}

.my-10 {
    margin-bottom: 2.5rem;
    margin-top: 2.5rem
}

.my-12 {
    margin-bottom: 3rem;
    margin-top: 3rem
}

.my-2 {
    margin-bottom: .5rem;
    margin-top: .5rem
}

.my-2\.5 {
    margin-bottom: .625rem;
    margin-top: .625rem
}

.my-3 {
    margin-bottom: .75rem;
    margin-top: .75rem
}

.my-4 {
    margin-bottom: 1rem;
    margin-top: 1rem
}

.my-5 {
    margin-bottom: 1.25rem;
    margin-top: 1.25rem
}

.my-6 {
    margin-bottom: 1.5rem;
    margin-top: 1.5rem
}

.my-8 {
    margin-bottom: 2rem;
    margin-top: 2rem
}

.my-\[10px\] {
    margin-bottom: 10px;
    margin-top: 10px
}

.my-\[1px\] {
    margin-bottom: 1px;
    margin-top: 1px
}

.my-\[1rem\] {
    margin-bottom: 1rem;
    margin-top: 1rem
}

.my-\[20px\] {
    margin-bottom: 20px;
    margin-top: 20px
}

.\  !mb-5 {
    margin-bottom: 1.25rem !important
}

.\  !mt-0 {
    margin-top: 0 !important
}

.\  !mt-4 {
    margin-top: 1rem !important
}

.\  !mt-6 {
    margin-top: 1.5rem !important
}

.\  !mt-8 {
    margin-top: 2rem !important
}

.-mb-2 {
    margin-bottom: -.5rem
}

.-mb-\[20px\] {
    margin-bottom: -20px
}

.-mb-\[55px\] {
    margin-bottom: -55px
}

.-mb-\[7px\] {
    margin-bottom: -7px
}

.-ml-2 {
    margin-left: -.5rem
}

.-ml-\[2px\] {
    margin-left: -2px
}

.-ms-7 {
    margin-inline-start: -1.75rem
}

.-mt-1 {
    margin-top: -.25rem
}

.-mt-2 {
    margin-top: -.5rem
}

.-mt-4 {
    margin-top: -1rem
}

.-mt-5 {
    margin-top: -1.25rem
}

.-mt-6 {
    margin-top: -1.5rem
}

.-mt-7 {
    margin-top: -1.75rem
}

.-mt-\[100px\] {
    margin-top: -100px
}

.-mt-\[2px\] {
    margin-top: -2px
}

.mb-0 {
    margin-bottom: 0
}

.mb-1 {
    margin-bottom: .25rem
}

.mb-10 {
    margin-bottom: 2.5rem
}

.mb-11 {
    margin-bottom: 2.75rem
}

.mb-12 {
    margin-bottom: 3rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-2\.5 {
    margin-bottom: .625rem
}

.mb-20 {
    margin-bottom: 5rem
}

.mb-24 {
    margin-bottom: 6rem
}

.mb-3 {
    margin-bottom: .75rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mb-5 {
    margin-bottom: 1.25rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.mb-7 {
    margin-bottom: 1.75rem
}

.mb-8 {
    margin-bottom: 2rem
}

.mb-9 {
    margin-bottom: 2.25rem
}

.mb-\[-20px\] {
    margin-bottom: -20px
}

.mb-\[-8px\] {
    margin-bottom: -8px
}

.mb-\[100px\] {
    margin-bottom: 100px
}

.mb-\[10px\] {
    margin-bottom: 10px
}

.mb-\[1px\] {
    margin-bottom: 1px
}

.mb-\[20px\] {
    margin-bottom: 20px
}

.mb-\[24px\] {
    margin-bottom: 24px
}

.mb-\[5px\] {
    margin-bottom: 5px
}

.mb-\[7px\] {
    margin-bottom: 7px
}

.mb-\[80px\] {
    margin-bottom: 80px
}

.me-1 {
    margin-inline-end: .25rem
}

.me-10 {
    margin-inline-end: 2.5rem
}

.me-2 {
    margin-inline-end: .5rem
}

.me-3 {
    margin-inline-end: .75rem
}

.me-6 {
    margin-inline-end: 1.5rem
}

.me-auto {
    margin-inline-end: auto
}

.ml-1 {
    margin-left: .25rem
}

.ml-2 {
    margin-left: .5rem
}

.ml-3 {
    margin-left: .75rem
}

.ml-4 {
    margin-left: 1rem
}

.ml-5 {
    margin-left: 1.25rem
}

.ml-\[10px\] {
    margin-left: 10px
}

.ml-\[15px\] {
    margin-left: 15px
}

.ml-\[5px\] {
    margin-left: 5px
}

.ml-\[7px\] {
    margin-left: 7px
}

.ml-auto {
    margin-left: auto
}

.mr-1 {
    margin-right: .25rem
}

.mr-2 {
    margin-right: .5rem
}

.mr-3 {
    margin-right: .75rem
}

.mr-4 {
    margin-right: 1rem
}

.mr-5 {
    margin-right: 1.25rem
}

.mr-6 {
    margin-right: 1.5rem
}

.mr-7 {
    margin-right: 1.75rem
}

.mr-\[10px\] {
    margin-right: 10px
}

.mr-auto {
    margin-right: auto
}

.ms-2 {
    margin-inline-start: .5rem
}

.ms-4 {
    margin-inline-start: 1rem
}

.ms-auto {
    margin-inline-start: auto
}

.mt-0 {
    margin-top: 0
}

.mt-0\.5 {
    margin-top: .125rem
}

.mt-1 {
    margin-top: .25rem
}

.mt-10 {
    margin-top: 2.5rem
}

.mt-11 {
    margin-top: 2.75rem
}

.mt-12 {
    margin-top: 3rem
}

.mt-16 {
    margin-top: 4rem
}

.mt-2 {
    margin-top: .5rem
}

.mt-20 {
    margin-top: 5rem
}

.mt-3 {
    margin-top: .75rem
}

.mt-4 {
    margin-top: 1rem
}

.mt-5 {
    margin-top: 1.25rem
}

.mt-6 {
    margin-top: 1.5rem
}

.mt-7 {
    margin-top: 1.75rem
}

.mt-8 {
    margin-top: 2rem
}

.mt-\[100px\] {
    margin-top: 100px
}

.mt-\[10px\] {
    margin-top: 10px
}

.mt-\[14px\] {
    margin-top: 14px
}

.mt-\[15px\] {
    margin-top: 15px
}

.mt-\[1px\] {
    margin-top: 1px
}

.mt-\[20px\] {
    margin-top: 20px
}

.mt-\[24px\] {
    margin-top: 24px
}

.mt-\[25px\] {
    margin-top: 25px
}

.mt-\[2px\] {
    margin-top: 2px
}

.mt-\[30px\] {
    margin-top: 30px
}

.mt-\[35px\] {
    margin-top: 35px
}

.mt-\[3px\] {
    margin-top: 3px
}

.mt-\[40px\] {
    margin-top: 40px
}

.mt-\[5px\] {
    margin-top: 5px
}

.mt-\[8px\] {
    margin-top: 8px
}

.line-clamp-1 {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    overflow: hidden
}

.\  !block {
    display: block !important
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.inline {
    display: inline
}

.\  !flex {
    display: flex !important
}

.flex {
    display: flex
}

.\  !inline-flex {
    display: inline-flex !important
}

.inline-flex {
    display: inline-flex
}

.table {
    display: table
}

.table-row {
    display: table-row
}

.grid {
    display: grid
}

.\  !hidden {
    display: none !important
}

.hidden {
    display: none
}

.aspect-\[8\] {
    aspect-ratio: 8
}

.aspect-square {
    aspect-ratio: 1/1
}

.\  !h-\[25px\] {
    height: 25px !important
}

.\  !h-\[26px\] {
    height: 26px !important
}

.\  !h-\[30px\] {
    height: 30px !important
}

.\  !h-\[52px\] {
    height: 52px !important
}

.h-1 {
    height: .25rem
}

.h-10 {
    height: 2.5rem
}

.h-11 {
    height: 2.75rem
}

.h-12 {
    height: 3rem
}

.h-14 {
    height: 3.5rem
}

.h-16 {
    height: 4rem
}

.h-2 {
    height: .5rem
}

.h-2\/3 {
    height: 66.666667%
}

.h-20 {
    height: 5rem
}

.h-24 {
    height: 6rem
}

.h-28 {
    height: 7rem
}

.h-3 {
    height: .75rem
}

.h-32 {
    height: 8rem
}

.h-36 {
    height: 9rem
}

.h-4 {
    height: 1rem
}

.h-5 {
    height: 1.25rem
}

.h-6 {
    height: 1.5rem
}

.h-7 {
    height: 1.75rem
}

.h-8 {
    height: 2rem
}

.h-9 {
    height: 2.25rem
}

.h-\[100\%\] {
    height: 100%
}

.h-\[100px\] {
    height: 100px
}

.h-\[10px\] {
    height: 10px
}

.h-\[110px\] {
    height: 110px
}

.h-\[11px\] {
    height: 11px
}

.h-\[120px\] {
    height: 120px
}

.h-\[13px\] {
    height: 13px
}

.h-\[140px\] {
    height: 140px
}

.h-\[14px\] {
    height: 14px
}

.h-\[150px\] {
    height: 150px
}

.h-\[155px\] {
    height: 155px
}

.h-\[15px\] {
    height: 15px
}

.h-\[15vw\] {
    height: 15vw
}

.h-\[16px\] {
    height: 16px
}

.h-\[180px\] {
    height: 180px
}

.h-\[18px\] {
    height: 18px
}

.h-\[1px\] {
    height: 1px
}

.h-\[200px\] {
    height: 200px
}

.h-\[20px\] {
    height: 20px
}

.h-\[212px\] {
    height: 212px
}

.h-\[21px\] {
    height: 21px
}

.h-\[225px\] {
    height: 225px
}

.h-\[22px\] {
    height: 22px
}

.h-\[24px\] {
    height: 24px
}

.h-\[25px\] {
    height: 25px
}

.h-\[28px\] {
    height: 28px
}

.h-\[300px\] {
    height: 300px
}

.h-\[30px\] {
    height: 30px
}

.h-\[32px\] {
    height: 32px
}

.h-\[33px\] {
    height: 33px
}

.h-\[34px\] {
    height: 34px
}

.h-\[350px\] {
    height: 350px
}

.h-\[35px\] {
    height: 35px
}

.h-\[36px\] {
    height: 36px
}

.h-\[37px\] {
    height: 37px
}

.h-\[38px\] {
    height: 38px
}

.h-\[3px\] {
    height: 3px
}

.h-\[400px\] {
    height: 400px
}

.h-\[40px\] {
    height: 40px
}

.h-\[43px\] {
    height: 43px
}

.h-\[44px\] {
    height: 44px
}

.h-\[45px\] {
    height: 45px
}

.h-\[50\%\] {
    height: 50%
}

.h-\[50px\] {
    height: 50px
}

.h-\[50vh\] {
    height: 50vh
}

.h-\[53px\] {
    height: 53px
}

.h-\[55px\] {
    height: 55px
}

.h-\[59px\] {
    height: 59px
}

.h-\[5px\] {
    height: 5px
}

.h-\[600px\] {
    height: 600px
}

.h-\[60px\] {
    height: 60px
}

.h-\[64px\] {
    height: 64px
}

.h-\[65px\] {
    height: 65px
}

.h-\[66px\] {
    height: 66px
}

.h-\[70\%\] {
    height: 70%
}

.h-\[70px\] {
    height: 70px
}

.h-\[70vh\] {
    height: 70vh
}

.h-\[75px\] {
    height: 75px
}

.h-\[7px\] {
    height: 7px
}

.h-\[80px\] {
    height: 80px
}

.h-\[80vh\] {
    height: 80vh
}

.h-\[85px\] {
    height: 85px
}

.h-\[88px\] {
    height: 88px
}

.h-\[8px\] {
    height: 8px
}

.h-\[90px\] {
    height: 90px
}

.h-\[95px\] {
    height: 95px
}

.h-auto {
    height: auto
}

.h-fit {
    height: -moz-fit-content;
    height: fit-content
}

.h-full {
    height: 100%
}

.h-screen {
    height: 100vh
}

.\  !max-h-\[12px\] {
    max-height: 12px !important
}

.max-h-0 {
    max-height: 0
}

.max-h-8 {
    max-height: 2rem
}

.max-h-\[0px\] {
    max-height: 0
}

.max-h-\[20\%\] {
    max-height: 20%
}

.max-h-\[200px\] {
    max-height: 200px
}

.max-h-\[290px\] {
    max-height: 290px
}

.max-h-\[300px\] {
    max-height: 300px
}

.max-h-\[45vh\] {
    max-height: 45vh
}

.max-h-\[500px\] {
    max-height: 500px
}

.max-h-\[60px\] {
    max-height: 60px
}

.max-h-\[70\%\] {
    max-height: 70%
}

.max-h-full {
    max-height: 100%
}

.max-h-max {
    max-height: -moz-max-content;
    max-height: max-content
}

.\  !min-h-0 {
    min-height: 0 !important
}

.min-h-0 {
    min-height: 0
}

.min-h-\[1000px\] {
    min-height: 1000px
}

.min-h-\[105px\] {
    min-height: 105px
}

.min-h-\[110px\] {
    min-height: 110px
}

.min-h-\[120px\] {
    min-height: 120px
}

.min-h-\[135px\] {
    min-height: 135px
}

.min-h-\[140px\] {
    min-height: 140px
}

.min-h-\[208px\] {
    min-height: 208px
}

.min-h-\[230px\] {
    min-height: 230px
}

.min-h-\[275px\] {
    min-height: 275px
}

.min-h-\[360px\] {
    min-height: 360px
}

.min-h-\[400px\] {
    min-height: 400px
}

.min-h-\[500px\] {
    min-height: 500px
}

.min-h-\[50px\] {
    min-height: 50px
}

.min-h-\[52px\] {
    min-height: 52px
}

.min-h-\[55px\] {
    min-height: 55px
}

.min-h-\[6rem\] {
    min-height: 6rem
}

.min-h-\[700px\] {
    min-height: 700px
}

.min-h-\[85px\] {
    min-height: 85px
}

.min-h-\[var\(--window-height\)\] {
    min-height: var(--window-height)
}

.min-h-screen {
    min-height: 100vh
}

.\  !w-1\/3 {
    width: 33.333333% !important
}

.\  !w-4 {
    width: 1rem !important
}

.\  !w-\[107px\] {
    width: 107px !important
}

.\  !w-\[200px\] {
    width: 200px !important
}

.\  !w-\[20px\] {
    width: 20px !important
}

.\  !w-\[250px\] {
    width: 250px !important
}

.\  !w-\[70px\] {
    width: 70px !important
}

.\  !w-\[87px\] {
    width: 87px !important
}

.\  !w-auto {
    width: auto !important
}

.\  !w-full {
    width: 100% !important
}

.w-1\/2 {
    width: 50%
}

.w-1\/3 {
    width: 33.333333%
}

.w-1\/4 {
    width: 25%
}

.w-1\/5 {
    width: 20%
}

.w-1\/6 {
    width: 16.666667%
}

.w-10 {
    width: 2.5rem
}

.w-10\/12 {
    width: 83.333333%
}

.w-11 {
    width: 2.75rem
}

.w-11\/12 {
    width: 91.666667%
}

.w-12 {
    width: 3rem
}

.w-16 {
    width: 4rem
}

.w-2 {
    width: .5rem
}

.w-2\/3 {
    width: 66.666667%
}

.w-2\/5 {
    width: 40%
}

.w-20 {
    width: 5rem
}

.w-24 {
    width: 6rem
}

.w-3 {
    width: .75rem
}

.w-3\/12 {
    width: 25%
}

.w-32 {
    width: 8rem
}

.w-4 {
    width: 1rem
}

.w-5 {
    width: 1.25rem
}

.w-6 {
    width: 1.5rem
}

.w-7 {
    width: 1.75rem
}

.w-8 {
    width: 2rem
}

.w-8\/12 {
    width: 66.666667%
}

.w-80 {
    width: 20rem
}

.w-9 {
    width: 2.25rem
}

.w-\[10\%\] {
    width: 10%
}

.w-\[100\%\] {
    width: 100%
}

.w-\[100px\] {
    width: 100px
}

.w-\[100vw\] {
    width: 100vw
}

.w-\[105px\] {
    width: 105px
}

.w-\[10px\] {
    width: 10px
}

.w-\[110px\] {
    width: 110px
}

.w-\[11px\] {
    width: 11px
}

.w-\[120px\] {
    width: 120px
}

.w-\[125px\] {
    width: 125px
}

.w-\[12px\] {
    width: 12px
}

.w-\[12vw\] {
    width: 12vw
}

.w-\[13\.5vw\] {
    width: 13.5vw
}

.w-\[130px\] {
    width: 130px
}

.w-\[140px\] {
    width: 140px
}

.w-\[14px\] {
    width: 14px
}

.w-\[15\%\] {
    width: 15%
}

.w-\[15\.5vw\] {
    width: 15.5vw
}

.w-\[150px\] {
    width: 150px
}

.w-\[15px\] {
    width: 15px
}

.w-\[16px\] {
    width: 16px
}

.w-\[17\.5\%\] {
    width: 17.5%
}

.w-\[175px\] {
    width: 175px
}

.w-\[17px\] {
    width: 17px
}

.w-\[180px\] {
    width: 180px
}

.w-\[18px\] {
    width: 18px
}

.w-\[1px\] {
    width: 1px
}

.w-\[20\%\] {
    width: 20%
}

.w-\[200px\] {
    width: 200px
}

.w-\[20px\] {
    width: 20px
}

.w-\[22\.5\%\] {
    width: 22.5%
}

.w-\[22px\] {
    width: 22px
}

.w-\[230px\] {
    width: 230px
}

.w-\[23vw\] {
    width: 23vw
}

.w-\[24\%\] {
    width: 24%
}

.w-\[24px\] {
    width: 24px
}

.w-\[25\%\] {
    width: 25%
}

.w-\[250px\] {
    width: 250px
}

.w-\[25px\] {
    width: 25px
}

.w-\[26px\] {
    width: 26px
}

.w-\[26vw\] {
    width: 26vw
}

.w-\[27\.5\%\] {
    width: 27.5%
}

.w-\[279px\] {
    width: 279px
}

.w-\[280px\] {
    width: 280px
}

.w-\[28px\] {
    width: 28px
}

.w-\[2px\] {
    width: 2px
}

.w-\[30\%\] {
    width: 30%
}

.w-\[300px\] {
    width: 300px
}

.w-\[30px\] {
    width: 30px
}

.w-\[32px\] {
    width: 32px
}

.w-\[330px\] {
    width: 330px
}

.w-\[35\%\] {
    width: 35%
}

.w-\[35px\] {
    width: 35px
}

.w-\[38px\] {
    width: 38px
}

.w-\[400px\] {
    width: 400px
}

.w-\[40px\] {
    width: 40px
}

.w-\[42px\] {
    width: 42px
}

.w-\[45px\] {
    width: 45px
}

.w-\[50\%\] {
    width: 50%
}

.w-\[500px\] {
    width: 500px
}

.w-\[50px\] {
    width: 50px
}

.w-\[55\.5\%\] {
    width: 55.5%
}

.w-\[59px\] {
    width: 59px
}

.w-\[5vw\] {
    width: 5vw
}

.w-\[60\%\] {
    width: 60%
}

.w-\[60px\] {
    width: 60px
}

.w-\[64px\] {
    width: 64px
}

.w-\[65\%\] {
    width: 65%
}

.w-\[65px\] {
    width: 65px
}

.w-\[66px\] {
    width: 66px
}

.w-\[6px\] {
    width: 6px
}

.w-\[70\%\] {
    width: 70%
}

.w-\[70px\] {
    width: 70px
}

.w-\[75\%\] {
    width: 75%
}

.w-\[750px\] {
    width: 750px
}

.w-\[75px\] {
    width: 75px
}

.w-\[7px\] {
    width: 7px
}

.w-\[800px\] {
    width: 800px
}

.w-\[80px\] {
    width: 80px
}

.w-\[85px\] {
    width: 85px
}

.w-\[88px\] {
    width: 88px
}

.w-\[90\%\] {
    width: 90%
}

.w-\[900px\] {
    width: 900px
}

.w-\[90px\] {
    width: 90px
}

.w-fit {
    width: -moz-fit-content;
    width: fit-content
}

.w-full {
    width: 100%
}

.w-max {
    width: -moz-max-content;
    width: max-content
}

.\  !min-w-\[120px\] {
    min-width: 120px !important
}

.\  !min-w-\[240px\] {
    min-width: 240px !important
}

.\  !min-w-\[25px\] {
    min-width: 25px !important
}

.\  !min-w-\[52px\] {
    min-width: 52px !important
}

.\  !min-w-full {
    min-width: 100% !important
}

.min-w-0 {
    min-width: 0
}

.min-w-\[100px\] {
    min-width: 100px
}

.min-w-\[110px\] {
    min-width: 110px
}

.min-w-\[120px\] {
    min-width: 120px
}

.min-w-\[125px\] {
    min-width: 125px
}

.min-w-\[150px\] {
    min-width: 150px
}

.min-w-\[170px\] {
    min-width: 170px
}

.min-w-\[180px\] {
    min-width: 180px
}

.min-w-\[200px\] {
    min-width: 200px
}

.min-w-\[25\%\] {
    min-width: 25%
}

.min-w-\[250px\] {
    min-width: 250px
}

.min-w-\[275px\] {
    min-width: 275px
}

.min-w-\[320px\] {
    min-width: 320px
}

.min-w-\[330px\] {
    min-width: 330px
}

.min-w-\[35px\] {
    min-width: 35px
}

.min-w-\[40px\] {
    min-width: 40px
}

.min-w-\[45px\] {
    min-width: 45px
}

.min-w-\[50px\] {
    min-width: 50px
}

.min-w-\[60px\] {
    min-width: 60px
}

.min-w-\[70px\] {
    min-width: 70px
}

.min-w-\[80px\] {
    min-width: 80px
}

.min-w-\[85px\] {
    min-width: 85px
}

.min-w-\[90px\] {
    min-width: 90px
}

.min-w-\[92px\] {
    min-width: 92px
}

.min-w-full {
    min-width: 100%
}

.\  !max-w-\[120px\] {
    max-width: 120px !important
}

.\  !max-w-\[200px\] {
    max-width: 200px !important
}

.\  !max-w-full {
    max-width: 100% !important
}

.max-w-\[1050px\] {
    max-width: 1050px
}

.max-w-\[120px\] {
    max-width: 120px
}

.max-w-\[140px\] {
    max-width: 140px
}

.max-w-\[150px\] {
    max-width: 150px
}

.max-w-\[15rem\] {
    max-width: 15rem
}

.max-w-\[170px\] {
    max-width: 170px
}

.max-w-\[175px\] {
    max-width: 175px
}

.max-w-\[180px\] {
    max-width: 180px
}

.max-w-\[200px\] {
    max-width: 200px
}

.max-w-\[215px\] {
    max-width: 215px
}

.max-w-\[225px\] {
    max-width: 225px
}

.max-w-\[23px\] {
    max-width: 23px
}

.max-w-\[250px\] {
    max-width: 250px
}

.max-w-\[275px\] {
    max-width: 275px
}

.max-w-\[300px\] {
    max-width: 300px
}

.max-w-\[32\.5\%\] {
    max-width: 32.5%
}

.max-w-\[320px\] {
    max-width: 320px
}

.max-w-\[350px\] {
    max-width: 350px
}

.max-w-\[360px\] {
    max-width: 360px
}

.max-w-\[365px\] {
    max-width: 365px
}

.max-w-\[375px\] {
    max-width: 375px
}

.max-w-\[460px\] {
    max-width: 460px
}

.max-w-\[500px\] {
    max-width: 500px
}

.max-w-\[530px\] {
    max-width: 530px
}

.max-w-\[550px\] {
    max-width: 550px
}

.max-w-\[600px\] {
    max-width: 600px
}

.max-w-\[800px\] {
    max-width: 800px
}

.max-w-\[80px\] {
    max-width: 80px
}

.max-w-\[90\%\] {
    max-width: 90%
}

.max-w-\[900px\] {
    max-width: 900px
}

.max-w-\[94px\] {
    max-width: 94px
}

.max-w-full {
    max-width: 100%
}

.max-w-max {
    max-width: -moz-max-content;
    max-width: max-content
}

.max-w-none {
    max-width: none
}

.flex-1 {
    flex: 1 1 0%
}

.flex-shrink {
    flex-shrink: 1
}

.flex-shrink-0 {
    flex-shrink: 0
}

.shrink {
    flex-shrink: 1
}

.shrink-0 {
    flex-shrink: 0
}

.flex-grow {
    flex-grow: 1
}

.flex-grow-0 {
    flex-grow: 0
}

.grow {
    flex-grow: 1
}

.grow-0 {
    flex-grow: 0
}

.basis-full {
    flex-basis: 100%
}

.table-fixed {
    table-layout: fixed
}

.border-collapse {
    border-collapse: collapse
}

.origin-center {
    transform-origin: center
}

.-translate-x-1\/2,
.-translate-x-\[50\%\] {
    --tw-translate-x: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-translate-y-1\/2,
.-translate-y-\[50\%\] {
    --tw-translate-y: -50%
}

.-translate-y-1\/2,
.-translate-y-\[50\%\],
.-translate-y-\[90\%\] {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-translate-y-\[90\%\] {
    --tw-translate-y: -90%
}

.translate-x-\[-50\%\] {
    --tw-translate-x: -50%
}

.translate-x-\[-50\%\],
.translate-y-\[-50\%\] {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-\[-50\%\] {
    --tw-translate-y: -50%
}

.-rotate-45 {
    --tw-rotate: -45deg
}

.-rotate-45,
.rotate-180 {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.rotate-180 {
    --tw-rotate: 180deg
}

.rotate-90 {
    --tw-rotate: 90deg
}

.rotate-90,
.scale-\[0\.9\] {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.scale-\[0\.9\] {
    --tw-scale-x: .9;
    --tw-scale-y: .9
}

.scale-\[1\.3\] {
    --tw-scale-x: 1.3;
    --tw-scale-y: 1.3
}

.scale-\[1\.3\],
.scale-\[1\] {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.scale-\[1\] {
    --tw-scale-x: 1;
    --tw-scale-y: 1
}

.scale-x-\[-1\] {
    --tw-scale-x: -1
}

.scale-x-\[-1\],
.transform {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

@keyframes pulse {
    50% {
        opacity: .5
    }
}

.animate-pulse {
    animation: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite
}

.\  !cursor-default {
    cursor: default !important
}

.cursor-default {
    cursor: default
}

.cursor-not-allowed {
    cursor: not-allowed
}

.cursor-pointer {
    cursor: pointer
}

.select-none {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.resize {
    resize: both
}

.list-decimal {
    list-style-type: decimal
}

.auto-cols-fr {
    grid-auto-columns: minmax(0, 1fr)
}

.grid-flow-row {
    grid-auto-flow: row
}

.grid-flow-col {
    grid-auto-flow: column
}

.grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr))
}

.grid-cols-10 {
    grid-template-columns: repeat(10, minmax(0, 1fr))
}

.grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr))
}

.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr))
}

.grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr))
}

.grid-cols-\[1fr\, auto\, 1fr\] {
    grid-template-columns: 1fr auto 1fr
}

.grid-cols-\[auto_1fr\] {
    grid-template-columns: auto 1fr
}

.grid-rows-1 {
    grid-template-rows: repeat(1, minmax(0, 1fr))
}

.grid-rows-2 {
    grid-template-rows: repeat(2, minmax(0, 1fr))
}

.\  !flex-row {
    flex-direction: row !important
}

.flex-row {
    flex-direction: row
}

.flex-row-reverse {
    flex-direction: row-reverse
}

.\  !flex-col {
    flex-direction: column !important
}

.flex-col {
    flex-direction: column
}

.flex-col-reverse {
    flex-direction: column-reverse
}

.flex-wrap {
    flex-wrap: wrap
}

.flex-nowrap {
    flex-wrap: nowrap
}

.place-content-center {
    place-content: center
}

.place-items-end {
    place-items: end
}

.place-items-center {
    place-items: center
}

.items-start {
    align-items: flex-start
}

.items-end {
    align-items: flex-end
}

.\  !items-center {
    align-items: center !important
}

.items-center {
    align-items: center
}

.items-stretch {
    align-items: stretch
}

.justify-start {
    justify-content: flex-start
}

.justify-end {
    justify-content: flex-end
}

.\  !justify-center {
    justify-content: center !important
}

.justify-center {
    justify-content: center
}

.\  !justify-between {
    justify-content: space-between !important
}

.justify-between {
    justify-content: space-between
}

.justify-around {
    justify-content: space-around
}

.justify-evenly {
    justify-content: space-evenly
}

.\  !gap-0 {
    gap: 0 !important
}

.\  !gap-2 {
    gap: .5rem !important
}

.gap-1 {
    gap: .25rem
}

.gap-1\.5 {
    gap: .375rem
}

.gap-10 {
    gap: 2.5rem
}

.gap-11 {
    gap: 2.75rem
}

.gap-12 {
    gap: 3rem
}

.gap-2 {
    gap: .5rem
}

.gap-2\.5 {
    gap: .625rem
}

.gap-3 {
    gap: .75rem
}

.gap-4 {
    gap: 1rem
}

.gap-5 {
    gap: 1.25rem
}

.gap-6 {
    gap: 1.5rem
}

.gap-8 {
    gap: 2rem
}

.gap-\[10px\] {
    gap: 10px
}

.gap-\[2px\] {
    gap: 2px
}

.\  !gap-x-2 {
    -moz-column-gap: .5rem !important;
    column-gap: .5rem !important
}

.\  !gap-y-0 {
    row-gap: 0 !important
}

.gap-x-1 {
    -moz-column-gap: .25rem;
    column-gap: .25rem
}

.gap-x-12 {
    -moz-column-gap: 3rem;
    column-gap: 3rem
}

.gap-x-2 {
    -moz-column-gap: .5rem;
    column-gap: .5rem
}

.gap-x-3 {
    -moz-column-gap: .75rem;
    column-gap: .75rem
}

.gap-x-4 {
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

.gap-x-5 {
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem
}

.gap-x-7 {
    -moz-column-gap: 1.75rem;
    column-gap: 1.75rem
}

.gap-x-8 {
    -moz-column-gap: 2rem;
    column-gap: 2rem
}

.gap-y-1 {
    row-gap: .25rem
}

.gap-y-2 {
    row-gap: .5rem
}

.gap-y-3 {
    row-gap: .75rem
}

.gap-y-4 {
    row-gap: 1rem
}

.gap-y-\[2px\] {
    row-gap: 2px
}

.space-x-3>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-left: calc(.75rem*(1 - var(--tw-space-x-reverse)));
    margin-right: calc(.75rem*var(--tw-space-x-reverse))
}

.space-x-4>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-left: calc(1rem*(1 - var(--tw-space-x-reverse)));
    margin-right: calc(1rem*var(--tw-space-x-reverse))
}

.space-y-2>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-bottom: calc(.5rem*var(--tw-space-y-reverse));
    margin-top: calc(.5rem*(1 - var(--tw-space-y-reverse)))
}

.space-y-3>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-bottom: calc(.75rem*var(--tw-space-y-reverse));
    margin-top: calc(.75rem*(1 - var(--tw-space-y-reverse)))
}

.space-y-4>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-bottom: calc(1rem*var(--tw-space-y-reverse));
    margin-top: calc(1rem*(1 - var(--tw-space-y-reverse)))
}

.space-y-6>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-bottom: calc(1.5rem*var(--tw-space-y-reverse));
    margin-top: calc(1.5rem*(1 - var(--tw-space-y-reverse)))
}

.place-self-center {
    place-self: center
}

.self-start {
    align-self: flex-start
}

.self-center {
    align-self: center
}

.overflow-auto {
    overflow: auto
}

.\  !overflow-hidden {
    overflow: hidden !important
}

.overflow-hidden {
    overflow: hidden
}

.overflow-clip {
    overflow: clip
}

.\  !overflow-visible {
    overflow: visible !important
}

.overflow-x-auto {
    overflow-x: auto
}

.overflow-y-auto {
    overflow-y: auto
}

.overflow-x-hidden {
    overflow-x: hidden
}

.overflow-x-scroll {
    overflow-x: scroll
}

.overflow-y-scroll {
    overflow-y: scroll
}

.scroll-smooth {
    scroll-behavior: smooth
}

.truncate {
    overflow: hidden;
    white-space: nowrap
}

.text-ellipsis,
.truncate {
    text-overflow: ellipsis
}

.whitespace-nowrap {
    white-space: nowrap
}

.whitespace-pre-wrap {
    white-space: pre-wrap
}

.break-words {
    overflow-wrap: break-word
}

.break-all {
    word-break: break-all
}

.\  !rounded {
    border-radius: .25rem !important
}

.\  !rounded-\[10px\] {
    border-radius: 10px !important
}

.\  !rounded-\[22px\] {
    border-radius: 22px !important
}

.\  !rounded-\[4rem\] {
    border-radius: 4rem !important
}

.\  !rounded-\[5px\] {
    border-radius: 5px !important
}

.\  !rounded-\[6px\] {
    border-radius: 6px !important
}

.\  !rounded-full {
    border-radius: 9999px !important
}

.\  !rounded-lg {
    border-radius: .5rem !important
}

.\  !rounded-md {
    border-radius: .375rem !important
}

.\  !rounded-none {
    border-radius: 0 !important
}

.\  !rounded-xl {
    border-radius: .75rem !important
}

.rounded {
    border-radius: .25rem
}

.rounded-2xl {
    border-radius: 1rem
}

.rounded-3xl {
    border-radius: 1.5rem
}

.rounded-\[10px\] {
    border-radius: 10px
}

.rounded-\[15px\] {
    border-radius: 15px
}

.rounded-\[20px\] {
    border-radius: 20px
}

.rounded-\[23px\] {
    border-radius: 23px
}

.rounded-\[30px\] {
    border-radius: 30px
}

.rounded-\[4px\] {
    border-radius: 4px
}

.rounded-\[4rem\] {
    border-radius: 4rem
}

.rounded-\[50\%\] {
    border-radius: 50%
}

.rounded-\[50px\] {
    border-radius: 50px
}

.rounded-\[5px\] {
    border-radius: 5px
}

.rounded-full {
    border-radius: 9999px
}

.rounded-lg {
    border-radius: .5rem
}

.rounded-md {
    border-radius: .375rem
}

.rounded-none {
    border-radius: 0
}

.rounded-sm {
    border-radius: .125rem
}

.rounded-xl {
    border-radius: .75rem
}

.\  !rounded-l-none {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important
}

.rounded-b-2xl {
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem
}

.rounded-b-3xl {
    border-bottom-left-radius: 1.5rem;
    border-bottom-right-radius: 1.5rem
}

.rounded-b-\[30px\] {
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px
}

.rounded-b-lg {
    border-bottom-left-radius: .5rem;
    border-bottom-right-radius: .5rem
}

.rounded-b-md {
    border-bottom-left-radius: .375rem;
    border-bottom-right-radius: .375rem
}

.rounded-b-none {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.rounded-b-xl {
    border-bottom-left-radius: .75rem;
    border-bottom-right-radius: .75rem
}

.rounded-r-\[30px\] {
    border-bottom-right-radius: 30px;
    border-top-right-radius: 30px
}

.rounded-t-\[125px\] {
    border-top-left-radius: 125px;
    border-top-right-radius: 125px
}

.rounded-t-lg {
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem
}

.rounded-t-md {
    border-top-left-radius: .375rem;
    border-top-right-radius: .375rem
}

.\  !rounded-tl-\[25px\] {
    border-top-left-radius: 25px !important
}

.\  !rounded-tl-none {
    border-top-left-radius: 0 !important
}

.\  !rounded-tr-\[25px\] {
    border-top-right-radius: 25px !important
}

.\  !rounded-tr-none {
    border-top-right-radius: 0 !important
}

.rounded-bl-xl {
    border-bottom-left-radius: .75rem
}

.rounded-br-xl {
    border-bottom-right-radius: .75rem
}

.rounded-tl-\[10px\] {
    border-top-left-radius: 10px
}

.rounded-tl-md {
    border-top-left-radius: .375rem
}

.rounded-tl-xl {
    border-top-left-radius: .75rem
}

.rounded-tr-\[10px\] {
    border-top-right-radius: 10px
}

.rounded-tr-md {
    border-top-right-radius: .375rem
}

.rounded-tr-xl {
    border-top-right-radius: .75rem
}

.\  !border {
    border-width: 1px !important
}

.\  !border-0 {
    border-width: 0 !important
}

.\  !border-2 {
    border-width: 2px !important
}

.border {
    border-width: 1px
}

.border-2 {
    border-width: 2px
}

.border-\[0\.1rem\] {
    border-width: .1rem
}

.border-\[1px\] {
    border-width: 1px
}

.border-\[2px\] {
    border-width: 2px
}

.border-\[3px\] {
    border-width: 3px
}

.border-x {
    border-left-width: 1px;
    border-right-width: 1px
}

.border-y {
    border-bottom-width: 1px;
    border-top-width: 1px
}

.\  !border-b-0 {
    border-bottom-width: 0 !important
}

.\  !border-t-0 {
    border-top-width: 0 !important
}

.border-b {
    border-bottom-width: 1px
}

.border-b-0 {
    border-bottom-width: 0
}

.border-b-2 {
    border-bottom-width: 2px
}

.border-b-\[1px\] {
    border-bottom-width: 1px
}

.border-b-\[3px\] {
    border-bottom-width: 3px
}

.border-l {
    border-left-width: 1px
}

.border-l-0 {
    border-left-width: 0
}

.border-r {
    border-right-width: 1px
}

.border-r-2,
.border-r-\[2px\] {
    border-right-width: 2px
}

.border-t {
    border-top-width: 1px
}

.border-t-0 {
    border-top-width: 0
}

.border-solid {
    border-style: solid
}

.\  !border-none {
    border-style: none !important
}

.border-none {
    border-style: none
}

.\  !border-\[\#393939\] {
    --tw-border-opacity: 1 !important;
    border-color: rgb(57 57 57/var(--tw-border-opacity)) !important
}

.\  !border-\[\#FF0000\] {
    --tw-border-opacity: 1 !important;
    border-color: rgb(255 0 0/var(--tw-border-opacity)) !important
}

.\  !border-gray-400 {
    --tw-border-opacity: 1 !important;
    border-color: rgb(156 163 175/var(--tw-border-opacity)) !important
}

.\  !border-line {
    border-color: var(--line) !important
}

.\  !border-primary {
    border-color: var(--primary) !important
}

.border-\[\#1A1A1A\] {
    --tw-border-opacity: 1;
    border-color: rgb(26 26 26/var(--tw-border-opacity))
}

.border-\[\#313030\] {
    --tw-border-opacity: 1;
    border-color: rgb(49 48 48/var(--tw-border-opacity))
}

.border-\[\#46AD4D\] {
    --tw-border-opacity: 1;
    border-color: rgb(70 173 77/var(--tw-border-opacity))
}

.border-\[\#5F5F5F\],
.border-\[\#5f5f5f\] {
    --tw-border-opacity: 1;
    border-color: rgb(95 95 95/var(--tw-border-opacity))
}

.border-\[\#AD0609\] {
    --tw-border-opacity: 1;
    border-color: rgb(173 6 9/var(--tw-border-opacity))
}

.border-\[\#C7B587\] {
    --tw-border-opacity: 1;
    border-color: rgb(199 181 135/var(--tw-border-opacity))
}

.border-\[--line\],
.border-\[var\(--line\)\] {
    border-color: var(--line)
}

.border-\[var\(--primary\)\] {
    border-color: var(--primary)
}

.border-\[var\(--text-light\)\] {
    border-color: var(--text-light)
}

.border-black {
    --tw-border-opacity: 1;
    border-color: rgb(0 0 0/var(--tw-border-opacity))
}

.border-gray-200 {
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235/var(--tw-border-opacity))
}

.border-gray-400 {
    --tw-border-opacity: 1;
    border-color: rgb(156 163 175/var(--tw-border-opacity))
}

.border-gray-600 {
    --tw-border-opacity: 1;
    border-color: rgb(75 85 99/var(--tw-border-opacity))
}

.border-line {
    border-color: var(--line)
}

.border-primary {
    border-color: var(--primary)
}

.border-text-base {
    border-color: var(--text-base)
}

.border-white {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255/var(--tw-border-opacity))
}

.border-yellow-300 {
    --tw-border-opacity: 1;
    border-color: rgb(253 224 71/var(--tw-border-opacity))
}

.border-y-line {
    border-bottom-color: var(--line);
    border-top-color: var(--line)
}

.\  !border-b-primary {
    border-bottom-color: var(--primary) !important
}

.border-b-\[--line\] {
    border-bottom-color: var(--line)
}

.border-b-\[--status-blue\] {
    border-bottom-color: var(--status-blue)
}

.border-b-\[--status-green\] {
    border-bottom-color: var(--status-green)
}

.border-b-\[--status-red\] {
    border-bottom-color: var(--status-red)
}

.border-b-\[var\(--line\)\],
.border-b-line {
    border-bottom-color: var(--line)
}

.border-b-transparent {
    border-bottom-color: transparent
}

.border-r-line {
    border-right-color: var(--line)
}

.border-t-\[--line\],
.border-t-line {
    border-top-color: var(--line)
}

.\  !bg-\[\#363E7B\] {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(54 62 123/var(--tw-bg-opacity)) !important
}

.\  !bg-\[\#757575\] {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(117 117 117/var(--tw-bg-opacity)) !important
}

.\  !bg-\[--primary\] {
    background-color: var(--primary) !important
}

.\  !bg-\[var\(--o-phone-bg\)\] {
    background-color: var(--o-phone-bg) !important
}

.\  !bg-\[white\] {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(255 255 255/var(--tw-bg-opacity)) !important
}

.\  !bg-black {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(0 0 0/var(--tw-bg-opacity)) !important
}

.\  !bg-content-light {
    background-color: var(--content-light) !important
}

.\  !bg-transparent {
    background-color: transparent !important
}

.\  !bg-white {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(255 255 255/var(--tw-bg-opacity)) !important
}

.bg-\[\#0093FF\] {
    --tw-bg-opacity: 1;
    background-color: rgb(0 147 255/var(--tw-bg-opacity))
}

.bg-\[\#00D600\] {
    --tw-bg-opacity: 1;
    background-color: rgb(0 214 0/var(--tw-bg-opacity))
}

.bg-\[\#0BB212\] {
    --tw-bg-opacity: 1;
    background-color: rgb(11 178 18/var(--tw-bg-opacity))
}

.bg-\[\#0E0E0F\] {
    --tw-bg-opacity: 1;
    background-color: rgb(14 14 15/var(--tw-bg-opacity))
}

.bg-\[\#0d3863\] {
    --tw-bg-opacity: 1;
    background-color: rgb(13 56 99/var(--tw-bg-opacity))
}

.bg-\[\#1e1e1e\] {
    --tw-bg-opacity: 1;
    background-color: rgb(30 30 30/var(--tw-bg-opacity))
}

.bg-\[\#222121\] {
    --tw-bg-opacity: 1;
    background-color: rgb(34 33 33/var(--tw-bg-opacity))
}

.bg-\[\#242424\] {
    --tw-bg-opacity: 1;
    background-color: rgb(36 36 36/var(--tw-bg-opacity))
}

.bg-\[\#2A2931\] {
    --tw-bg-opacity: 1;
    background-color: rgb(42 41 49/var(--tw-bg-opacity))
}

.bg-\[\#313030\] {
    --tw-bg-opacity: 1;
    background-color: rgb(49 48 48/var(--tw-bg-opacity))
}

.bg-\[\#3ECA00\] {
    --tw-bg-opacity: 1;
    background-color: rgb(62 202 0/var(--tw-bg-opacity))
}

.bg-\[\#3c3c3c\] {
    --tw-bg-opacity: 1;
    background-color: rgb(60 60 60/var(--tw-bg-opacity))
}

.bg-\[\#47494B\] {
    --tw-bg-opacity: 1;
    background-color: rgb(71 73 75/var(--tw-bg-opacity))
}

.bg-\[\#48ce6a\] {
    --tw-bg-opacity: 1;
    background-color: rgb(72 206 106/var(--tw-bg-opacity))
}

.bg-\[\#646464\] {
    --tw-bg-opacity: 1;
    background-color: rgb(100 100 100/var(--tw-bg-opacity))
}

.bg-\[\#757575\] {
    --tw-bg-opacity: 1;
    background-color: rgb(117 117 117/var(--tw-bg-opacity))
}

.bg-\[\#AD06091A\] {
    background-color: #ad06091a
}

.bg-\[\#C3C3C3\] {
    --tw-bg-opacity: 1;
    background-color: rgb(195 195 195/var(--tw-bg-opacity))
}

.bg-\[\#D3D3D3\] {
    --tw-bg-opacity: 1;
    background-color: rgb(211 211 211/var(--tw-bg-opacity))
}

.bg-\[\#DBDBDB\] {
    --tw-bg-opacity: 1;
    background-color: rgb(219 219 219/var(--tw-bg-opacity))
}

.bg-\[\#F40B0B\] {
    --tw-bg-opacity: 1;
    background-color: rgb(244 11 11/var(--tw-bg-opacity))
}

.bg-\[\#F4C972\] {
    --tw-bg-opacity: 1;
    background-color: rgb(244 201 114/var(--tw-bg-opacity))
}

.bg-\[\#FAFAFC\] {
    --tw-bg-opacity: 1;
    background-color: rgb(250 250 252/var(--tw-bg-opacity))
}

.bg-\[\#FCCF9B\] {
    --tw-bg-opacity: 1;
    background-color: rgb(252 207 155/var(--tw-bg-opacity))
}

.bg-\[\#FF0B0B\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 11 11/var(--tw-bg-opacity))
}

.bg-\[\#a92e27\] {
    --tw-bg-opacity: 1;
    background-color: rgb(169 46 39/var(--tw-bg-opacity))
}

.bg-\[--content-light\] {
    background-color: var(--content-light)
}

.bg-\[--footer-bottom-color\] {
    background-color: var(--footer-bottom-color)
}

.bg-\[--o-disabled\] {
    background-color: var(--o-disabled)
}

.bg-\[--primary\] {
    background-color: var(--primary)
}

.bg-\[--status-blue\] {
    background-color: var(--status-blue)
}

.bg-\[--status-green\] {
    background-color: var(--status-green)
}

.bg-\[--status-red\] {
    background-color: var(--status-red)
}

.bg-\[--table-odd-bg\] {
    background-color: var(--table-odd-bg)
}

.bg-\[--text-light\] {
    background-color: var(--text-light)
}

.bg-\[rgba\(0\, 0\, 0\, 0\.4\)\] {
    background-color: #0006
}

.bg-\[rgba\(0\, 0\, 0\, 0\.5\)\] {
    background-color: #00000080
}

.bg-\[rgba\(68\, 51\, 19\, 1\)\] {
    background-color: #443313
}

.bg-\[var\(--auth-input-wrapper-bg\)\] {
    background-color: var(--auth-input-wrapper-bg)
}

.bg-\[var\(--body\)\] {
    background-color: var(--body)
}

.bg-\[var\(--content-lighter\)\] {
    background-color: var(--content-lighter)
}

.bg-\[var\(--footer-bottom-color\)\] {
    background-color: var(--footer-bottom-color)
}

.bg-\[var\(--footer-top-color\)\] {
    background-color: var(--footer-top-color)
}

.bg-\[var\(--game-container-bg\)\] {
    background-color: var(--game-container-bg)
}

.bg-\[var\(--game-search-input-color\)\] {
    background-color: var(--game-search-input-color)
}

.bg-\[var\(--game-tab-menu-bg\)\] {
    background-color: var(--game-tab-menu-bg)
}

.bg-\[var\(--header-bg\)\] {
    background-color: var(--header-bg)
}

.bg-\[var\(--line\)\] {
    background-color: var(--line)
}

.bg-\[var\(--marquee-bg\)\] {
    background-color: var(--marquee-bg)
}

.bg-\[var\(--menu-nav-bg\)\] {
    background-color: var(--menu-nav-bg)
}

.bg-\[var\(--ms-diary-bg\)\] {
    background-color: var(--ms-diary-bg)
}

.bg-\[var\(--o-bg\)\] {
    background-color: var(--o-bg)
}

.bg-\[var\(--o-phone-bg\)\] {
    background-color: var(--o-phone-bg)
}

.bg-\[var\(--primary\)\] {
    background-color: var(--primary)
}

.bg-\[var\(--primary-light\)\] {
    background-color: var(--primary-light)
}

.bg-\[var\(--sidebar-btn-arrow-bg\)\] {
    background-color: var(--sidebar-btn-arrow-bg)
}

.bg-\[var\(--sidepanel-btn-bg\)\] {
    background-color: var(--sidepanel-btn-bg)
}

.bg-\[var\(--sidepanel-header-bg\)\] {
    background-color: var(--sidepanel-header-bg)
}

.bg-\[var\(--topbar-menu-bg\)\] {
    background-color: var(--topbar-menu-bg)
}

.bg-black {
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0/var(--tw-bg-opacity))
}

.bg-black\/70 {
    background-color: #000000b3
}

.bg-body {
    background-color: var(--body)
}

.bg-content {
    background-color: var(--content)
}

.bg-content-light {
    background-color: var(--content-light)
}

.bg-content-light-2 {
    background-color: var(--content-light-2)
}

.bg-current {
    background-color: currentColor
}

.bg-gray-200 {
    --tw-bg-opacity: 1;
    background-color: rgb(229 231 235/var(--tw-bg-opacity))
}

.bg-gray-700 {
    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81/var(--tw-bg-opacity))
}

.bg-primary {
    background-color: var(--primary)
}

.bg-primary-light {
    background-color: var(--primary-light)
}

.bg-red-500 {
    --tw-bg-opacity: 1;
    background-color: rgb(239 68 68/var(--tw-bg-opacity))
}

.bg-slate-300 {
    --tw-bg-opacity: 1;
    background-color: rgb(203 213 225/var(--tw-bg-opacity))
}

.bg-text-base {
    background-color: var(--text-base)
}

.bg-transparent {
    background-color: transparent
}

.bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity))
}

.bg-yellow-100 {
    --tw-bg-opacity: 1;
    background-color: rgb(254 249 195/var(--tw-bg-opacity))
}

.bg-opacity-50 {
    --tw-bg-opacity: .5
}

.bg-opacity-60 {
    --tw-bg-opacity: .6
}

.bg-gradient-to-l {
    background-image: linear-gradient(to left, var(--tw-gradient-stops))
}

.bg-gradient-to-r {
    background-image: linear-gradient(to right, var(--tw-gradient-stops))
}

.bg-gradient-to-t {
    background-image: linear-gradient(to top, var(--tw-gradient-stops))
}

.from-black\/80 {
    --tw-gradient-from: rgba(0, 0, 0, .8) var(--tw-gradient-from-position);
    --tw-gradient-to: transparent var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-black\/90 {
    --tw-gradient-from: rgba(0, 0, 0, .9) var(--tw-gradient-from-position);
    --tw-gradient-to: transparent var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.to-transparent {
    --tw-gradient-to: transparent var(--tw-gradient-to-position)
}

.bg-\[length\:100\%_100\%\] {
    background-size: 100% 100%
}

.bg-cover {
    background-size: cover
}

.bg-fixed {
    background-attachment: fixed
}

.bg-clip-text {
    -webkit-background-clip: text;
    background-clip: text
}

.bg-\[80\%_0\] {
    background-position: 80% 0
}

.bg-center {
    background-position: 50%
}

.bg-top {
    background-position: top
}

.bg-no-repeat {
    background-repeat: no-repeat
}

.fill-\[var\(--game-search-icon-color\)\] {
    fill: var(--game-search-icon-color)
}

.fill-gray-400 {
    fill: #9ca3af
}

.fill-white {
    fill: #fff
}

.object-contain {
    -o-object-fit: contain;
    object-fit: contain
}

.object-cover {
    -o-object-fit: cover;
    object-fit: cover
}

.\  !p-0 {
    padding: 0 !important
}

.\  !p-1 {
    padding: .25rem !important
}

.\  !p-2 {
    padding: .5rem !important
}

.\  !p-3 {
    padding: .75rem !important
}

.\  !p-4 {
    padding: 1rem !important
}

.\  !p-\[0\.4rem\] {
    padding: .4rem !important
}

.\  !p-\[8px\] {
    padding: 8px !important
}

.p-0 {
    padding: 0
}

.p-1 {
    padding: .25rem
}

.p-1\.5 {
    padding: .375rem
}

.p-2 {
    padding: .5rem
}

.p-2\.5 {
    padding: .625rem
}

.p-3 {
    padding: .75rem
}

.p-4 {
    padding: 1rem
}

.p-5 {
    padding: 1.25rem
}

.p-6 {
    padding: 1.5rem
}

.p-8 {
    padding: 2rem
}

.p-\[0\.4rem\] {
    padding: .4rem
}

.p-\[10px\] {
    padding: 10px
}

.p-\[12px\] {
    padding: 12px
}

.p-\[15px\] {
    padding: 15px
}

.p-\[1rem\] {
    padding: 1rem
}

.p-\[20px\] {
    padding: 20px
}

.p-\[5px\] {
    padding: 5px
}

.p-\[6px\] {
    padding: 6px
}

.p-\[9px\] {
    padding: 9px
}

.\  !px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important
}

.\  !px-1 {
    padding-left: .25rem !important;
    padding-right: .25rem !important
}

.\  !px-2 {
    padding-left: .5rem !important;
    padding-right: .5rem !important
}

.\  !px-3 {
    padding-left: .75rem !important;
    padding-right: .75rem !important
}

.\  !px-4 {
    padding-left: 1rem !important;
    padding-right: 1rem !important
}

.\  !px-5 {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important
}

.\  !px-6 {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important
}

.\  !px-\[2px\] {
    padding-left: 2px !important;
    padding-right: 2px !important
}

.\  !py-0 {
    padding-bottom: 0 !important;
    padding-top: 0 !important
}

.\  !py-1 {
    padding-bottom: .25rem !important;
    padding-top: .25rem !important
}

.\  !py-2 {
    padding-bottom: .5rem !important;
    padding-top: .5rem !important
}

.\  !py-2\.5 {
    padding-bottom: .625rem !important;
    padding-top: .625rem !important
}

.\  !py-3 {
    padding-bottom: .75rem !important;
    padding-top: .75rem !important
}

.\  !py-4 {
    padding-bottom: 1rem !important;
    padding-top: 1rem !important
}

.\  !py-5 {
    padding-bottom: 1.25rem !important;
    padding-top: 1.25rem !important
}

.\  !py-8 {
    padding-bottom: 2rem !important;
    padding-top: 2rem !important
}

.\  !py-\[10px\] {
    padding-bottom: 10px !important;
    padding-top: 10px !important
}

.\  !py-\[6px\] {
    padding-bottom: 6px !important;
    padding-top: 6px !important
}

.px-0 {
    padding-left: 0;
    padding-right: 0
}

.px-0\.5 {
    padding-left: .125rem;
    padding-right: .125rem
}

.px-1 {
    padding-left: .25rem;
    padding-right: .25rem
}

.px-1\.5 {
    padding-left: .375rem;
    padding-right: .375rem
}

.px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem
}

.px-12 {
    padding-left: 3rem;
    padding-right: 3rem
}

.px-16 {
    padding-left: 4rem;
    padding-right: 4rem
}

.px-2 {
    padding-left: .5rem;
    padding-right: .5rem
}

.px-2\.5 {
    padding-left: .625rem;
    padding-right: .625rem
}

.px-28 {
    padding-left: 7rem;
    padding-right: 7rem
}

.px-3 {
    padding-left: .75rem;
    padding-right: .75rem
}

.px-3\.5 {
    padding-left: .875rem;
    padding-right: .875rem
}

.px-4 {
    padding-left: 1rem;
    padding-right: 1rem
}

.px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem
}

.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem
}

.px-7 {
    padding-left: 1.75rem;
    padding-right: 1.75rem
}

.px-8 {
    padding-left: 2rem;
    padding-right: 2rem
}

.px-\[10px\] {
    padding-left: 10px;
    padding-right: 10px
}

.px-\[12px\] {
    padding-left: 12px;
    padding-right: 12px
}

.px-\[14px\] {
    padding-left: 14px;
    padding-right: 14px
}

.px-\[15px\] {
    padding-left: 15px;
    padding-right: 15px
}

.px-\[1rem\] {
    padding-left: 1rem;
    padding-right: 1rem
}

.px-\[20px\] {
    padding-left: 20px;
    padding-right: 20px
}

.px-\[26px\] {
    padding-left: 26px;
    padding-right: 26px
}

.px-\[3px\] {
    padding-left: 3px;
    padding-right: 3px
}

.px-\[4px\] {
    padding-left: 4px;
    padding-right: 4px
}

.px-\[5px\] {
    padding-left: 5px;
    padding-right: 5px
}

.px-\[60px\] {
    padding-left: 60px;
    padding-right: 60px
}

.px-\[8px\] {
    padding-left: 8px;
    padding-right: 8px
}

.py-0 {
    padding-bottom: 0;
    padding-top: 0
}

.py-0\.5 {
    padding-bottom: .125rem;
    padding-top: .125rem
}

.py-1 {
    padding-bottom: .25rem;
    padding-top: .25rem
}

.py-1\.5 {
    padding-bottom: .375rem;
    padding-top: .375rem
}

.py-10 {
    padding-bottom: 2.5rem;
    padding-top: 2.5rem
}

.py-2 {
    padding-bottom: .5rem;
    padding-top: .5rem
}

.py-2\.5 {
    padding-bottom: .625rem;
    padding-top: .625rem
}

.py-3 {
    padding-bottom: .75rem;
    padding-top: .75rem
}

.py-3\.5 {
    padding-bottom: .875rem;
    padding-top: .875rem
}

.py-4 {
    padding-bottom: 1rem;
    padding-top: 1rem
}

.py-5 {
    padding-bottom: 1.25rem;
    padding-top: 1.25rem
}

.py-6 {
    padding-bottom: 1.5rem;
    padding-top: 1.5rem
}

.py-7 {
    padding-bottom: 1.75rem;
    padding-top: 1.75rem
}

.py-8 {
    padding-bottom: 2rem;
    padding-top: 2rem
}

.py-\[1\.2rem\] {
    padding-bottom: 1.2rem;
    padding-top: 1.2rem
}

.py-\[10px\] {
    padding-bottom: 10px;
    padding-top: 10px
}

.py-\[13px\] {
    padding-bottom: 13px;
    padding-top: 13px
}

.py-\[14px\] {
    padding-bottom: 14px;
    padding-top: 14px
}

.py-\[15px\] {
    padding-bottom: 15px;
    padding-top: 15px
}

.py-\[1px\] {
    padding-bottom: 1px;
    padding-top: 1px
}

.py-\[20px\] {
    padding-bottom: 20px;
    padding-top: 20px
}

.py-\[22px\] {
    padding-bottom: 22px;
    padding-top: 22px
}

.py-\[25px\] {
    padding-bottom: 25px;
    padding-top: 25px
}

.py-\[2px\] {
    padding-bottom: 2px;
    padding-top: 2px
}

.py-\[30px\] {
    padding-bottom: 30px;
    padding-top: 30px
}

.py-\[3px\] {
    padding-bottom: 3px;
    padding-top: 3px
}

.py-\[5\.75rem\] {
    padding-bottom: 5.75rem;
    padding-top: 5.75rem
}

.py-\[50px\] {
    padding-bottom: 50px;
    padding-top: 50px
}

.py-\[5px\] {
    padding-bottom: 5px;
    padding-top: 5px
}

.py-\[5rem\] {
    padding-bottom: 5rem;
    padding-top: 5rem
}

.py-\[8px\] {
    padding-bottom: 8px;
    padding-top: 8px
}

.\  !pb-0 {
    padding-bottom: 0 !important
}

.\  !pl-10 {
    padding-left: 2.5rem !important
}

.\  !pl-12 {
    padding-left: 3rem !important
}

.\  !pl-14 {
    padding-left: 3.5rem !important
}

.\  !pl-16 {
    padding-left: 4rem !important
}

.\  !pl-2 {
    padding-left: .5rem !important
}

.\  !pl-3 {
    padding-left: .75rem !important
}

.\  !pl-4 {
    padding-left: 1rem !important
}

.\  !pl-\[45px\] {
    padding-left: 45px !important
}

.\  !pl-\[50px\] {
    padding-left: 50px !important
}

.\  !pr-0 {
    padding-right: 0 !important
}

.\  !pr-12 {
    padding-right: 3rem !important
}

.\  !pr-2 {
    padding-right: .5rem !important
}

.\  !pr-3 {
    padding-right: .75rem !important
}

.\  !pr-4 {
    padding-right: 1rem !important
}

.\  !pr-\[120px\] {
    padding-right: 120px !important
}

.\  !pr-\[30px\] {
    padding-right: 30px !important
}

.\  !pt-0 {
    padding-top: 0 !important
}

.\  !pt-1 {
    padding-top: .25rem !important
}

.\  !pt-\[70px\] {
    padding-top: 70px !important
}

.pb-0 {
    padding-bottom: 0
}

.pb-0\.5 {
    padding-bottom: .125rem
}

.pb-1 {
    padding-bottom: .25rem
}

.pb-1\.5 {
    padding-bottom: .375rem
}

.pb-10 {
    padding-bottom: 2.5rem
}

.pb-2 {
    padding-bottom: .5rem
}

.pb-2\.5 {
    padding-bottom: .625rem
}

.pb-3 {
    padding-bottom: .75rem
}

.pb-4 {
    padding-bottom: 1rem
}

.pb-5 {
    padding-bottom: 1.25rem
}

.pb-6 {
    padding-bottom: 1.5rem
}

.pb-60 {
    padding-bottom: 15rem
}

.pb-7 {
    padding-bottom: 1.75rem
}

.pb-8 {
    padding-bottom: 2rem
}

.pb-\[10px\] {
    padding-bottom: 10px
}

.pb-\[18px\] {
    padding-bottom: 18px
}

.pb-\[50px\] {
    padding-bottom: 50px
}

.pb-\[95px\] {
    padding-bottom: 95px
}

.pe-0 {
    padding-inline-end: 0
}

.pe-0\.5 {
    padding-inline-end: .125rem
}

.pl-0 {
    padding-left: 0
}

.pl-0\.5 {
    padding-left: .125rem
}

.pl-1 {
    padding-left: .25rem
}

.pl-11 {
    padding-left: 2.75rem
}

.pl-12 {
    padding-left: 3rem
}

.pl-2 {
    padding-left: .5rem
}

.pl-3 {
    padding-left: .75rem
}

.pl-4 {
    padding-left: 1rem
}

.pl-5 {
    padding-left: 1.25rem
}

.pl-6 {
    padding-left: 1.5rem
}

.pl-\[0\.85em\] {
    padding-left: .85em
}

.pl-\[25px\] {
    padding-left: 25px
}

.pl-\[40px\] {
    padding-left: 40px
}

.pl-\[6px\] {
    padding-left: 6px
}

.pr-0 {
    padding-right: 0
}

.pr-1 {
    padding-right: .25rem
}

.pr-10 {
    padding-right: 2.5rem
}

.pr-2 {
    padding-right: .5rem
}

.pr-3 {
    padding-right: .75rem
}

.pr-4 {
    padding-right: 1rem
}

.pr-5 {
    padding-right: 1.25rem
}

.pr-6 {
    padding-right: 1.5rem
}

.pr-\[10px\] {
    padding-right: 10px
}

.pr-\[15px\] {
    padding-right: 15px
}

.ps-2 {
    padding-inline-start: .5rem
}

.ps-4 {
    padding-inline-start: 1rem
}

.pt-0 {
    padding-top: 0
}

.pt-0\.5 {
    padding-top: .125rem
}

.pt-1 {
    padding-top: .25rem
}

.pt-10 {
    padding-top: 2.5rem
}

.pt-12 {
    padding-top: 3rem
}

.pt-16 {
    padding-top: 4rem
}

.pt-2 {
    padding-top: .5rem
}

.pt-3 {
    padding-top: .75rem
}

.pt-4 {
    padding-top: 1rem
}

.pt-5 {
    padding-top: 1.25rem
}

.pt-6 {
    padding-top: 1.5rem
}

.pt-7 {
    padding-top: 1.75rem
}

.pt-8 {
    padding-top: 2rem
}

.pt-\[100\%\] {
    padding-top: 100%
}

.pt-\[10px\] {
    padding-top: 10px
}

.pt-\[20\%\] {
    padding-top: 20%
}

.pt-\[20px\] {
    padding-top: 20px
}

.pt-\[30px\] {
    padding-top: 30px
}

.pt-\[50px\] {
    padding-top: 50px
}

.pt-\[60px\] {
    padding-top: 60px
}

.pt-\[80px\] {
    padding-top: 80px
}

.\  !text-left {
    text-align: left !important
}

.text-left {
    text-align: left
}

.\  !text-center {
    text-align: center !important
}

.text-center {
    text-align: center
}

.\  !text-right {
    text-align: right !important
}

.text-right {
    text-align: right
}

.text-start {
    text-align: start
}

.text-end {
    text-align: end
}

.align-middle {
    vertical-align: middle
}

.\  !text-\[10px\] {
    font-size: 10px !important
}

.\  !text-\[11px\] {
    font-size: 11px !important
}

.\  !text-\[12px\] {
    font-size: 12px !important
}

.\  !text-\[14px\] {
    font-size: 14px !important
}

.\  !text-lg {
    font-size: 1.125rem !important;
    line-height: 1.75rem !important
}

.\  !text-sm {
    font-size: .875rem !important;
    line-height: 1.25rem !important
}

.\  !text-xl {
    font-size: 1.25rem !important;
    line-height: 1.75rem !important
}

.\  !text-xs {
    font-size: .75rem !important;
    line-height: 1rem !important
}

.text-2xl {
    font-size: 1.5rem;
    line-height: 2rem
}

.text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem
}

.text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem
}

.text-6xl {
    font-size: 3.75rem;
    line-height: 1
}

.text-\[0\.75rem\] {
    font-size: .75rem
}

.text-\[1\.3rem\] {
    font-size: 1.3rem
}

.text-\[10px\] {
    font-size: 10px
}

.text-\[110px\] {
    font-size: 110px
}

.text-\[11px\] {
    font-size: 11px
}

.text-\[12\.5px\] {
    font-size: 12.5px
}

.text-\[12px\] {
    font-size: 12px
}

.text-\[13px\] {
    font-size: 13px
}

.text-\[14px\] {
    font-size: 14px
}

.text-\[15px\] {
    font-size: 15px
}

.text-\[16px\] {
    font-size: 16px
}

.text-\[17px\] {
    font-size: 17px
}

.text-\[18px\] {
    font-size: 18px
}

.text-\[19px\] {
    font-size: 19px
}

.text-\[2\.75vw\] {
    font-size: 2.75vw
}

.text-\[20px\] {
    font-size: 20px
}

.text-\[21px\] {
    font-size: 21px
}

.text-\[22px\] {
    font-size: 22px
}

.text-\[24px\] {
    font-size: 24px
}

.text-\[25px\] {
    font-size: 25px
}

.text-\[28px\] {
    font-size: 28px
}

.text-\[29px\] {
    font-size: 29px
}

.text-\[2rem\] {
    font-size: 2rem
}

.text-\[3\.2vw\] {
    font-size: 3.2vw
}

.text-\[3\.5vw\] {
    font-size: 3.5vw
}

.text-\[32px\] {
    font-size: 32px
}

.text-\[3vw\] {
    font-size: 3vw
}

.text-\[40px\] {
    font-size: 40px
}

.text-\[4vw\] {
    font-size: 4vw
}

.text-\[5vw\] {
    font-size: 5vw
}

.text-\[60px\] {
    font-size: 60px
}

.text-\[75px\] {
    font-size: 75px
}

.text-\[7px\] {
    font-size: 7px
}

.text-\[8px\] {
    font-size: 8px
}

.text-\[9px\] {
    font-size: 9px
}

.text-base {
    font-size: 1rem;
    line-height: 1.5rem
}

.text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem
}

.text-sm {
    font-size: .875rem;
    line-height: 1.25rem
}

.text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem
}

.text-xs {
    font-size: .75rem;
    line-height: 1rem
}

.\  !font-bold {
    font-weight: 700 !important
}

.\  !font-normal {
    font-weight: 400 !important
}

.\  !font-semibold {
    font-weight: 600 !important
}

.font-\[700\] {
    font-weight: 700
}

.font-\[900\],
.font-black {
    font-weight: 900
}

.font-bold {
    font-weight: 700
}

.font-extrabold {
    font-weight: 800
}

.font-light {
    font-weight: 300
}

.font-medium {
    font-weight: 500
}

.font-normal {
    font-weight: 400
}

.font-semibold {
    font-weight: 600
}

.uppercase {
    text-transform: uppercase
}

.lowercase {
    text-transform: lowercase
}

.\  !capitalize {
    text-transform: capitalize !important
}

.capitalize {
    text-transform: capitalize
}

.italic {
    font-style: italic
}

.\  !leading-6 {
    line-height: 1.5rem !important
}

.leading-3 {
    line-height: .75rem
}

.leading-4 {
    line-height: 1rem
}

.leading-5 {
    line-height: 1.25rem
}

.leading-6 {
    line-height: 1.5rem
}

.leading-7 {
    line-height: 1.75rem
}

.leading-8 {
    line-height: 2rem
}

.leading-\[10px\] {
    line-height: 10px
}

.leading-\[14px\] {
    line-height: 14px
}

.leading-\[16px\] {
    line-height: 16px
}

.leading-\[18px\] {
    line-height: 18px
}

.leading-\[2\.75vw\] {
    line-height: 2.75vw
}

.leading-\[23px\] {
    line-height: 23px
}

.leading-\[24px\] {
    line-height: 24px
}

.leading-\[3\.2vw\] {
    line-height: 3.2vw
}

.leading-\[3vw\] {
    line-height: 3vw
}

.leading-\[40px\] {
    line-height: 40px
}

.leading-\[unset\] {
    line-height: unset
}

.leading-none {
    line-height: 1
}

.leading-tight {
    line-height: 1.25
}

.tracking-normal {
    letter-spacing: 0
}

.\  !text-\[\#FAF7F7\] {
    --tw-text-opacity: 1 !important;
    color: rgb(250 247 247/var(--tw-text-opacity)) !important
}

.\  !text-primary {
    color: var(--primary) !important
}

.\  !text-text-base {
    color: var(--text-base) !important
}

.\  !text-white {
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255/var(--tw-text-opacity)) !important
}

.text-\[\#000\] {
    --tw-text-opacity: 1;
    color: rgb(0 0 0/var(--tw-text-opacity))
}

.text-\[\#0093FF\] {
    --tw-text-opacity: 1;
    color: rgb(0 147 255/var(--tw-text-opacity))
}

.text-\[\#0BB212\] {
    --tw-text-opacity: 1;
    color: rgb(11 178 18/var(--tw-text-opacity))
}

.text-\[\#46AD4D\] {
    --tw-text-opacity: 1;
    color: rgb(70 173 77/var(--tw-text-opacity))
}

.text-\[\#50A69A\] {
    --tw-text-opacity: 1;
    color: rgb(80 166 154/var(--tw-text-opacity))
}

.text-\[\#6C6C6C\] {
    --tw-text-opacity: 1;
    color: rgb(108 108 108/var(--tw-text-opacity))
}

.text-\[\#919191\] {
    --tw-text-opacity: 1;
    color: rgb(145 145 145/var(--tw-text-opacity))
}

.text-\[\#C7B587\] {
    --tw-text-opacity: 1;
    color: rgb(199 181 135/var(--tw-text-opacity))
}

.text-\[\#D81A1E\] {
    --tw-text-opacity: 1;
    color: rgb(216 26 30/var(--tw-text-opacity))
}

.text-\[\#FAF7F7\] {
    --tw-text-opacity: 1;
    color: rgb(250 247 247/var(--tw-text-opacity))
}

.text-\[\#FC2270\] {
    --tw-text-opacity: 1;
    color: rgb(252 34 112/var(--tw-text-opacity))
}

.text-\[\#FEBC65\] {
    --tw-text-opacity: 1;
    color: rgb(254 188 101/var(--tw-text-opacity))
}

.text-\[\#FF0B0B\] {
    --tw-text-opacity: 1;
    color: rgb(255 11 11/var(--tw-text-opacity))
}

.text-\[\#FFA700\] {
    --tw-text-opacity: 1;
    color: rgb(255 167 0/var(--tw-text-opacity))
}

.text-\[\#FFE200\] {
    --tw-text-opacity: 1;
    color: rgb(255 226 0/var(--tw-text-opacity))
}

.text-\[\#cd746a\] {
    --tw-text-opacity: 1;
    color: rgb(205 116 106/var(--tw-text-opacity))
}

.text-\[\#fff\] {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity))
}

.text-\[--danger\] {
    color: var(--danger)
}

.text-\[--progress-text-color\] {
    color: var(--progress-text-color)
}

.text-\[--status-blue\] {
    color: var(--status-blue)
}

.text-\[--status-green\] {
    color: var(--status-green)
}

.text-\[--status-red\] {
    color: var(--status-red)
}

.text-\[var\(--header-text-color\)\] {
    color: var(--header-text-color)
}

.text-\[var\(--line\)\] {
    color: var(--line)
}

.text-\[var\(--primary\)\] {
    color: var(--primary)
}

.text-\[var\(--secondary\)\] {
    color: var(--secondary)
}

.text-\[var\(--text-light\)\] {
    color: var(--text-light)
}

.text-\[var\(--vip-reward-desc\)\] {
    color: var(--vip-reward-desc)
}

.text-\[var\(--vip-reward-title\)\] {
    color: var(--vip-reward-title)
}

.text-black {
    --tw-text-opacity: 1;
    color: rgb(0 0 0/var(--tw-text-opacity))
}

.text-blue-600 {
    --tw-text-opacity: 1;
    color: rgb(37 99 235/var(--tw-text-opacity))
}

.text-content {
    color: var(--content)
}

.text-gray-300 {
    --tw-text-opacity: 1;
    color: rgb(209 213 219/var(--tw-text-opacity))
}

.text-gray-400 {
    --tw-text-opacity: 1;
    color: rgb(156 163 175/var(--tw-text-opacity))
}

.text-gray-500 {
    --tw-text-opacity: 1;
    color: rgb(107 114 128/var(--tw-text-opacity))
}

.text-green-500 {
    --tw-text-opacity: 1;
    color: rgb(34 197 94/var(--tw-text-opacity))
}

.text-green-600 {
    --tw-text-opacity: 1;
    color: rgb(22 163 74/var(--tw-text-opacity))
}

.text-primary {
    color: var(--primary)
}

.text-red-500 {
    --tw-text-opacity: 1;
    color: rgb(239 68 68/var(--tw-text-opacity))
}

.text-red-600 {
    --tw-text-opacity: 1;
    color: rgb(220 38 38/var(--tw-text-opacity))
}

.text-secondary {
    color: var(--secondary)
}

.text-text-base {
    color: var(--text-base)
}

.text-text-light {
    color: var(--text-light)
}

.text-transparent {
    color: transparent
}

.text-white {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity))
}

.text-yellow-400 {
    --tw-text-opacity: 1;
    color: rgb(250 204 21/var(--tw-text-opacity))
}

.text-yellow-500 {
    --tw-text-opacity: 1;
    color: rgb(234 179 8/var(--tw-text-opacity))
}

.text-yellow-800 {
    --tw-text-opacity: 1;
    color: rgb(133 77 14/var(--tw-text-opacity))
}

.\  !underline {
    text-decoration-line: underline !important
}

.underline {
    text-decoration-line: underline
}

.decoration-solid {
    text-decoration-style: solid
}

.\  !opacity-100 {
    opacity: 1 !important
}

.opacity-0 {
    opacity: 0
}

.opacity-10 {
    opacity: .1
}

.opacity-100 {
    opacity: 1
}

.opacity-40 {
    opacity: .4
}

.opacity-50 {
    opacity: .5
}

.opacity-60 {
    opacity: .6
}

.opacity-70 {
    opacity: .7
}

.opacity-80 {
    opacity: .8
}

.\  !shadow-none {
    --tw-shadow: 0 0 #0000 !important;
    --tw-shadow-colored: 0 0 #0000 !important;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.shadow {
    --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color)
}

.shadow,
.shadow-\[0px_0px_20px_2px_\#00000024\] {
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.shadow-\[0px_0px_20px_2px_\#00000024\] {
    --tw-shadow: 0px 0px 20px 2px #00000024;
    --tw-shadow-colored: 0px 0px 20px 2px var(--tw-shadow-color)
}

.shadow-lg {
    --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color)
}

.shadow-lg,
.shadow-md {
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.shadow-md {
    --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color)
}

.shadow-none {
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000
}

.shadow-none,
.shadow-sm {
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.shadow-sm {
    --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color)
}

.shadow-xl {
    --tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.\  !outline-none {
    outline: 2px solid transparent !important;
    outline-offset: 2px !important
}

.outline-none {
    outline: 2px solid transparent;
    outline-offset: 2px
}

.outline {
    outline-style: solid
}

.outline-black {
    outline-color: #000
}

.outline-primary {
    outline-color: var(--primary)
}

.blur {
    --tw-blur: blur(8px)
}

.blur,
.drop-shadow {
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.drop-shadow {
    --tw-drop-shadow: drop-shadow(0 1px 2px rgba(0, 0, 0, .1)) drop-shadow(0 1px 1px rgba(0, 0, 0, .06))
}

.grayscale {
    --tw-grayscale: grayscale(100%)
}

.grayscale,
.invert {
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.invert {
    --tw-invert: invert(100%)
}

.filter {
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

.backdrop-filter {
    -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)
}

.\  !transition-none {
    transition-property: none !important
}

.transition {
    transition-duration: .15s;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

.transition-\[background-color\] {
    transition-duration: .15s;
    transition-property: background-color;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

.transition-\[max-height\] {
    transition-duration: .15s;
    transition-property: max-height;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

.transition-all {
    transition-duration: .15s;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

.transition-opacity {
    transition-duration: .15s;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

.transition-transform {
    transition-duration: .15s;
    transition-property: transform;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

.\  !duration-300 {
    transition-duration: .3s !important
}

.duration-200 {
    transition-duration: .2s
}

.duration-300 {
    transition-duration: .3s
}

.duration-500 {
    transition-duration: .5s
}

.duration-700 {
    transition-duration: .7s
}

.ease-in-out {
    transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}

.ease-out {
    transition-timing-function: cubic-bezier(0, 0, .2, 1)
}

.will-change-transform {
    will-change: transform
}

.\[background\:var\(--marquee-bg\)\] {
    background: var(--marquee-bg)
}

.\[box-shadow\:none\  !important\] {
    box-shadow: none !important
}

.\[socket-worker\:event\] {
    socket-worker: event
}

.\[socketWorker\:fallback\] {
    socket-worker: fallback
}

.\[socketWorker\:on\] {
    socket-worker: on
}

@font-face {
    font-display: swap;
    font-family: NotoSansThai;
    font-weight: 300;
    src: url(../fonts/NotoSansThai/NotoSansThai-Light.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: NotoSansThai;
    font-weight: 400;
    src: url(../fonts/NotoSansThai/NotoSansThai-Regular.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: NotoSansThai;
    font-weight: 500;
    src: url(../fonts/NotoSansThai/NotoSansThai-Medium.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: NotoSansThai;
    font-weight: 600;
    src: url(../fonts/NotoSansThai/NotoSansThai-SemiBold.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: NotoSansThai;
    font-weight: 700;
    src: url(../fonts/NotoSansThai/NotoSansThai-Bold.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: NotoSansThai;
    font-weight: 900;
    src: url(../fonts/NotoSansThai/NotoSansThai-Black.woff2) format("woff2")
}

._df_ErrMsg {
    --tw-text-opacity: 1;
    color: rgb(239 68 68/var(--tw-text-opacity));
    font-size: .875rem;
    line-height: 1.25rem
}

* {
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

*,
body {
    -webkit-touch-callout: none
}

a,
img {
    -webkit-user-drag: none;
    user-drag: none
}

input,
select,
textarea {
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text
}

body,
html {
    overscroll-behavior-y: none
}

html {
    scroll-behavior: smooth
}

body {
    background-color: var(--body);
    color: var(--text-base);
    font-family: NotoSansThai;
    font-weight: 400;
    margin: 0
}

@supports (font:-apple-system-body) and (-webkit-appearance:none) {
    img[loading=lazy] {
        clip-path: inset(.6px)
    }
}

body.no-scroll {
    height: 100%;
    position: relative;
    touch-action: none;
    -ms-touch-action: none
}

body.isPromotions.mobile,
body.no-scroll {
    overflow: hidden !important
}

hr {
    border-top: 1px solid var(--line)
}

.bg-main {
    background: var(--secondary) !important
}

.bg-img {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover
}

.skeleton {
    animation-duration: 2.5s;
    animation-iteration-count: infinite;
    animation-name: wave;
    animation-timing-function: ease-in-out;
    background-color: #e0e1e10d;
    background-image: -webkit-linear-gradient(left, hsla(180, 2%, 88%, .1), hsla(180, 2%, 88%, .1) 5%, hsla(0, 11%, 98%, .25) 25%, hsla(180, 2%, 88%, .45) 50%, hsla(0, 11%, 98%, .25) 75%, hsla(180, 2%, 88%, .1) 95%, hsla(180, 2%, 88%, .1));
    background-size: 200% 100%
}

.vbg,
.vtitle {
    color: var(--text-base)
}

.vbg {
    background: var(--content-light)
}

.vtext {
    color: #a1a1a9
}

.border-vip {
    animation: shadow 3s linear infinite;
    background: var(--bg-main);
    border: 2px solid var(--primary)
}

.bg-vip-bonus {
    background: var(--content-light);
    border: 1px solid var(--line)
}

@keyframes shadow {
    0% {
        box-shadow: 0 1px #173998
    }

    50% {
        box-shadow: 0 1px 20px #173998
    }
}

@keyframes wave {
    0% {
        background-position: 150% 0
    }

    to {
        background-position: -50% 0
    }
}

.user-table {
    width: 100%
}

.user-table thead {
    background: var(--content-light)
}

.user-table th {
    font-size: .75rem;
    font-weight: 700;
    padding: .875rem;
    white-space: nowrap
}

.user-table th:first-child {
    border-top-left-radius: 6px
}

.user-table th:last-child {
    border-top-right-radius: 6px
}

.user-table tbody tr:nth-child(odd) {
    background-color: var(--table-odd-bg)
}

.user-table tbody tr:nth-child(2n) {
    background-color: var(--table-even-bg)
}

.user-table td {
    font-size: .75rem;
    padding: .875rem
}

.user-table tfoot tr td {
    padding: 0;
    white-space: nowrap
}

.user-table tfoot tr td>div {
    font-weight: 700;
    margin-top: 10px;
    padding: .75rem
}

.user-table tfoot tr:first-child td>div {
    background-color: var(--content-light) !important
}

.user-table tfoot tr:nth-child(2) td>div {
    background-color: var(--content-light)
}

@media screen and (min-width:768px) {

    .user-table td,
    .user-table th {
        font-size: .875rem;
        padding: .75rem
    }
}

.none-scrollbar::-webkit-scrollbar,
.none-scrollbar::-webkit-scrollbar-thumb {
    display: none
}

.light-scrollbar::-webkit-scrollbar-thumb {
    background-color: #c8c8c8;
    width: 8px
}

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

.light-scrollbar-h::-webkit-scrollbar-thumb {
    background-color: #c8c8c8;
    height: 3px
}

.light-scrollbar-h::-webkit-scrollbar {
    background-color: transparent;
    height: 3px
}

.red.light-scrollbar::-webkit-scrollbar-thumb {
    background-color: #750f0f;
    width: 8px
}

.red.light-scrollbar-h::-webkit-scrollbar-thumb {
    background-color: #750f0f;
    height: 3px
}

.purple.light-scrollbar::-webkit-scrollbar-thumb {
    background-color: #c244ff;
    width: 8px
}

.purple.light-scrollbar-h::-webkit-scrollbar-thumb {
    background-color: #c244ff;
    height: 3px
}

.hidden-scrollbar::-webkit-scrollbar,
.hidden-scrollbar::-webkit-scrollbar-thumb {
    background-color: transparent;
    display: none;
    height: 1px;
    width: 1px
}

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

.container {
    margin: 0 auto;
    max-width: 1920px;
    padding: 0 50px;
    width: 100%
}

.search_box {
    align-items: center;
    display: flex;
    position: relative
}

.search_input,
.search_input:focus,
.search_input:focus-visible {
    background-color: #d6d6d6;
    border-bottom-left-radius: 50px;
    border-top-left-radius: 50px;
    box-shadow: var(--o-shadow-focus);
    color: #757575;
    font-size: 16px;
    font-weight: 400;
    height: 40px;
    outline: 0;
    padding-left: 50px;
    padding-right: 30px;
    width: 200px
}

.search_icon {
    left: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 15px
}

.tab_btn_bg {
    align-items: center;
    background: none;
    border-color: #52525b;
    border-radius: 100%;
    border-width: 1px;
    display: flex;
    height: 50px;
    justify-content: center;
    margin: 0 auto;
    transition: all .3s;
    width: 50px
}

.active .tab_btn_bg {
    background: #132358;
    border-color: #69a3fb
}

.tab_btn_text {
    color: #a1a1a9
}

.game_btn {
    border-radius: 30px;
    margin: 5px;
    overflow: hidden;
    position: relative;
    transform: translateZ(0);
    width: calc(12.5% - 20px)
}

.game_btn .game_btn_aspect_ratio {
    padding-top: 100%;
    width: 100%
}

.game_placeholder {
    height: 100%;
    left: 0;
    padding-top: 100%;
    position: absolute;
    top: 0;
    width: 100%
}

.fish_game_btn.placeholder:before,
.game_btn.placeholder:before,
.game_placeholder:before,
.mobile_game.placeholder:before,
.promotions_img_box.placeholder:before,
.slider_placeholder:before,
.sport_btn.placeholder:before,
.tab_game.placeholder:before {
    background-blend-mode: darken;
    background-image: url(/logo-dark.png?v=5);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 65%;
    content: "";
    filter: grayscale(1);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.home .game_btn {
    margin: 10px
}

.game_btn_content {
    background: #000;
    background: linear-gradient(0deg, rgba(0, 0, 0, .6), transparent);
    height: calc(100% + 10px);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s;
    width: calc(100% + 10px)
}

.game_container {
    margin-left: -10px;
    margin-right: -10px;
    position: relative
}

.game_container .game_btn_content {
    background: #000;
    background: linear-gradient(0deg, rgba(0, 0, 0, .6), transparent)
}

.isDesktop .game_container .game_btn:hover .game_btn_content {
    background: rgba(0, 0, 0, .65);
    background: linear-gradient(0deg, rgba(0, 0, 0, .65), rgba(0, 0, 0, .65))
}

.isDesktop .home.game_container .game_btn:hover .game_btn_content {
    background: unset
}

.change-pin>.btn-password-change {
    background: var(--secondary)
}

.game_btn_content_text {
    font-size: 12px;
    left: 20px;
    width: calc(100% - 60px)
}

.game_btn_content_favourite,
.game_btn_content_text {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    bottom: 15px;
    color: #fff;
    display: -webkit-box;
    font-weight: 400;
    overflow: hidden;
    position: absolute;
    text-align: left
}

.game_btn_content_favourite {
    align-items: center;
    display: flex;
    right: 15px
}

.favourite-icon {
    padding-left: 1px;
    position: relative;
    z-index: 1
}

.icon-favourite.inactive:before {
    color: #fafafa;
    opacity: .6
}

.game_btn_content svg {
    bottom: 15px;
    position: absolute;
    right: 20px;
    width: 15px
}

.game_btn_content svg path {
    fill: #939393
}

.game_btn_content.favourite svg path {
    fill: red
}

.game_hot_icon {
    position: absolute;
    right: 10px;
    top: 0;
    width: 20px
}

.game_container {
    align-items: center;
    align-items: stretch;
    display: flex;
    flex-wrap: wrap;
    margin-top: 50px
}

.game_container_main {
    align-items: center;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    margin: 5px;
    overflow: hidden;
    position: relative;
    width: calc(28.7% - 10px)
}

.game_container_main .aspect_ratio_box {
    padding-top: 100%;
    width: 100%
}

.game_container_main_bg {
    border-radius: 10px;
    filter: blur(10px);
    height: 100%;
    left: 50%;
    overflow: hidden;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.game_container_top {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    width: 71.3%
}

.game_container_top .game_btn {
    width: calc(20% - 10px)
}

.game_container_bottom {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    width: 100%
}

.game_container_bottom .game_btn {
    width: calc(14.28% - 10px)
}

.marquee_bg_color {
    background: var(--marquee-bg)
}

.marquee_icon {
    margin-right: 10px;
    width: 30px
}

.marquee_box {
    width: calc(100% - 40px)
}

.marquee_golden_bg {
    background-color: #4a0811;

    /* 2. 벨벳의 부드러운 빛 반사 효과 (중앙이 은은하게 밝음) */
    background-image: radial-gradient(circle at 50% 30%, #8a1c2c 0%, #5c0e18 50%, #3d060d 100%);

    /* 3. 벨벳 특유의 푹신하고 부드러운 테두리 느낌 (내부 그림자 활용) */
    box-shadow:
        inset 0 1px 3px rgba(255, 100, 100, 0.2),
        /* 상단 가장자리 살짝 밝게 */
        inset 0 0 15px rgba(0, 0, 0, 0.6),
        /* 전체적으로 안쪽을 어둡게 눌러줌 (깊이감) */
        0 5px 10px rgba(0, 0, 0, 0.4);
    /* 버튼 바깥 그림자로 입체감 완성 */

    /* 테두리는 배경과 비슷한 아주 어두운 붉은색으로 은은하게 처리 */
    border: 1px solid #2b0408;
    border: 1px solid #e6c57a;
    box-shadow:
        0 0 0 2px #3a2a11,
        /* 가장 바깥쪽 얇은 어두운 선 */
        inset 0 0 2px 1px #fff3b3,
        /* 테두리 안쪽 빛나는 효과 */
        inset 0 0 4px 1px #000,
        /* 버튼 가장자리 어둡게 (비네팅) */
        0 10px 15px rgba(0, 0, 0, 0.8);
    /* 버튼 전체 그림자 */

}

.mySwiper .swiper-horizontal>.swiper-pagination-bullets,
.mySwiper .swiper-pagination-bullets.swiper-pagination-horizontal,
.mySwiper .swiper-pagination-custom,
.mySwiper .swiper-pagination-fraction {
    left: 50%;
    top: 200px;
    transform: translate(-50%);
    width: 1000px
}

@media (max-width:1000px) {

    .mySwiper .swiper-horizontal>.swiper-pagination-bullets,
    .mySwiper .swiper-pagination-bullets.swiper-pagination-horizontal,
    .mySwiper .swiper-pagination-custom,
    .mySwiper .swiper-pagination-fraction {
        position: relative;
        top: 20px;
        width: 100%
    }
}

.mySwiper .swiper-button-prev,
.mySwiper .swiper-rtl .swiper-button-next {
    left: -100px !important
}

.mySwiper .swiper-button-next,
.mySwiper .swiper-rtl .swiper-button-prev {
    right: -100px !important
}

.mySwiper .swiper-button-next:after,
.mySwiper .swiper-button-prev:after {
    color: #757575
}

.mySwiper .swiper-pagination-bullet {
    background-color: #d6d6d6;
    height: 10px;
    opacity: 1;
    width: 10px
}

.mySwiper .swiper-pagination-bullet-active {
    background-color: var(--primary)
}

.tooltip_position {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10
}

.game_btn .game_img {
    color: #fff;
    font-size: 10px;
    height: 100%;
    left: 50%;
    max-width: unset;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s;
    width: unset
}

.isDesktop .home .game_btn:hover .game_img {
    filter: blur(5px);
    transform: translate(-50%, -50%) scale(1.1)
}

.game_btn .game_btn_section {
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 45%;
    transform: translate(-50%, -50%);
    transition: all .3s;
    width: 70%;
    z-index: 1
}

.isDesktop .game_btn:hover .game_btn_section {
    opacity: 1
}

.game_container_main .game_btn {
    left: 50%;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.login_modal_container {
    background-color: #fffc;
    border-radius: 5px;
    margin: 60px auto 0;
    max-height: calc(100dvh - 130px);
    max-width: calc(100% - 30px);
    overflow: auto;
    padding: 30px 20px 50px
}

.isDesktop input:-webkit-autofill:hover,
input:-webkit-autofill,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
    -webkit-box-shadow: inset 0 0 0 30px #fff !important
}

.tab-link {
    color: var(--text-light)
}

.account-tab-button {
    border-bottom: 5px solid transparent
}

.account-tab-button.active {
    border-bottom: 5px solid var(--primary)
}

.tab-link.active,
.tab-link.router-link-exact-active {
    color: var(--text-base) !important
}

.tab-link.line {
    border-bottom: 2px solid transparent
}

.tab-link.line.router-link-exact-active {
    border-bottom: 2px solid var(--secondary)
}

.header_back_btn {
    color: var(--text-base) !important;
    cursor: pointer;
    left: 10px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.header_back_btn svg path {
    fill: var(--text-base) !important
}

.game_search_icon {
    left: 10px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 20px
}

.game_view_button {
    transition: all .3s;
    width: 20px
}

.game_view_button svg path {
    fill: #989898
}

.game_view_button.active svg path {
    fill: var(--secondary)
}

.game_tab_btn {
    background-color: transparent;
    border: 1px solid var(--game-tab-btn-border);
    border-radius: 50px;
    color: var(--text-base);
    font-size: 14px;
    font-weight: 400;
    margin-right: 10px;
    padding: 5px 10px;
    transition: all .3s;
    white-space: nowrap
}

.game_tab_btn>img {
    margin-right: .5rem
}

.game_tab_btn.mobile {
    display: flex;
    flex-direction: column;
    gap: 2px
}

.game_tab_btn.mobile>img {
    margin-right: 0
}

.game_tab_btn.mobile>span {
    font-size: 12px
}

.game_tab_btn:last-child {
    margin-right: 0
}

.game_tab_btn.active {
    background: var(--game-tab-btn-bg-active);
    border: 1px solid var(--secondary);
    color: var(--content)
}

.game_tab_btn.router-link-active {
    background-color: var(--primary)
}

.loading_bg {
    align-items: center;
    background-color: #00000080;
    display: flex;
    z-index: 1
}

.loading_bg,
.maintenance_box {
    height: 100%;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.maintenance_box {
    background-color: #0009;
    border: 5px solid gold;
    border-radius: 16px
}

.maintenance_text {
    color: #fff;
    left: 50%;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 90%
}

.maintenance_text_1 {
    color: gold;
    font-size: 10px;
    font-weight: 400
}

.maintenance_text_2 {
    color: #fff;
    font-size: 16px;
    font-weight: 400
}

.isDesktop .home.game_container .game_btn.maintenance:hover .game_btn_content {
    background: #000;
    background: linear-gradient(0deg, rgba(0, 0, 0, .6), transparent)
}

.isDesktop .home .game_btn.maintenance:hover .game_img {
    filter: unset;
    transform: translate(-50%, -50%)
}

.isDesktop .game_btn.maintenance:hover .game_btn_section {
    opacity: 0
}

.isDesktop .game_container .game_btn.maintenance:hover .game_btn_content {
    background: #000;
    background: linear-gradient(0deg, rgba(0, 0, 0, .6), transparent)
}

.qr_canvas canvas {
    max-width: 100%
}

@media (max-width:1919px) {
    .container {
        max-width: 1800px;
        padding: 0 20px
    }
}

@media (max-width:1799px) {
    .container {
        max-width: 1400px
    }
}

@media (max-width:1400px) {
    .game_btn {
        width: calc(16.6% - 20px)
    }
}

@media (max-width:1024px) {
    .game_btn {
        width: calc(20% - 20px)
    }
}

@media (max-width:767px) {
    .game_btn {
        width: calc(50% - 20px)
    }

    .container {
        max-width: 100%
    }

    .marquee_box {
        width: calc(100% - 25px)
    }

    .swiper-pagination {
        padding: 0 20px !important
    }

    .mySwiper .swiper-pagination-bullet {
        height: 5px;
        margin: 0 3px !important;
        width: 5px
    }

    .mySwiper .swiper-button-next,
    .mySwiper .swiper-button-prev,
    .mySwiper .swiper-rtl .swiper-button-next,
    .mySwiper .swiper-rtl .swiper-button-prev {
        display: none
    }
}

.status-text.expired,
.status-text.rejected {
    color: var(--status-red)
}

.status-text.active,
.status-text.approved,
.status-text.completed {
    color: var(--status-green)
}

.status-text.pending,
.status-text.pending-active,
.status-text.pending-complete,
.status-text.restored {
    color: var(--status-grey)
}

.status-bg.expired,
.status-bg.rejected {
    background-color: var(--status-red)
}

.status-bg.active,
.status-bg.approved,
.status-bg.completed {
    background-color: var(--status-green)
}

.status-bg.pending,
.status-bg.pending-active,
.status-bg.pending-complete,
.status-bg.restored {
    background-color: #132358;
    border: 1px solid #133bba;
    border-radius: 16px
}

.html-content-wrapper.mobile {
    color: var(--text-base);
    font-size: .875em
}

.html-content-wrapper h1 {
    font-size: 1.6em;
    font-weight: 700;
    margin-bottom: .25em
}

.html-content-wrapper p,
.html-content-wrapper ul {
    margin-bottom: 1em
}

.html-content-wrapper .pull-left {
    float: left
}

.html-content-wrapper .info {
    padding-left: 15px;
    width: calc(100% - 50px)
}

.html-content-wrapper .clearfix:after {
    clear: both;
    content: " ";
    display: table
}

.html-content-wrapper ul {
    list-style-type: disc;
    padding-left: 2rem
}

.html-content-wrapper .org-title {
    color: #fabb1f;
    font-size: 1.5em;
    padding: 10px 0;
    text-transform: uppercase
}

.html-content-wrapper pre {
    word-wrap: break-word;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap
}

.html-content-wrapper .pdt15 {
    padding-top: 15px
}

.html-content-wrapper .pdt30 {
    padding-top: 30px
}

* .html-content-wrapper table {
    border: 0 solid;
    border-color: inherit
}

* .html-content-wrapper tbody,
* .html-content-wrapper td,
* .html-content-wrapper tr {
    border: 1px solid;
    border-color: inherit
}

.deposit-method {
    border-radius: 5px;
    padding: .5rem
}

.deposit-method.selected {
    background: linear-gradient(180deg, #0f48e6, #133bba);
    border: none
}

.bg-deposit-method-tab {
    background-color: #d6d6d6
}

.bg-deposit-preset-box {
    border: 1px solid #3c4363;
    border-radius: 10px
}

.bg-deposit-preset-box-2 {
    background-color: transparent;
    border-color: var(--line)
}

.bg-deposit-preset-box-2.active {
    border-color: var(--secondary);
    color: var(--secondary)
}

.deposit-text {
    color: var(--text-base)
}

.tab-button {
    background: none;
    border: unset;
    border-radius: 0;
    color: #c0c6d9
}

.tab-button.router-link-exact-active {
    border-bottom: 2px solid var(--secondary);
    color: var(--text-base) !important
}

.alert-wrapper.pending {
    background-color: #f7a41b1a
}

.alert-wrapper.pending>.alert-container {
    background-color: #ffa7004d !important
}

.alert-wrapper.pending>.alert-container>svg>path {
    fill: #f7a41b !important
}

.alert-wrapper.pending>*>a {
    color: #f7a41b !important
}

.alert-wrapper.processing {
    background-color: #e5f4ff
}

.alert-wrapper.processing>.alert-container {
    background-color: #a0d7ff
}

.alert-wrapper.processing div.px-3 {
    color: #0093ff
}

.alert-wrapper.processing>.alert-container>svg>path {
    fill: #0093ff
}

.alert-wrapper.processing>*>a {
    color: var(--primary)
}

.alert-wrapper.error {
    background-color: #ffe6e6
}

.alert-wrapper.error>.alert-container {
    background-color: #ffbaba
}

.alert-wrapper.error>.alert-container>svg>path {
    fill: #ff0b0b
}

.alert-wrapper.error>*>a {
    color: #ff0b0b
}

.bg-inp {
    background-color: var(--content-light) !important;
    border: 1px solid var(--line)
}

.bg-inp-disabled,
.bg-inp-disabled2 {
    background-color: var(--o-disabled)
}

.bg-inp-border {
    border-color: #d6d6d6
}

.bg-inp-2 {
    background-color: #d6d6d6
}

.contact-us-item {
    background-color: var(--content-light);
    border: 1px solid var(--line)
}

.bg-info {
    border: 1px solid var(--line)
}

.bg-info,
.fd-container {
    background-color: var(--content-light) !important
}

.fd-container {
    border: 1px solid var(--line);
    border-radius: 5px !important
}

.add-bank-wrap {
    background-color: var(--content-light);
    border-color: #272729
}

.bg-history-tab {
    background-color: var(--content);
    color: var(--text-light)
}

.bg-history-tab.active,
.isDesktop .bg-history-tab:hover {
    background-color: unset;
    border-bottom: 2px solid var(--secondary);
    color: var(--text-base)
}

.tnc-text {
    color: var(--text-base)
}

.tnc-text>a {
    color: var(--primary)
}

.reg-contact-us-text {
    color: var(--text-base)
}

.reg-contact-us-text>span,
.reg-contact-us-text>u {
    color: var(--primary)
}

.cs-contact-text {
    color: var(--text-base)
}

.cs-contact-text>a {
    color: var(--primary)
}

.id-verification-take-note-text {
    color: var(--text-base)
}

.rebate-disclaimer-text {
    color: var(--primary)
}

.text-auth-title {
    color: #f4f4f5
}

.login-inp-wrap {
    background-color: #fff
}

.login-inp-wrap .password_icon {
    right: 10px !important
}

.login-inp {
    background-color: #fff !important;
    color: #000 !important
}

.login-inp::-moz-placeholder {
    color: #00000080
}

.login-inp::placeholder {
    color: #00000080
}

.login-forgot-color {
    color: var(--primary)
}

.announcement_check_box {
    background: var(--content)
}

.bg-modal {
    background-color: #0a0a0a
}

.fmodal-content.bg-modal.community-bg-box {
    background-color: transparent !important;
    box-shadow: none !important
}

.mobile-head,
.stick-promo-apply {
    background-color: var(--content)
}

.mobile-head {
    border-bottom: 1px solid var(--line);
    box-shadow: 0 3px 6px #0000000d
}

.bg-account {
    background-color: var(--content)
}

.bg-account-btn {
    background: var(--content-light);
    border: 1px solid var(--line)
}

.mobile .am-link {
    border-color: var(--text-light) !important
}

.inform_btn {
    align-items: center;
    background-color: transparent;
    color: var(--text-base);
    display: flex;
    font-size: 14px;
    font-weight: 400;
    padding: 10px 20px;
    transition: all .3s
}

.inform_btn.router-link-active {
    background: var(--secondary);
    color: var(--content)
}

.bg-inform {
    background-color: #0a0a0a
}

.p-inform {
    padding-inline-start: 0
}

.info-title-text {
    color: var(--text-base)
}

.bg-m-submit-footer,
.bg-m-tab {
    background: var(--content)
}

.withdraw-group-label,
.withdraw-info-label {
    color: var(--text-base)
}

.withdraw-option-button {
    background-color: var(--content-light);
    border-color: var(--line)
}

.withdraw-option-button.active {
    background: #132358 !important;
    border: 1px solid #173998 !important;
    color: var(--text-base)
}

@media (min-width:768px) {
    .withdraw-option-button {
        background-color: var(--content-light);
        border: 1px solid var(--line)
    }

    .withdraw-option-button.active {
        background: #132358 !important;
        border: 1px solid #173998 !important;
        color: var(--text-base)
    }

    .profile_date_bg {
        background-color: var(--content-light) !important
    }
}

.text-vip {
    color: #8200fe
}

.bg-vip-card {
    background: var(--content-light)
}

.hint-text-color {
    color: var(--text-base)
}

.hint-svg-color {
    color: #919191
}

.bank-account-border-color {
    border-color: #272729
}

.withdraw-refresh-btn {
    background-color: #132358 !important;
    border: 1px solid #173998 !important
}

.isDesktop .withdraw-refresh-btn:hover:not(:disabled) {
    background: #757575
}

.withdraw-refresh-btn:disabled {
    cursor: not-allowed
}

.withdraw-method-draw-bal {
    background: #e7ebf5;
    color: #000
}

.withdraw-method-promo-bal {
    background: #8a9bcb;
    color: #000
}

.withdraw-crypto {
    background: #fccf9b
}

.bank-option {
    background-color: var(--line);
    border-color: #fff
}

.invite-border-color {
    border-color: #e5e7eb
}

.invite-bg {
    background-color: var(--content-light) !important;
    border: 1px solid var(--line)
}

.color-primary-secondary {
    color: var(--primary)
}

.referral-info-amount {
    color: #f7a41b
}

.invite-download-btn {
    background: var(--primary);
    border-color: var(--primary)
}

.copy-btn,
.invite-download-btn {
    color: var(--text-base)
}

.reward-released-so-far .bg-invite-info {
    background: var(--content-light) !important;
    border: 1px solid #27272a;
    border-radius: 10px
}

.bg-invite-badge {
    background: #ffde83
}

.faq-entry {
    background: var(--primary-light)
}

.isDesktop .faq-entry:hover {
    background: var(--primary);
    color: #fff
}

.faq-entry svg {
    color: var(--text-base)
}

.faq-entry-content {
    background-color: var(--content-light)
}

.bg-leaderboard-modal {
    background: var(--secondary);
    color: var(--content)
}

.bg-leaderboard-modal .leaderboard-icon {
    fill: var(--content)
}

.leaderboard-marquee {
    background-color: #e29212
}

.leaderboard-btn {
    border-color: transparent;
    color: #fff
}

.leaderboard-btn.active {
    border-color: var(--primary);
    color: var(--primary)
}

.leaderboard-tab-container {
    background-color: #1c1c1c
}

.leaderboard-tab {
    color: #fff
}

.leaderboard-tab.active {
    color: var(--primary)
}

.leaderboard-tab-indicator {
    background-color: var(--primary)
}

.leaderboard_left_bar .bg-primary {
    background-color: var(--secondary) !important
}

.rebate-holder {
    background: transparent;
    border: 1px solid var(--line)
}

.color-primary-text-base {
    color: var(--primary)
}

.border-color-line {
    border-color: #d6d6d6
}

.selection-type {
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 10px !important
}

.selection-type.active {
    background: var(--secondary) !important;
    color: var(--content) !important
}

.selection-common {
    background: transparent !important;
    border: 1px solid var(--line)
}

.selection-common.active {
    background: var(--secondary) !important;
    color: var(--content)
}

.bg-vip-progressbar {
    background-color: #d6d6d6;
    position: relative
}

.bg-vip-progressbar .input-progress-bar {
    background-color: #d6d6d6;
    height: 20px
}

.bg-vip-progressbar .input-progress {
    background: var(--bg-main)
}

.bg-vip-progressbar .input-label {
    color: #fff;
    position: absolute;
    right: 10px;
    top: 0
}

.btn-new-pass,
.btn-new-pin {
    background: #fff !important;
    color: var(--primary)
}

.quick-nav {
    background: var(--content);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 3px 6px #0000000d
}

.quick-nav-back-btn,
.quick-nav-deposit,
.quick-nav-statement,
.quick-nav-title {
    color: var(--text-base)
}

.quick-nav-bank-transfer {
    color: var(--primary)
}

.bg-playnow-btn {
    background: var(--bg-main);
    color: #fff
}

.header_logo_img,
.topbar_logo_skeleton_size {
    padding-top: 41.66667%
}

.header_logo_img {
    background: var(--header-bg);
    background-image: url(/logo-light.png?v=5);
    background-position: 0;
    background-repeat: no-repeat;
    background-size: contain;
    position: relative;
    width: 100%
}

.credit_topbar_1 {
    color: var(--secondary);
    display: block
}

.credit_topbar_2 {
    display: none
}

.credit_topbar_2 .border {
    border-color: #fff
}

.topbar-promo-btn {
    background-color: #56b131
}

.contactBox_left {
    color: #fff
}

.contactBox_left,
.contactBox_right {
    background: var(--bg-main)
}

.contact-tab-text-1,
.contact-tab-text-2 {
    color: #fff
}

.quickLaunchBox {
    background: transparent !important;
    border: unset
}

.game-search-bg {
    background: var(--game-search-bg)
}

.header-user-name {
    color: var(--secondary)
}

.merchant_text_color {
    color: var(--content)
}

.ms-nav {
    color: var(--text-base)
}

.ms-nav.disabled {
    color: #757575;
    pointer-events: none
}

.vip_tab_text {
    color: var(--text-light);
    transition: all .3s
}

.btn_vip_tab.active .vip_tab_text,
.isDesktop .btn_vip_tab:hover .vip_tab_text {
    color: var(--text-base)
}

.vip-indicator {
    background-color: var(--secondary)
}

.vip-box {
    background: var(--content-light)
}

.vip-box-text {
    color: var(--text-base)
}

.vip-cat-bg {
    background: var(--content-light)
}

.vip-table {
    background-color: var(--content-light)
}

.vip-table td,
.vip-table th {
    border-color: #ebebeb;
    color: var(--text-base)
}

.vip-desc-container {
    background-color: var(--content-light);
    color: #000
}

.vip-desc-title {
    color: var(--text-base)
}

.vip-desc-content {
    background-color: transparent;
    color: #000
}

@media (max-width:767px) {
    .vip-desc-container {
        color: unset
    }
}

.amount-box {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-clip: padding-box;
    background-color: var(--o-bg);
    border-color: var(--o-border-color);
    border-radius: var(--o-border-radius);
    border-style: solid;
    border-width: var(--o-border-width);
    box-shadow: var(--o-shadow);
    color: var(--o-text);
    font-weight: 400;
    outline: none;
    padding: var(--o-padding);
    transition: all .2s;
    width: 100%
}

.mission_desc_text {
    color: #f7a41b
}

.referral_text {
    color: var(--secondary)
}

.o-input.deposit_input {
    background-color: var(--o-bg)
}

.o-input.deposit_input2 {
    background-color: transparent
}

.o-input-wrapper.deposit_input2 {
    background: #242a42
}

.account_password_section {
    background: var(--bg-main)
}

.announcement_icon img {
    filter: invert(49%) sepia(0) saturate(172%) hue-rotate(180deg) brightness(92%) contrast(80%);
    transition: all .3s;
    width: 24px
}

.active .announcement_icon img {
    filter: invert(0)
}

.btn-info {
    background: var(--secondary);
    box-shadow: unset;
    color: var(--content)
}

.mission_daily_close_btn img {
    filter: brightness(0) invert(0)
}

.ms-day-box.gold {
    background-color: var(--ms-diary-box-gold-bg);
    border-color: var(--secondary) !important
}

.contact_us_arrow {
    background-color: #fff3;
    border-radius: 100%;
    height: 21px;
    margin-top: 10px;
    position: relative;
    transition: all .3s;
    width: 21px
}

.angpow_logo_img {
    background-image: url(/logo-dark.png?v=5);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    padding-top: 41.66667%;
    position: relative;
    width: 100%
}

.angpow-header,
.angpow-header .logo-wrapper {
    background: #fff
}

@media (max-width:767px) {
    .angpow-header .logo-wrapper {
        background: #d5d5d5
    }

    .angpow_logo_img {
        background-color: #d5d5d5
    }
}

.angpow-nav-bar {
    background: transparent
}

@media screen and (max-width:767px) {
    .angpow-nav-bar {
        background: transparent
    }
}

.angpow-header-text {
    color: #000
}

.angpow-header-pipe {
    background: #000
}

.angpow-header-btn {
    align-items: center;
    border: 1px solid #c8333a;
    border-radius: 5px;
    color: #c8333a;
    display: flex;
    font-size: 18px;
    font-weight: 400;
    height: 30px;
    justify-content: center;
    margin-left: 15px;
    padding: 0 10px
}

.angpow-header-btn.mobile {
    background: #c34324;
    background: linear-gradient(0deg, #c34324, #ba222b);
    border: unset;
    border-radius: unset;
    color: #fff;
    font-size: 12px;
    height: 100%;
    margin-left: 0;
    padding: unset;
    width: 25%
}

.mobile_bottom_menu_icon {
    -webkit-text-fill-color: transparent;
    background: #fff;
    -webkit-background-clip: text;
    font-size: 1.25rem;
    height: 25px;
    padding: 1px;
    width: 35px
}

.router-link-active .mobile_bottom_menu_icon {
    -webkit-text-fill-color: transparent;
    background: var(--secondary);
    -webkit-background-clip: text
}

.mobile_bottom_menu_text {
    color: #fff
}

.router-link-active .mobile_bottom_menu_text {
    color: var(--secondary)
}

.vip_tab_icon {
    color: var(--text-light);
    font-size: 16px;
    transition: all .3s
}

.isDesktop .btn_vip_tab:hover .vip_tab_icon {
    color: var(--primary)
}

.btn_vip_tab.active .vip_tab_icon {
    color: var(--text-base)
}

.verify-reward-container {
    background-color: #132358;
    border: 1px solid #173998;
    border-radius: 4px;
    margin-bottom: 12px;
    padding: 6px;
    position: relative;
    width: 320px
}

.verify-reward-container:after {
    background-color: #f3f5fa;
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    content: "";
    height: 16px;
    left: 1rem;
    position: absolute;
    top: 100%;
    width: 16px
}

.verify-reward-container>span {
    color: var(--text-base)
}

.verifications-container {
    background-color: var(--content-light);
    border-radius: 5px
}

.verification-btn {
    align-items: center;
    background-color: #2e344f;
    border: 1.5px solid #3c4363;
    border-radius: 5px;
    color: var(--text-base);
    cursor: pointer;
    display: flex;
    font-size: 1.125rem;
    height: 40px;
    justify-content: center;
    position: relative;
    width: 40px
}

.verification-btn:after {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: .25rem;
    content: "";
    height: 12px;
    opacity: 0;
    position: absolute;
    right: .25rem;
    width: 12px;
    z-index: 2
}

.verification-btn.verified {
    background-color: #3bb54a
}

.verification-btn.verified .icon-verify-mobile {
    color: #3ab54b
}

.verification-btn.verified:after {
    opacity: 1
}

.bank_account_box {
    background-color: var(--content-light)
}

.start_button_logo {
    background-image: url(/logo-light.png?v=5);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    left: 50%;
    padding-top: 70%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 70%
}

.account_header_bg {
    background: linear-gradient(180deg, #133bba00, var(--secondary))
}

.account_header_bg .merchant_text_color {
    color: #fff
}

.summary_box {
    background: transparent
}

.download_logo {
    background: #133bba;
    border-radius: 30px !important
}

.download_logo_img {
    background-image: url(/logo-light.png?v=5);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    padding-top: 41.66667%;
    width: 120px
}

.topbar-input,
.topbar-input:focus {
    background-color: transparent;
    border-bottom: 1px solid #d6d6d6;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    min-width: 193px;
    outline: unset;
    padding: 5px 10px;
    width: 100%
}

.isDesktop .topbar-input:-webkit-autofill:hover,
.topbar-input:-webkit-autofill,
.topbar-input:-webkit-autofill:active,
.topbar-input:-webkit-autofill:focus {
    -webkit-box-shadow: inset 0 0 0 0 #fff !important
}

.topbar-input:-webkit-autofill {
    -webkit-text-fill-color: #000 !important
}

.topbar_form_password_icon {
    color: #fff;
    cursor: pointer;
    font-size: 20px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%)
}

.error-input,
.error-input:focus {
    border-bottom: 1px solid #e94951
}

.topbar_btn_1 {
    background-color: transparent;
    color: #fff
}

.topbar_btn_1,
.topbar_btn_2 {
    border: 1px solid var(--primary);
    border-radius: 5px;
    font-size: 16px;
    font-weight: 400;
    height: 35px;
    padding: 0 15px;
    text-transform: uppercase;
    white-space: nowrap background-color: var(--primary);
    color: #000 !important
}


.forgot-link {
    color: #fff
}

.header-withdraw-link {
    color: #fff !important
}

.select-bank-primary-btn {
    color: #fff
}

.vippage-bg,
.vippage-bg.mobile {
    background: var(--content)
}

.inhouse_home_menu_button {
    background: #ebebeb;
    border-radius: 100%;
    display: block;
    height: 30px;
    margin: 0 auto;
    position: relative;
    width: 30px
}

.inhouse_home_menu_button i {
    -webkit-text-fill-color: transparent;
    background: #ffa069;
    background: var(--bg-main);
    -webkit-background-clip: text;
    font-size: 16px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%)
}

.outhouse_home_menu_button {
    display: none
}

.quick-access-text {
    color: var(--text-base)
}

.play-game-spinner {
    display: block
}

.play-game-logo {
    background-image: url(/logo-dark.png?v=5);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    padding-top: 17.85714%;
    position: relative;
    width: 100%
}

.mobile-info-bg {
    background: var(--content)
}

.mobile-download-header {
    background: none;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 3px 6px #0000000d;
    color: #f4f4f5
}

.mobile-promotion-header {
    background: var(--content);
    box-shadow: 0 3px 6px #0000000d;
    color: var(--text-base)
}

.promotion-title {
    color: #fff
}

.mobile-promotion-title,
.tab_game .game_content .game_name {
    color: var(--text-base)
}

.lang-wrapper {
    color: #000
}

.lang-wrapper,
.lang-wrapper.mobile {
    background-color: #fff
}

.game_header_text_color_1 {
    color: #c6c6c6
}

.game_header_text_color_2 {
    color: var(--primary-light)
}

.game_header_close_btn path {
    fill: #fff
}

.app_tag {
    left: 0;
    position: absolute;
    top: 0;
    width: 30px
}

.app_modal_bg {
    background: #242a42;
    padding: 20px
}

.app_modal_box {
    align-items: center;
    display: flex;
    flex-wrap: wrap
}

.app_modal_box_left {
    align-items: center;
    background-color: #d6d6d6;
    border-radius: 10px;
    display: flex;
    height: 100px;
    justify-content: center;
    margin-right: 20px;
    width: 200px
}

.app_modal_box_right {
    width: calc(100% - 220px)
}

.app_modal_text_1 {
    color: var(--text-base);
    font-size: 16px;
    font-weight: 500;
    margin-top: 20px
}

.app_modal_text_2 {
    align-items: center;
    border: 1px solid var(--text-base);
    border-radius: 50px;
    display: flex;
    margin-top: 10px;
    padding: 5px 10px
}

.app_modal_warn_icon {
    margin-right: 10px;
    width: 15px
}

.app_modal_warn_icon path {
    fill: #ffce00
}

.app_modal_text_2 .text {
    color: var(--text-base);
    font-size: 14px;
    font-weight: 500
}

.app_modal_text_3 {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-top: 10px
}

.app_modal_text_3 .icon {
    margin-right: 10px;
    width: 15px
}

.app_modal_text_3 .icon path {
    fill: var(--text-base)
}

.app_modal_text_3 .text {
    color: var(--text-base);
    font-size: 14px;
    font-weight: 500
}

.app_modal_line {
    background-color: var(--text-base);
    height: 1px;
    margin-bottom: 5px;
    margin-top: 10px;
    width: 100%
}

.app_modal_button {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px
}

.app_modal_btn_1 {
    background: var(--text-base);
    color: #000;
    margin-right: 10px
}

.app_modal_btn_1,
.app_modal_btn_2 {
    align-items: center;
    border-radius: 5px;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    justify-content: center;
    padding: 5px 10px;
    text-transform: uppercase
}

.app_modal_btn_2 {
    background: var(--bg-main);
    color: #fff
}

@media (max-width:767px) {
    .app_modal_box_left {
        background-size: 50%;
        height: 80px;
        margin-right: 0;
        margin-top: 30px;
        width: 100%
    }

    .app_modal_box_right {
        width: 100%
    }

    .app_modal_btn_1 {
        margin-right: 0;
        width: 100%
    }

    .app_modal_btn_2 {
        margin-top: 10px;
        width: 100%
    }
}

.sport_btn_bg {
    background: linear-gradient(0deg, #173998, rgba(217, 4, 41, 0) 80%)
}

.wallet-box {
    border-color: var(--line);
    border-radius: .5rem;
    border-width: 1px;
    overflow: hidden;
    text-align: center
}

.wallet-box .provider {
    background-color: var(--content-light);
    border-bottom-width: 1px;
    border-color: var(--line)
}

.wallet-box .amount {
    background-color: transparent
}

.lottery_bg {
    background-image: url(/aw8/img/lottery_bg.webp);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    padding-bottom: 200px
}

.vip-content-box,
.vip-content-box .bg-content-light-2 {
    background: transparent
}

.vip-content-box .bg-primary {
    background: var(--bg-main)
}

.privillege-reward-box {
    background: transparent;
    border: 1px solid var(--line)
}

.grid-cols-1 .tab_game {
    border-bottom: 1px solid var(--line)
}

.icon_inbox {
    width: 24px
}

.icon_inbox path {
    fill: #e3e3e3
}

.icon_inbox circle {
    fill: red
}

.no_game_found_text_color {
    color: #fff
}

.search_input_text_color {
    border: 1px solid #52525b;
    color: #fff
}

.promotions_img_box .promotions_img_box_aspect_ratio {
    padding-top: 60.24096%;
    width: 100%
}

.app_download_banner_box {
    align-items: center;
    background: #777;
    display: flex;
    height: 60px;
    justify-content: space-between;
    padding: 5px 10px;
    position: relative;
    width: 100%;
    z-index: 999
}

.app_download_banner_logo {
    background: #000;
    background-image: url(/logo-light.png?v=5);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 80%;
    border-radius: 10px;
    height: 50px;
    width: 50px
}

.app_download_banner_btn,
.app_download_banner_name {
    color: #fff;
    font-size: 14px;
    font-weight: 500
}

.app_download_banner_btn {
    background: var(--primary);
    border-radius: 50px;
    margin-right: 10px;
    padding: 5px 10px
}

.app_download_banner_close {
    background: #000;
    border-radius: 100%;
    height: 20px;
    position: relative;
    width: 20px
}

.app_download_banner_close svg {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 15px
}

.app_download_banner_close svg path {
    fill: #fff
}

.topbar_deposit_icon_btn {
    background: var(--primary);
    height: 28px;
    position: relative;
    width: 28px
}

.topbar_deposit_icon_btn svg {
    height: 18px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 18px
}

.topbar_deposit_icon_btn svg path {
    fill: #fff
}

.position-indicator {
    background-color: var(--secondary)
}

.mobile_footer_text_color {
    color: #000
}

.mobile_footer_bg {
    background: transparent
}

.profile-action-list {
    background-color: var(--content)
}

.profile-info-list>div {
    border-bottom-width: 1px;
    border-color: var(--line)
}

.bank-detail-group-label,
.bank-detail-info-label {
    color: var(--secondary)
}

.security-container {
    background-color: var(--content)
}

@media screen and (min-width:768px) {
    .security-container {
        background-color: var(--content)
    }
}

.live-play-btn>defs>linearGradient>stop.first,
.live-play-btn>defs>linearGradient>stop.second,
.live-play-btn>defs>linearGradient>stop.third {
    stop-color: #fff
}

.live-play-btn>g>path:last-child {
    fill: #414845
}

.sidebar_button_content>.sidebar_button_img {
    height: 30px;
    width: 30px
}

.marquee-announce-text {
    color: #fff
}

.isDesktop .language-country-lang-item:hover>button,
.language-country-lang-item>button.active {
    color: var(--primary)
}


/* 사이드바 버튼 재설정 */

/* 버튼 기본 형태 및 배경/테두리 스타일 */
.featured-btn {

    border-radius: 24px;

    /* 배경: 어두운 브라운/블랙 둥근 그라데이션 */
    background: radial-gradient(circle at 50% 30%, #3a2e1d 0%, #151009 70%, #0a0704 100%);

    /* 럭셔리 골드 테두리 및 입체감(그림자) 효과 */
    border: 2px solid #e6c57a;
    box-shadow:
        0 0 0 2px #3a2a11,
        /* 가장 바깥쪽 얇고 어두운 선 */
        inset 0 0 5px 2px #fff3b3,
        /* 테두리 안쪽 빛 반사 효과 */
        inset 0 0 20px 5px #000,
        /* 테두리 안쪽 어두운 비네팅 효과 */
        0 10px 15px rgba(0, 0, 0, 0.8);
    /* 버튼 전체 바깥 그림자 */

    /* 내부 요소 정렬용 (Flexbox) */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: transform 0.2s ease, filter 0.2s ease;
}

/* 마우스 오버 시 살짝 떠오르고 밝아지는 효과 */
.featured-btn:hover {
    transform: translateY(-2px) scale(1.02);
    filter: brightness(1.1);
}

/* 클릭 시 눌리는 효과 */
.featured-btn:active {
    transform: translateY(2px) scale(0.98);
}

/* 아이콘 위치 및 그림자 */
.icon-wrapper {
    margin-bottom: 12px;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.8));
}

/* 골드 메탈릭 텍스트 스타일 */
.btn-text {
    font-family: 'Georgia', 'Times New Roman', serif;
    /* 클래식한 폰트 */
    font-size: 22px;
    font-weight: bold;
    text-align: center;
    line-height: 1.2;
    margin: 0;

    /* 텍스트 골드 그라데이션 적용 */
    background: linear-gradient(to bottom, #ffeba5 0%, #dca245 40%, #a4701e 80%, #f6d365 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    /* 텍스트 그림자 (그라데이션 텍스트에는 drop-shadow가 더 깔끔합니다) */
    filter: drop-shadow(1px 2px 2px rgba(0, 0, 0, 0.9));
}




.referral-overview-entry {
    background: #18181b;
    border: 1px solid var(--line);
    border-radius: 10px
}

.copy-link-btn {
    background: var(--primary);
    color: #fff
}

.instant-rebate-box,
.referral-box {
    background: var(--content-light);
    border: 1px solid var(--line);
    border-radius: 16px
}

@media (max-width:480px) {

    .instant-rebate-box,
    .referral-box {
        border-radius: 5px !important
    }

    .instant-rebate-box .inner,
    .referral-box .inner {
        border-radius: 0 0 5px 5px !important
    }
}

.referral-statistic-summ-text {
    color: #f7a41b
}

@media (max-width:480px) {
    .referral-statistic-summ-text {
        color: #d4d4d8
    }
}

.instant-rebate-box .inner,
.referral-box .inner {
    background: unset;
    border: 1px solid var(--line);
    border-radius: 16px
}

.instant-rebate-box .inner-2,
.referral-box .inner-2 {
    background: #fff
}

.referral-leaderboard {
    background: var(--bg-main);
    color: #fff
}

.instant-rebate-box .html-content-wrapper,
.referral-box .html-content-wrapper {
    color: var(--text-base)
}

.check_in_text {
    color: var(--secondary)
}

.icon_restore {
    background: var(--secondary);
    border-radius: 100%;
    flex-shrink: 0;
    height: 20px;
    position: relative;
    transform: rotate(0);
    transition: all 1s linear;
    width: 20px
}

.icon_restore.spin {
    transform: rotate(2turn)
}

.icon_restore svg {
    height: 15px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 15px
}

.icon_restore svg path {
    fill: #000
}

.topbar_divider_line_color {
    background: #d6d6d6
}

.promotion_box_btn {
   
    height: 28px;
    width: 28px
}

.promotion_box_btn_icon {
    height: 16px;
    width: 16px
}

.promotion_box_btn_icon path {
    fill: #fff
}

@media (max-width:350px) {
    .promotion_box_btn {
        border-radius: 5px;
        height: 20px;
        width: 20px
    }

    .promotion_box_btn_icon {
        height: 12px;
        width: 12px
    }
}

.m-progress-bar {
    background: var(--mission-progress-bg);
    border: 0 solid var(--mission-progress-border);
    height: 8px
}

.m-progress,
.m-progress-bar {
    border-radius: 4rem;
    width: 100%
}

.m-progress {
    background: var(--mission-progress);
    height: 100%;
    transform-origin: left;
    transition: all .2s
}

.m-progress-bar.green {
    border-color: #46ad4d
}

.m-progress-bar.green .m-progress {
    background-color: #46ad4d
}

.contact_us_start_btn {
    background: var(--primary);
    color: #fff
}

.contact_us_arrow svg path {
    fill: #fff
}

.tooltip_box {
    background: #626262;
    color: #fff
}

.launch_arrow {
    background-color: #fff;
    clip-path: polygon(0 0, 0 100%, 100% 50%);
    height: 20px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) rotate(0);
    transition: all .3s;
    width: 8px
}

.open .launch_arrow {
    transform: translate(-50%, -50%) rotate(180deg)
}

.deposit-input-disabled {
    background-color: var(--o-disabled)
}

.account-vip-pill {
    border-color: #fff;
    color: #fff
}

@media screen and (min-width:768px) {
    .account-vip-pill {
        border-color: var(--secondary);
        color: var(--secondary)
    }
}

.notification-bullet {
    background: var(--bg-main)
}

.promotion-entry-height {
    padding-top: 60.24096%
}

.referral_label_text {
    font-size: 20px
}

.referral-leaderboard-info-bg {
    background: #fff;
    border-radius: 50px;
    color: #000;
    font-size: 16px;
    height: 32px;
    line-height: 16px;
    padding: 0 20px
}

@media (max-width:767px) {
    .referral-leaderboard-info-bg {
        font-size: 2.5vw;
        line-height: 2.5vw
    }

    .referral_label_text {
        font-size: 6vw
    }
}

.income_calculator_box {
    background: linear-gradient(0deg, #133bba 0, #133bba00);
    border: 1px solid #173998 !important;
    border-radius: 16px;
    padding: 1rem
}

.income_calculator_title {
    align-items: center;
    display: flex;
    width: 100%
}

.income_calculator_title .image {
    text-align: center;
    width: 75px
}

.income_calculator_title .image img {
    width: 100%
}

.income_calculator_title .text {
    color: #fff;
    font-size: 20px;
    font-weight: 900;
    margin-left: 20px;
    text-align: left;
    text-shadow: 0 .04rem .1rem rgba(0, 0, 0, .35)
}

.income_calculator_amount {
    color: #f7a41b;
    font-size: 22px;
    font-weight: 900;
    margin-top: 20px;
    text-align: center
}

.income_calculator_desc {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    margin-top: 10px;
    text-align: center
}

.income_calculator_desc .color {
    color: #ffc576
}

.income_calculator_slider_input {
    -webkit-appearance: none;
    background: #132358;
    border-radius: 2px;
    height: 5px;
    outline: none;
    width: 100%
}

.income_calculator_slider_input::-webkit-slider-thumb {
    -webkit-appearance: none;
    background: linear-gradient(135deg, #65fdf0, #1d6fa3);
    border-radius: 50%;
    box-shadow: 0 0 5px #ffffffb3;
    -webkit-box-shadow: 0 0 5px 0 hsla(0, 0%, 100%, .7);
    -moz-box-shadow: 0 0 5px 0 hsla(0, 0%, 100%, .7);
    height: 15px;
    width: 15px
}

.filter_box .o-input {
    border: 1px solid #52525b;
    border-radius: 5px;
    color: #f4f4f5;
    font-size: 10px;
    font-weight: 400;
    height: 22px;
    padding: 0 20px 0 10px !important
}

.input-light-content {
    font-size: 12px !important
}

.filter_box .o-input-wrapper.right .o-icon.right {
    right: 10px !important
}

.filter_box .o-input-wrapper.right .o-icon.right svg {
    width: 8px
}

.filter_box .o-input-wrapper.right .o-icon.right svg path {
    fill: #a1a1a9
}

.referral_table thead {
    background: var(--content-light)
}

.referral_table .user-table tbody tr:nth-child(odd) {
    background: transparent
}

.total_table {
    background: #0e0e11;
    bottom: 0;
    box-shadow: 0 -5px 5px #0000001a;
    -webkit-box-shadow: 0 -5px 5px 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 -5px 5px 0 rgba(0, 0, 0, .1);
    left: 0;
    padding: 5px 30px;
    position: fixed;
    width: 100%
}

.total_table_content {
    align-items: center;
    color: #f4f4f5;
    display: flex;
    font-size: 12px;
    font-weight: 700;
    justify-content: space-between
}

.invite_friend_incomes_button {
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 50px;
    color: var(--text-base);
    font-size: 14px;
    font-weight: 500;
    padding: 5px 10px;
    transition: all .3s
}

.invite_friend_incomes_button.active {
    background: #132358 !important;
    border: 1px solid #173998 !important;
    color: #fff
}

.date_range_picker_text_color {
    color: #f4f4f5;
    font-weight: 400
}

.date_range_picker_text_color.active {
    color: #f4f4f5
}

.date_range_picker_clear {
    color: #d4d4d8;
    font-size: 16px;
    font-weight: 400;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%)
}

.dateRange .dpHeadCell {
    color: #f4f4f5;
    text-transform: uppercase
}

.dateRange .dpBodyCell,
.dateRange .dpHeadCell {
    font-size: .75em;
    font-weight: 400;
    padding: .75em 0;
    text-align: center;
    width: 14.28571%
}

.dateRange .dpBodyCell {
    border-collapse: collapse;
    cursor: pointer;
    position: relative
}

.dateRange .dpBodyCell.light {
    color: #52525b
}

.dateRange .dpBodyCell.disabled {
    color: var(--o-text-light);
    opacity: .6;
    pointer-events: none
}

.isDesktop .dateRange .dpBodyCell:hover {
    color: var(--o-primary)
}

.dateRange .dpBodyCell .text {
    position: relative;
    z-index: 3
}

.date .dpBodyCell.selected,
.o-dp-month-cell.selected,
.o-dp-options-container+div.btn-margin .bg-primary,
.o-dp-page .bg-primary,
.o-dp-year-cell.selected {
    background: var(--secondary) !important
}

.dateRange .dpBodyCell.selected {
    color: var(--content)
}

.dateRange .dpBodyCell.selected:before {
    background: var(--secondary);
    border-radius: 10px;
    content: "";
    height: 100%;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 70%;
    z-index: 2
}

.dateRange .dpBodyCell.selected:after {
    background: #0f48e61a;
    content: "";
    height: 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50%;
    z-index: 1
}

.dateRange .dpBodyCell.selected.start-date:after {
    right: 0
}

.dateRange .dpBodyCell.selected.end-date:after {
    left: 0
}

.dateRange .dpBodyCell.selected.start-date.end-date:after {
    display: none
}

.dateRange .dpBodyCell.in-range {
    background: #0f48e61a
}

.app_modal_change_password_text {
    align-items: center;
    color: var(--text-base);
    display: flex;
    font-size: 14px;
    font-weight: 400;
    gap: 10px;
    margin-top: 10px
}

.app_modal_click_here_btn {
    color: var(--secondary)
}

.app_modal_btn_3 {
    align-items: center;
    background: transparent;
    border: 1px solid var(--text-base);
    border-radius: 5px;
    color: var(--text-base);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    justify-content: center;
    margin-right: 10px;
    padding: 5px 10px;
    text-transform: uppercase
}

.app_modal_input_container {
    margin-top: 20px
}

.app_modal_input_container .label {
    color: var(--text-base);
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 5px
}

@media (max-width:767px) {
    .app_modal_btn_3 {
        margin-right: 0;
        margin-top: 10px;
        order: 2;
        width: 100%
    }
}

.footer .head {
    background: #fff;
    color: #000
}

.footer .body {
    color: #000
}

.modal-footer.bg-modal {
    background: #0b0b0b
}

.verify-email-pin-text {
    color: var(--text-base)
}

.verify-email-pin-resend-text {
    color: #50a69a
}

.verify-phone-pin-text {
    color: var(--text-base)
}

.verify-phone-pin-resend-text {
    color: #50a69a
}

.forgot-password-pin-text {
    color: var(--text-base)
}

.forgot-password-pin-resend-text {
    color: #50a69a
}

.withdrawal-bank-form-select-text {
    color: var(--text-base)
}

.redeem-code {
    color: #fff
}

.redeem-code input {
    border: none
}

.redeem-code input,
.redeem-code input:focus {
    background: #fff;
    color: #000
}

.redeem-code input::-moz-placeholder {
    color: #757575
}

.redeem-code input::placeholder {
    color: #757575
}

.bg-page-referral {
    background: var(--content)
}

.bg-page-game {
    background: var(--body)
}

.bg-layout-account,
.bg-layout-account-sidebar {
    background: #0a0a0a
}

.bg-layout-default,
.bg-layout-referral {
    background: var(--content)
}

.bg-layout-game,
.bg-layout-home {
    background: var(--body)
}

.promo-modal-remain-time-label {
    color: var(--secondary)
}

.profile-security-icon {
    color: var(--text-base)
}

.profile-bank-tab {
    border-color: var(--line);
    border-radius: .375rem;
    border-width: 1px
}

.profile-bank-tab.active {
    background-color: var(--secondary);
    border-color: var(--secondary);
    border-width: 2px;
    color: var(--content)
}

.bank_express_bank_box {
    margin-top: 20px
}

.bank_express_bank_box .grid {
    gap: 12px
}

.bank_express_notices {
    align-items: center;
    background: #ffe6e6;
    border-radius: 5px;
    display: flex;
    gap: 10px;
    padding: 5px 10px;
    width: 100%
}

.bank_express_notices svg {
    width: 15px
}

.bank_express_notices svg path {
    fill: #ff0b0b
}

.bank_express_notices .text {
    color: #ff0b0b;
    font-size: 14px;
    font-weight: 400
}

.bank_express_bank_content {
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 10px;
    display: flex;
    padding: 20px;
    width: 100%
}

.bank_express_bank_content .icon {
    height: 50px;
    margin-right: 10px;
    width: 50px
}

.bank_express_bank_content .text_content {
    display: grid;
    width: calc(100% - 60px)
}

.text_content .text_1 {
    font-size: 16px;
    font-weight: 400
}

.text_content .text_2 {
    font-size: 14px;
    font-weight: 400
}

.topbar_bottom_btn {
    border: 1px solid #000;
    border-radius: .375rem;
    color: #000;
    font-size: .875rem;
    font-weight: 700;
    height: 1.75rem;
    line-height: 1.25rem;
    padding: 0 1rem;
    text-transform: uppercase;
    white-space: nowrap
}

.topbar_bottom_dropdown_box_bg {
    background: #0a0a0a
}

.password-eye-icon {
    color: #757575;
    font-size: 20px
}

.mission_daily_close_btn {
    background: var(--secondary)
}

.check_in_success_text {
    color: #e3e3e3;
    text-align: center
}

.vip_table_bg {
    background: #fff
}

.modal_close_btn {
    align-items: center;
    background-color: #fff;
    border-radius: 100%;
    display: flex;
    height: 30px;
    justify-content: center;
    position: absolute;
    right: 5px;
    top: 5px;
    width: 30px
}

.forgot_password_box,
.modal_login_form_box {
    background-color: var(--auth-input-wrapper-bg);
    border-color: var(--auth-input-wrapper-border-color)
}

.modal_reg_form_box {
    background-color: #0a0a0a;
    border-color: var(--auth-input-wrapper-border-color)
}

.sport_character_img {
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 1000px
}

.login-select-currency-bg {
    background-color: var(--o-phone-bg) !important
}

.login-select-currency-bg.disabled {
    background-color: var(--o-disabled) !important
}

.pointer-events-none.o-input {
    background-color: var(--o-disabled)
}

.phone-select-bg {
    background-color: var(--o-phone-bg) !important
}

.phone-input-bg {
    background-color: var(--o-phone-bg)
}

.pointer-events-none .phone-select-bg {
    background-color: var(--o-disabled) !important
}

.pointer-events-none .phone-input-bg {
    background-color: var(--o-disabled)
}

.leaderboard-date-range {
    border-color: #919191;
    color: #919191
}

.leaderboard-date-range.active {
    background: var(--secondary);
    border-color: var(--secondary);
    color: var(--content) !important
}

.register-container-bg {
    background-color: var(--content-light)
}

.register-form-bg,
.register-social-bg {
    background-color: transparent
}

@media (min-width:768px) {
    .register-form-bg {
        background-color: var(--content-light)
    }

    .register-social-bg {
        background-color: #171717
    }
}

.step-text {
    color: #fff
}

.language_dropdown_bg {
    background: #fff
}

.language-country-lang-item button {
    color: #000
}

.language-country-lang-item .bg-white {
    background: #d6d6d6
}

@media (max-width:767px) {
    .language_dropdown_bg {
        background: #fff
    }
}

.promotion_banner_img_box {
    border-radius: 10px;
    overflow: hidden;
    padding-top: 31.25%;
    position: relative;
    width: 100%
}

.promotion_banner_img_box img {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.promotion_banner_img_box:before {
    background-blend-mode: darken;
    background-image: url(/logo-light.png?v=5);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 30%;
    content: "";
    filter: grayscale(1);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.blog_bg {
    background-color: var(--content)
}

.mobile-blog-header {
    background: var(--content);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 3px 6px #0000000d;
    color: var(--text-base)
}

.blog-head-title {
    background-color: var(--secondary);
    color: var(--content)
}

.blog-head-border {
    border-color: var(--secondary)
}

.blog-head-type {
    background: var(--secondary) !important;
    color: var(--content) !important
}

.blog-content-title {
    color: var(--text-base)
}

.blog-content-author,
.blog-content-publish-date,
.blog-content-share {
    color: #f4f4f5
}

.blog-content-copy-text {
    color: var(--primary)
}

.blog-content-copy-btn {
    background: var(--bg-main);
    color: var(--content)
}

.isDesktop .blog-card:hover .blog-card-title {
    color: var(--text-base)
}

.blog-card {
    background: var(--content-light);
    border: 1px solid var(--line);
    border-radius: 20px
}

.blog-card-type-badge {
    background: var(--secondary);
    color: var(--content)
}

.blog-card-title {
    color: var(--text-base)
}

.blog-card-description {
    -webkit-line-clamp: 1 !important;
    color: #d4d4d8;
    height: 1.25rem !important
}

.blog-card-author,
.blog-card-dot,
.blog-card-publish-date {
    color: #f4f4f5
}

.blog-type-btn-container {
    background: var(--content);
    border: 1px solid var(--line);
    border-radius: 10px
}

@media (max-width:767px) {
    .blog-type-btn-container {
        border: none
    }
}

.blog-type-btn {
    color: var(--text-light);
    font-weight: 500
}

.blog-type-btn.active {
    color: var(--text-base)
}

.blog-search-icon,
.blog-search-toggle-icon {
    color: #757575
}

.blog-search-input {
    background: var(--content-light);
    border-color: #27272a;
    border-radius: 50px !important;
    border-width: 1px
}

.blog-search-input::-moz-placeholder {
    color: #757575
}

.blog-search-input::placeholder {
    color: #757575
}

.blog-back-btn {
    background: var(--secondary)
}

.blog-back-btn-icon,
.blog-back-btn-text {
    color: var(--content)
}

.btn-table-copy svg path {
    fill: #fb5e16
}

.text-bet-green {
    color: #3cad00
}

.text-bet-value {
    color: red
}

.text-bet-green-bg {
    background-color: #3cad00
}

.text-bet-value-bg {
    background-color: red
}

.circle-bet-toggle {
    background-color: var(--primary)
}

.total-fixed-bg {
    background-color: var(--content-light)
}

.reg-page-action-text {
    color: var(--content)
}

.reg-page-aff-input-label,
.reg-page-catchphrase-text,
.reg-page-home-btn,
.reg-page-reg-complete-text,
.reg-page-regulate-text,
.reg-page-subcontent-text,
.reg-page-subtitle-text,
.reg-page-tnc-text,
.reg-page-welcome-text {
    color: var(--text)
}

.reg-page-valid-tick {
    color: #3bb54a
}

.reg-page-input .o-icon.right,
.reg-page-input .o-phone-select .o-icon.right {
    filter: invert(0)
}

.reg-page-input .reg-select {
    background-color: transparent
}

.reg-page-input .o-input-wrapper.open .reg-select {
    background-color: transparent;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-color: #3bb54a
}

.reg-page-input .o-input-wrapper.open .reg-select:before {
    background-color: var(--content-light);
    bottom: 0;
    content: "";
    height: 10px;
    left: 0;
    margin-left: 1px;
    margin-right: 10px;
    position: absolute;
    transform: translateY(50%);
    width: calc(100% - var(--o-border-width) - var(--o-border-width));
    z-index: 10000
}

.phone_input_container.o-input {
    background-color: #f6f6f6;
    border: 1px solid #f6f6f6;
    border-bottom-color: transparent;
    border-radius: 5px;
    padding: 0;
    position: relative
}

.phone_input_container.o-input.focus {
    background-color: #f6f6f6;
    border: unset;
    border: 1px solid var(--primary);
    border-radius: 5px;
    padding: 0
}

.phone_input_container.o-input.selectFocus {
    background-color: #f6f6f6;
    border: 1px solid var(--primary);
    border-bottom: unset;
    border-radius: 5px 5px 0 0;
    padding: 0
}

.o-select-content.phone_input_dropdown_border {
    border: 1px solid #3bb54a;
    border-top-right-radius: 5px !important
}

.o-select-content.phone_input_dropdown_border,
.phone_input_option_container {
    border-bottom-left-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
    border-top-left-radius: 0 !important
}

.phone_input_option_container {
    background: #f6f6f6;
    border-top-right-radius: 0 !important;
    display: block;
    padding: 10px;
    position: relative
}

.phone_input_option_search_container {
    display: block;
    margin-bottom: 10px;
    position: relative
}

.phone_input_option_search_container .o-input {
    background-color: var(--o-phone-bg);
    border-radius: 50px
}

.phone_input_option_search_container .o-input:focus,
.reg-page-input.reg-input.o-input.valid,
.reg-page-input.reg-input.o-input:focus,
.reg-page-input.valid .reg-select.o-input {
    border-color: #3bb54a
}

.withdrawal_notices {
    align-items: center;
    display: flex;
    gap: 5px;
    margin-top: 10px;
    position: relative;
    width: 100%
}

.withdrawal_notices_icon {
    height: 20px;
    width: 20px
}

.withdrawal_notices_icon path {
    fill: #ababab
}

.withdrawal_notices_text {
    color: var(--text-base);
    font-size: 16px;
    font-weight: 400
}

@media (max-width:767px) {
    .withdrawal_notices {
        left: unset;
        margin-top: 10px;
        position: relative;
        top: unset
    }

    .withdrawal_notices_text {
        font-size: 12px
    }

    .withdrawal_notices_icon {
        height: 20px;
        width: 20px
    }
}

.daily_right {
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    width: 400px
}

@media (max-width:767px) {
    .daily_right {
        width: 100%
    }
}

.category_live_play_btn {
    align-items: center;
    background: var(--bg-main);
    border-radius: 50px;
    bottom: 0;
    display: flex;
    gap: 5px;
    height: 13%;
    left: 50%;
    padding: 0 20px;
    position: absolute;
    transform: translate(-50%)
}

.category_live_play_btn_text {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase
}

.category_live_play_btn svg {
    width: 20px
}

.category_live_play_btn svg path {
    fill: #fff
}

.social-login {
    border: 1px solid #d6d6d6;
    border-radius: 8px
}

.footer-link-header,
.html-content-wrapper.mobile .vip_desc_infotext {
    color: var(--text-base)
}

.footer-link-text {
    color: #c0c6d9 !important
}

.isDesktop .footer-link-text:hover {
    color: #000
}

.footballText {
    color: #fff
}

.footer-hr {
    border-color: #d6d6d6
}

.html-content-wrapper menu,
.html-content-wrapper ol,
.html-content-wrapper ul {
    list-style: revert;
    margin: revert;
    padding: revert
}

.html-content-wrapper img {
    height: unset !important;
    max-width: 100%
}

.home-game-container-mobile-no-record-text {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    margin-top: 30px;
    text-align: center;
    width: 100%
}

.agent-betting-bonus .list {
    background-color: #fbfbfb
}

.agent-betting-bonus .packages-list {
    background-color: #f7f7f7;
    border: 1px solid #e7e7e7
}

.agent-betting-bonus .packages-list.active {
    border-color: var(--primary)
}

.agent-betting-bonus .packages-list .check {
    border-color: #e7e7e7
}

.agent-betting-bonus .packages-list.active .check {
    border-color: var(--primary)
}

.agent-betting-bonus .packages-list.active .check:before {
    background-color: var(--primary);
    border-radius: 50%;
    content: "";
    height: 11px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 11px
}

.agent-betting-bonus .packages-content {
    background-color: #fce5e5
}

.agent-betting-bonus .packages-content .list-decimal .text {
    color: #000
}

.agent-bonus-overview .bg-reward-info {
    background: #ededed
}

.agent-bonus-overview .agent-info-amount {
    color: #000
}

.agent-bonus-overview .agent-info-faq {
    background-color: #f7f7f7
}

.agent-overview-entry {
    background: var(--bg-main);
    border-radius: 5px;
    color: var(--text-base)
}

.agent-overview-content {
    transition: opacity .5s ease-in
}

.content-transition {
    transition: opacity .2s ease-out .2s
}

.agent-invite-bg {
    border-bottom: 1px solid #eee
}

.downline-table .table-head {
    background-color: var(--primary)
}

.downline-table .table-body .content {
    justify-content: flex-end;
    margin: 10px 0
}

.downline-table .table-body .content-list {
    padding: 15px 0;
    position: relative
}

.downline-table .table-body .loop-list.parent .content-list {
    background-color: var(--content-light-2)
}

.downline-table .table-body .loop-list.child .content-list {
    background-color: #fafafc
}

.downline-table .table-body .loop-list {
    position: relative
}

.downline-table .table-body .loop-list:not(.parent) .content-list:first-child:after,
.downline-table .table-body .loop-list:not(.parent):before {
    background-color: #ddd
}

.downline-table.mobile .table-body .more-details {
    color: #917f15
}

.downline-table.mobile .table-body .content-list {
    padding: 10px 0
}

@media (max-width:1279px) {
    .downline-table .table-body .loop-list:not(.parent):before {
        height: calc(100% + 44px) !important
    }

    .downline-table .table-body .loop-list.child:last-child:before {
        height: 34px !important
    }
}

.agent-td-status .completed {
    background-color: #d7f7db;
    color: var(--status-green)
}

.agent-td-status .pending {
    background-color: #bee3ff;
    color: var(--status-blue)
}

.btn-container.partnership,
.mobile-partnership-header {
    color: #fff !important
}

.select-search-input {
    background: transparent !important
}

.header-border,
.play-top-bar {
    background: var(--header-bg)
}

.back-ground {
    position: relative
}

.video-background {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0
}

.MYR .video-background,
.SGD .video-background {
    display: none
}

.telegram_line {
    background: #d6d6d6 !important
}

.redeemBanner {
    background-color: var(--secondary) !important
}

.redeemBanner span {
    color: #000
}

.redeemBanner button {
    background-color: #fff !important
}

.topbar_menu_dropdown_item {
    color: #fff !important
}

.topbar_menu_dropdown_item.router-link-active {
    background-color: transparent !important;
    color: var(--secondary) !important
}

.bottom-footer {
    background: var(--footer-bottom-color);
    color: #000
}

.cat-btn-container {
    background: var(--content-light);
    border-color: #27272a
}

.o-checkbox.checked {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important
}

.leaderboard_left_bar {
    background: var(--content)
}

.leaderboard_left_bar_btn_active {
    background: #1c1c1c
}

.leaderboard_left_bar_btn {
    background: transparent;
    color: var(--text-light)
}

.leaderboard-timer-container {
    background: #4c4c4c
}

.leaderboard-coming-soon,
.leaderboard-date-types,
.leaderboard-reawrd-container,
.leaderboard-table-container {
    background: var(--content)
}

.leaderboard-date-types {
    border-bottom: 1px solid #d6d6d6
}

.leaderboard-coming-soon,
.leaderboard-cycle-btn {
    color: var(--text-light) !important
}

.leaderboard-table .head .tr {
    background: #ebebeb !important;
    color: #000 !important
}

.leaderboard-table .body .td:first-child {
    color: var(--primary) !important
}

.leaderboard-reawrd-container {
    background: #000;
    color: #ffcd57
}

.leaderboard-ranking-text {
    color: #fff
}

.leaderboard-table .body .td {
    color: #000 !important
}

.leaderboard-table .body .tr:nth-child(odd) {
    background: #ebebeb !important
}

.leaderboard-table .body .tr:nth-child(2n) {
    background: #fff !important
}

.leaderboard-table .body .tr.rank-1 {
    background: linear-gradient(270deg, #da0, #dd7f00) !important
}

.leaderboard-table .body .tr.rank-2 {
    background: linear-gradient(270deg, #a3a3a3, #3c4852) !important
}

.leaderboard-table .body .tr.rank-3 {
    background: linear-gradient(270deg, #aa7249, #503618) !important
}

.leaderboard-table .body .tr.rank-1 .td,
.leaderboard-table .body .tr.rank-2 .td,
.leaderboard-table .body .tr.rank-3 .td {
    color: #fff !important
}

.leaderboard_underline {
    background-color: var(--secondary)
}

.actual-amount .bg-inp-disabled2,
.withdrawal-summary-wd-amt-note-text {
    color: var(--primary)
}

.state-adjustment .user-table th {
    border: 1px solid var(--line)
}

.security-svg .shine path {
    fill: var(--secondary)
}

.security-svg .light path {
    fill: #cdcdcd
}

.bg-inp-disabled .o-input-wrapper .o-input {
    background-color: var(--o-disabled)
}

.mission-row,
.promo-card {
    background-color: var(--content-light);
    border: 1px solid var(--line);
    border-radius: 20px;
    box-shadow: unset
}

@media (max-width:480px) {

    .mission-row,
    .promo-card {
        border-radius: 5px
    }
}

.promo-card .promo-card-claim-btn {
    background: var(--secondary) !important;
    color: var(--content) !important
}

.mobile-menu-nav .bg {
    background: var(--menu-nav-bg)
}

.calendar-menu.block {
    background-color: #0e0e11
}

.sidepanel-header-bg {
    background: var(--sidepanel-header-bg);
    margin: -20px -10px 20px
}

.sidepanel-header-bg .close_btn {
    top: 16px !important
}

.mobile .vip-box {
    background: var(--content)
}

.mobile .vip-cat-bg {
    background: var(--content-light);
    border: 1px solid var(--line);
    border-radius: 6px
}

.withdrawal_turnover_box {
    background: #2e344f;
    border: 1px solid #505675;
    border-radius: 10px
}

.withdrawal_turnover_box .bg-content-light-2 {
    background: #3c4363;
    border: 1px solid #505675;
    border-radius: 0 0 10px 10px;
    color: #f4f4f5
}

.leaderboard_left_bar_mobile {
    background: #242a42;
    border-bottom: 1px solid var(--line)
}

.game-slide {
    display: flex;
    flex-direction: column;
    font-size: 16px;
    gap: .75rem;
    max-width: 105px;
    width: 50%
}

@media screen and (min-width:768px) {
    .game-slide {
        max-width: 160px;
        width: calc(33.33333% - 8px)
    }
}

@media screen and (min-width:1024px) {
    .game-slide {
        width: calc(20% - 9.6px)
    }
}

@media screen and (min-width:1200px) {
    .game-slide {
        width: calc(16.66667% - 10px)
    }
}

@media (max-width:767px) {
    .game-slide {
        font-size: 12px;
        max-width: 100px
    }

    .home-section-title {
        font-size: 12px !important
    }

    .staging .game-slide {
        max-width: 105px
    }
}

.game_container_game_btn {
    border-radius: 16px;
    cursor: pointer;
    padding-top: 0 !important;
    position: relative;
    transition: all .3s;
    -o-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    width: 100%
}

.game_container_game_btn.maintenance {
    pointer-events: none
}

.game_container_game_btn.is_rtp {
    margin-bottom: 80px
}

.rtp_box {
    align-items: center;
    background: #1470ed;
    border-radius: 10px;
    bottom: -80px;
    color: #fff;
    display: flex;
    font-size: 12px;
    font-weight: 700;
    height: 25px;
    justify-content: center;
    left: 0;
    padding: 5px 10px;
    position: absolute;
    white-space: nowrap;
    width: 100px
}

.game_container_game_img {
    height: 100%;
    left: 50%;
    max-width: unset;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%)
}

.game_container_game_tag_icon {
    border-top-left-radius: 100%;
    bottom: 0;
    height: 50px;
    position: absolute;
    right: 0;
    width: 50px;
    z-index: 1
}

.game_container_game_tag_icon.hot {
    background: #534323
}

.game_container_game_tag_icon.new {
    background: #254b20
}

.game_container_game_tag_icon img {
    bottom: 5px;
    position: absolute;
    right: 5px;
    width: 35px
}

.game_container_game_btn_content {
    background: rgba(0, 0, 0, .6);
    border-radius: 10px;
    height: calc(100% + 30px);
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: translate(-50%);
    transition: all .3s;
    width: 100%
}

@media screen and (min-width:768px) {
    .isDesktop .game_container_game_btn:hover {
        opacity: .5
    }

    .isDesktop .game_container_game_btn:hover .game_container_game_btn_content {
        opacity: 1
    }
}

.game_container_game_btn_play {
    background: #048704;
    border-radius: 50px;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    left: 50%;
    padding: 0 20px;
    position: absolute;
    text-transform: uppercase;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: all .3s
}

.isDesktop .game_container_game_btn:hover .game_container_game_btn_play {
    transform: translate(-50%, -50%) scale(1)
}

.game_container_game_btn_name {
    background: var(--content);
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    bottom: -30px;
    height: 30px;
    left: 50%;
    overflow: hidden;
    padding: 5px 10px;
    text-overflow: ellipsis;
    transform: translate(-50%);
    white-space: nowrap;
    width: 100%
}

.game_container_game_btn_name,
.game_container_tag {
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    position: absolute
}

.game_container_tag {
    border-radius: 10px;
    left: 5px;
    padding: 2px 5px;
    top: -5px;
    z-index: 1
}

.game_container_tag.new {
    background: linear-gradient(180deg, #4dd86e, #208113)
}

.game_container_tag.hot {
    background: linear-gradient(180deg, #e25e4d, #d14444)
}

.btn_more,
.game-icon {
    color: #fff
}

.btn_more {
    background: var(--bg-main);
    border-radius: 10px;
    display: inline-block;
    font-size: 14px;
    min-width: 100px;
    padding: 10px;
    text-align: center
}

@media (max-width:767px) {
    .btn_more {
        border-radius: 8px;
        min-width: 60px;
        padding: 5px
    }
}

.lang_modal {
    background-color: #0a0a0a;
    border-radius: 20px
}

@media (max-width:767px) {
    .lang_modal {
        height: var(--window-height)
    }
}

.top_lang_modal svg {
    fill: #d4d4d8;
    width: 25px
}

.lang_modal .top_lang_modal {
    border-bottom-color: var(--line)
}

.lang_modal .title_lang_modal {
    color: var(--text-base)
}

.lang_modal .list_lang_modal {
    border-bottom-color: var(--line)
}

.lang_modal .text_symbol_currency {
    color: var(--text-base)
}

.lang_modal .list_languages {
    border-color: var(--line);
    color: var(--text-base)
}

.lang_modal .list_languages.active {
    background: #f7a41b 0 0 no-repeat padding-box;
    border-color: transparent;
    color: #0a0a0a;
    padding: 11px 6px
}

.sidebar_icon_content {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    width: 100%
}

.sidebar_icon_content_text {
    color: #fff;
    font-size: 11px;
    line-height: 11px;
    margin-top: 8px
}

.sidebar_button .sidebar_icon_content .sidebar_icon_content_icon {
    color: #fff !important
}

.sidebar_button.active .sidebar_icon_content .sidebar_icon_content_icon,
.sidebar_button.active .sidebar_icon_content .sidebar_icon_content_text {
    color: var(--content) !important
}

.home-credit-balance {
    font-size: 16px !important
}

.auth-logo-skeleton-size {
    padding-top: 41.66667%
}

.auth-logo-set {
    height: 50px;
    width: 150px
}

.auth-logo {
    background-image: url(/logo-dark.png?v=5);
    background-position: 0;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    height: 100%;
    padding-top: 41.66667%;
    width: 100%
}

.sidebar-auth.auth-logo-set {
    height: 40px;
    width: 95px
}

.sidebar-auth .auth-logo {
    background-image: url(/logo-light.png?v=5)
}

.announcement_content {
    all: revert !important;
    line-height: 2rem !important
}

.announcement_content>menu,
.announcement_content>ol,
.announcement_content>ul {
    list-style: disc;
    margin: 0;
    padding: 0 2rem
}

.announcement_content>p {
    margin: 1rem 0
}

.MYR .promotions_bg,
.SGD .promotions_bg {
    background-image: url(/aw8/img/promotion_bg_sgd_myr.webp) !important
}

.game-list-icon {
    background: var(--secondary);
    border-color: #fff
}

.tutorial .swiper-pagination {
    background: rgba(0, 0, 0, .5);
    padding: 3px !important
}

.tutorial .swiper-pagination-bullet,
.tutorial .swiper-pagination-bullet-active {
    padding: 7px 0 !important;
    width: 140px !important
}

.tutorial .swiper-pagination-bullet-active {
    background-color: var(--primary) !important
}

@media (max-width:766px) {
    .tutorial .swiper-pagination {
        bottom: 185px !important;
        margin: 0 20px;
        width: 330px !important
    }

    .tutorial .swiper-pagination-bullet,
    .tutorial .swiper-pagination-bullet-active {
        height: 100% !important;
        margin: 0 !important;
        padding: 7px 0 !important;
        width: 160px !important
    }
}

.tutorial .swiper-pagination {
    background: #000;
    border-radius: 25px;
    bottom: 75% !important;
    display: flex;
    left: 18% !important;
    padding: 0 !important;
    transform: translate(-50%, -50%)
}

.tutorial .swiper-pagination-bullet,
.tutorial .swiper-pagination-bullet-active {
    align-items: center;
    background-color: #ffffff08;
    border-radius: 25px;
    color: #fff;
    display: flex;
    font-size: 13px;
    height: 100% !important;
    justify-content: center;
    margin: 0 !important;
    opacity: 1;
    padding: 10px 0 !important;
    text-align: center;
    width: 175px !important
}

.tutorial .swiper-pagination-bullet-active {
    background-color: #7e0000 !important;
    color: #fff
}

@media (max-width:766px) {
    .tutorial .swiper-pagination {
        bottom: 82% !important;
        display: flex !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 325px !important
    }

    .tutorial .swiper-pagination-bullet,
    .tutorial .swiper-pagination-bullet-active {
        height: 100% !important;
        margin: 0 !important;
        width: 159px !important
    }
}

@media (max-width:1000px) {

    .tutorial .swiper-pagination-bullet,
    .tutorial .swiper-pagination-bullet-active {
        width: 145px
    }

    .mySwiper .swiper-horizontal>.swiper-pagination-bullets,
    .mySwiper .swiper-pagination-bullets.swiper-pagination-horizontal,
    .mySwiper .swiper-pagination-custom,
    .mySwiper .swiper-pagination-fraction {
        position: relative;
        top: 20px;
        width: 100%
    }
}

.better-choice-text {
    color: var(--text-base)
}

.deposit_information_box {
    background: #18181b;
    border: 1px solid #27272a;
    padding: 8px 10px
}

.deposit_information_title {
    font-weight: 700
}

.deposit_information_content_label {
    color: #f4f4f5
}

.deposit_information_content_line {
    height: 1px;
    margin: 10px 0;
    width: 100%
}

.deposit_information_content_display .text {
    color: #a1a1a9
}

.deposit_copy_btn {
    background: var(--primary);
    padding: 2px 5px
}

.deposit_copy_btn .text {
    color: #fff;
    font-size: 10px
}

.deposit_copy_btn .icon {
    color: #fff;
    width: 12px
}

.deposit_label_primary {
    color: #a1a1a9;
    font-weight: 400
}

.deposit_channel_button.active .deposit_channel_circle {
    border: 1px solid #55a5ff
}

.deposit_channel_button.active .deposit_channel_circle_inner {
    background: #55a5ff
}

.deposit_channel_button.active .deposit_channel_text {
    color: #f4f4f5
}

.deposit_channel_button .deposit_channel_text {
    font-size: 14px
}

.select_bank_button {
    align-items: flex-end;
    background: #132358;
    border-radius: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
    overflow: hidden
}

.select_bank_button.active {
    border: 1px solid #69a3fb
}

.select_bank_button.active .processing-fee-box {
    background: var(--primary);
    color: #fff;
    transition: all .3s
}

.select_bank_button_circle {
    z-index: 1
}

.select_bank_button.active .select_bank_button_circle {
    border: 1px solid #55a5ff
}

.select_bank_button.active .select_bank_button_circle_inner {
    background: #55a5ff
}

@media (max-width:767px) {
    .select_bank_button_circle {
        height: 10px;
        right: 2px;
        top: 2px;
        width: 10px
    }

    .select_bank_button_circle_inner {
        height: 5px;
        width: 5px
    }

    .bg-deposit-preset-box .deposit_amount_circle {
        right: 2px !important;
        top: 2px !important
    }
}

.select_bank_button {
    padding-top: 66.66667%
}

.isTelco .select_bank_image {
    padding-top: 40%
}

.upload_receipt_button {
    background: #18181b;
    border: 1px solid #272729
}

.upload_receipt_button_container {
    width: 100%
}

.upload_receipt_plus {
    background: #27272a;
    border: 1px solid #52525b
}

.upload_receipt_box_note_text {
    color: #ababab
}

.upload_receipt_note_special {
    color: var(--text-base)
}

.bg-deposit-preset-box .deposit_amount_circle .deposit_amount_circle_inner {
    background: #2e344f;
    height: 9px;
    width: 9px
}

.bg-deposit-preset-box.active .deposit_amount_circle .deposit_amount_circle_inner {
    background: #69a3fd
}

.bg-deposit-preset-box .deposit_amount_circle {
    background: #2e344f;
    border: .5px solid #3c4363;
    height: 15px;
    width: 15px
}

.register_heading {
    color: #fff;
    font-size: 38px;
    font-weight: 700;
    margin-bottom: 8px
}

.register_heading .register_highlight {
    color: #fff;
    text-transform: uppercase
}

.how-to-register-bg {
    background-image: url(/aw8/img/how-to-register-bg.webp);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 12px;
    height: 400px;
    padding: 24px
}

.register-btn {
    background: url(/aw8/img/btn-register-bg.webp);
    background-position: 50%;
    background-size: cover;
    border: none;
    color: #252525;
    cursor: pointer;
    font-size: 14px;
    height: 48px;
    padding: 0;
    width: 140px
}

.auth-check path {
    fill: #fff
}

.auth-check g {
    fill: green
}

.sign_in_task_promotion_detail {
    margin-bottom: 10px;
    width: 100%
}

.sign_in_task_promotion_header {
    background-color: var(--secondary);
    border-radius: 8px 8px 0 0;
    display: flex;
    justify-content: space-evenly;
    padding: 4px;
    position: relative
}

.sign_in_task_promotion_item {
    color: var(--content);
    display: flex;
    flex-direction: column;
    gap: 8px;
    text-align: center
}

.sign_in_task_separator {
    background: var(--text-base);
    border-right: 1px solid var(--content);
    height: 80%;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%)
}

.sign_in_task_promotion_info {
    border: 1px solid var(--secondary);
    border-radius: 0 0 8px 8px;
    display: flex;
    flex-direction: column;
    padding: 20px
}

.sign_in_task_info_right {
    background: var(--content-light);
    border-radius: 4px;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 16px 20px
}

.info_label {
    color: var(--text-base)
}

.info_value {
    color: var(--primary);
    font-weight: 700;
    white-space: nowrap
}

.daily_check_in_promotion {
    border: 1px solid var(--secondary);
    border-radius: 10px;
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, 1fr);
    padding: 10px
}

.daily_check_in_promotion_box {
    align-items: center;
    background: var(--content-light);
    border-radius: 10px;
    display: flex;
    justify-content: center;
    padding: 10px
}

.promotion_day_info {
    color: var(--primary);
    text-align: center
}

.promotion_day_info_mobile {
    align-items: center;
    color: var(--primary);
    display: flex;
    justify-content: center
}

.mission_content {
    color: var(--text-light)
}

.icon-daily-check-in-promo .path1:before {
    color: var(--secondary) !important;
    opacity: .5 !important
}

.icon-daily-check-in-promo .path2:before {
    color: var(--secondary) !important
}

.selection-promo.active {
    color: var(--primary)
}

.sign_in_turnover_deposit_text {
    color: #fff;
    font-weight: 700
}

.sign_in_today_text {
    color: #757575;
    font-size: 12px
}

.sign-in-task-header {
    min-height: 35px;
    min-width: 110px;
    text-transform: uppercase
}

.sign-in-task-header.active {
    border-bottom: 2px solid var(--secondary);
    color: var(--text-light)
}

.btn.claim-disabled {
    background: #757575b3;
    color: #fff;
    overflow: hidden;
    position: relative;
    transition: all .3s
}

.sign-in-task-tooltip {
    background: #d6d6d6
}

@media screen and (max-width:767px) {
    .sign-in-task-tooltip {
        background: #fff
    }
}

.reward-center-text {
    color: #000;
    color: var(--text-base);
    font-size: 18px;
    font-weight: 400
}

@media screen and (max-width:767px) {
    .reward-center-text {
        font-size: 15px
    }
}

.reward-center-container {
    display: grid;
    gap: 10px
}

.reward-option-container {
    background-color: var(--content-light) !important;
    border: 1px solid var(--line)
}

.rebate-option-container,
.reward-option-container {
    align-items: center;
    display: flex;
    justify-content: space-between
}

.rebate-option-container {
    background: url(../img/rebate_bg_dark.webp);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border: 1px solid #5f5f5f
}

.rebate-text {
    color: var(--text-base)
}

.reward-center {
    background: linear-gradient(180deg, #ffefe6, #fcdecf);
    border: 1px solid #ffd7c3
}

.reward-notification-count {
    background: linear-gradient(180deg, #ff6060, #a70000);
    border-radius: 100%;
    color: #fff;
    font-size: 12px;
    padding: 4px 10px
}

.reward-center-share-text {
    color: #fff;
    font-size: 8px
}

.rebate-share-container:after {
    background-color: #7b7b7b1a;
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    content: "";
    height: 6px;
    left: .8rem;
    position: absolute;
    top: 100%;
    width: 6px
}

.rebate-share-container {
    align-items: flex-start;
    background-color: #7b7b7b1a;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    margin-bottom: 4px;
    min-width: 50px;
    padding: 3px 0 0 2px;
    position: relative
}

.reward-center-img-container {
    align-items: center;
    display: flex;
    height: 40px;
    justify-content: center;
    width: 40px
}

@media (max-width:767px) {
    .reward-center-img-container {
        height: 35px;
        width: 35px
    }
}

.animate-angpow,
.animate-bonus {
    animation: bounce 1.5s ease-in-out infinite
}

@keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    to {
        transform: translateY(0)
    }

    40% {
        transform: translateY(-10px)
    }

    60% {
        transform: translateY(-10px)
    }
}

.animate-rebate,
.animate-vip {
    animation: rotate 1.5s ease-in-out infinite
}

@keyframes rotate {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(1turn)
    }
}

.animate-invite_friends {
    animation: rubberband 1s infinite;
    display: inline-block
}

@keyframes rubberband {
    0% {
        transform: scale(1)
    }

    30% {
        transform: scale(1.25, .75)
    }

    40% {
        transform: scale(.75, 1.25)
    }

    50% {
        transform: scale(1.15, .85)
    }

    65% {
        transform: scale(.95, 1.05)
    }

    75% {
        transform: scale(1.05, .95)
    }

    to {
        transform: scale(1)
    }
}

.animate-mission_diary {
    animation: headshake 1s ease-in-out infinite;
    display: inline-block
}

@keyframes headshake {
    0% {
        transform: translate(0)
    }

    6.5% {
        transform: translate(-6px) rotateY(-9deg)
    }

    18.5% {
        transform: translate(5px) rotateY(7deg)
    }

    31.5% {
        transform: translate(-3px) rotateY(-5deg)
    }

    43.5% {
        transform: translate(2px) rotateY(3deg)
    }

    50% {
        transform: translate(0)
    }
}

.animate-lucky_spin {
    animation: tada 1.5s ease-in-out infinite;
    display: inline-block
}

@keyframes tada {
    0% {
        transform: scale(1) rotate(0)
    }

    10%,
    20% {
        transform: scale(.9) rotate(-3deg)
    }

    30%,
    50%,
    70%,
    90% {
        transform: scale(1.1) rotate(3deg)
    }

    40%,
    60%,
    80% {
        transform: scale(1.1) rotate(-3deg)
    }

    to {
        transform: scale(1) rotate(0)
    }
}

.animate-sign_in_task {
    animation: swing 2s ease-in-out infinite;
    display: inline-block;
    transform-origin: top center
}

@keyframes swing {
    0% {
        transform: rotate(0)
    }

    20% {
        transform: rotate(15deg)
    }

    40% {
        transform: rotate(-10deg)
    }

    60% {
        transform: rotate(5deg)
    }

    80% {
        transform: rotate(-5deg)
    }

    to {
        transform: rotate(0)
    }
}

.cashback-content.html-content-wrapper table {
    max-width: -moz-fit-content !important;
    max-width: fit-content !important;
    text-align: center
}

@media (max-width:767px) {
    .cashback-content.html-content-wrapper table {
        min-width: 325px
    }
}

@media (min-width:1024px) {
    .cashback-content.html-content-wrapper table {
        min-width: 900px
    }
}

.cashback-content.html-content-wrapper .org-title {
    text-transform: none
}

.icon-referral:before,
.topbar-referral.icon-referral:before {
    color: var(--secondary) !important
}

.sidebar_button.active {
    background: linear-gradient(to bottom, #ffeba5 0%, #dca245 40%, #a4701e 80%, #f6d365 100%) !important;

}

.sidebar_button_sign {
    border-radius: 5px;
    /* 버튼 배경: 어두운 브라운/블랙 그라데이션 */
    /* 1. 기본 배경색: 아주 깊은 와인색/버건디 */
    background-color: #4a0811;

    /* 2. 벨벳의 부드러운 빛 반사 효과 (중앙이 은은하게 밝음) */
    background-image: radial-gradient(circle at 50% 30%, #8a1c2c 0%, #5c0e18 50%, #3d060d 100%) !important;
    /* 버튼 테두리: 밝은 브라운 */
    border: 1px solid #e6c57a;
    box-shadow:
        0 0 0 1px #3a2a11,
        /* 가장 바깥쪽 얇은 어두운 선 */
        inset 0 0 1px 1px #fff3b3,
        /* 테두리 안쪽 빛나는 효과 */
        inset 0 0 1px 1px #000,
        /* 버튼 가장자리 어둡게 (비네팅) */
        0 10px 15px rgba(0, 0, 0, 0.8);
    /* 버튼 전체 그림자 */
    padding: 5px 10px !important;
    font-size: 14px !important;

}

.sidebar_button {
    border-radius: 5px;
    /* 버튼 배경: 어두운 브라운/블랙 그라데이션 */
    /* 1. 기본 배경색: 아주 깊은 와인색/버건디 */
    background-color: #4a0811;

    /* 2. 벨벳의 부드러운 빛 반사 효과 (중앙이 은은하게 밝음) */
    background-image: radial-gradient(circle at 50% 30%, #8a1c2c 0%, #5c0e18 50%, #3d060d 100%) !important;
    /* 버튼 테두리: 밝은 브라운 */
    border: 1px solid #e6c57a;
    box-shadow:
        0 0 0 1px #3a2a11,
        /* 가장 바깥쪽 얇은 어두운 선 */
        inset 0 0 1px 1px #fff3b3,
        /* 테두리 안쪽 빛나는 효과 */
        inset 0 0 1px 1px #000,
        /* 버튼 가장자리 어둡게 (비네팅) */
        0 10px 15px rgba(0, 0, 0, 0.8);
    /* 버튼 전체 그림자 */

}

.sidebar_button_text {

    font-family: 'Georgia', 'Times New Roman', serif;
    /* 클래식한 세리프 폰트 */
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    line-height: 1.2;
    margin: 0;

    /* 텍스트 골드 그라데이션 */
    background: linear-gradient(to bottom, #ffeba5 0%, #dca245 40%, #a4701e 80%, #f6d365 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;

    /* text-shadow 대신 filter를 써야 그라데이션 텍스트에 그림자가 예쁘게 들어갑니다 */
    filter: drop-shadow(1px 2px 2px rgba(0, 0, 0, 0.9)) !important;

}

.sidebar_container .sidebar_button {
    background: unset !important;
    border: none
}

.reg-log-modal {
    background-color: #0a0a0a !important;
    border-radius: 20px
}

@media (max-width:768px) {
    .reg-log-modal {
        border-radius: 0;
        height: 100%
    }
}

.reg-tab-container {
    border: 1px solid var(--line)
}

.log-tab-container,
.reg-tab-container {
    background-color: transparent;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 240px
}

.log-tab-container {
    border: 1px solid #303030;
    margin: 0 auto
}

.log-tab-container button,
.reg-tab-container button {
    align-items: center;
    border-radius: 30px;
    color: var(--text-light);
    display: flex;
    font-size: 13.5px;
    font-weight: 600;
    gap: 6px;
    justify-content: center;
    padding: .5rem .35rem;
    text-transform: uppercase;
    text-transform: capitalize;
    width: 100%
}

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

    .log-tab-container button,
    .reg-tab-container button {
        font-size: 16px;
        font-weight: 600;
        text-transform: capitalize
    }
}

.log-tab-container button i,
.reg-tab-container button i {
    font-size: 13.5px
}

.log-tab-container button.active,
.reg-tab-container button.active {
    background: #f7a41b 0 0 no-repeat padding-box;
    border: 1px solid #142257;
    color: #0a0a0a
}

.log-tab-container button.active i:before,
.reg-tab-container button.active i:before {
    color: #0a0a0a
}

.new-reg-input-wrapper {
    position: relative
}

.new-reg-input-wrapper i {
    left: 14px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.new-reg-input-wrapper i .star-danger {
    color: var(--danger);
    content: "*";
    font-size: 14px;
    position: absolute;
    right: -6px;
    top: 0;
    top: -6px
}

.new-reg-input-wrapper i:before {
    color: #a1a1a9
}

.new-reg-input-wrapper input:not(.otp-input) {
    padding-left: 40px !important
}

.new-referral_arrow {
    color: #fff;
    height: 15px;
    width: 15px
}

.new-referral_arrow path {
    fill: #888 !important
}

.ref-toggle-button:before {
    background-color: var(--content-light);
    bottom: -1px;
    content: "";
    height: 4px;
    left: .5px;
    position: absolute;
    width: 99.5%;
    z-index: 10
}

.register-home-staging {
    background-color: unset !important;
    border-color: var(--primary) !important;
    color: #fff !important
}

.mobile-big .o-phone-select {
    background: #121212;
    border: 1px solid #303030;
    border-radius: 6px;
    font-size: 12px;
    height: 44px;
    margin-right: 10px;
    padding: 7px 10px 6px 0 !important
}

.auth-input.mobile-big.staging {
    padding-left: 12px !important
}

.forgot-otp-sent-text {
    color: var(--danger);
    font-size: 16px;
    font-weight: 500;
    margin: 14px 0;
    text-align: center
}

.new_btn_modal_forgot_password {
    color: var(--text-light)
}

.modal_title.modal-title-login {
    color: var(--text-base);
    font-size: 20px;
    font-weight: 700;
    text-align: center
}

.otp-input-staging {
    background-color: var(--content-lighter) !important;
    border: none
}

.o-input-wrapper .o-icon.password_icon {
    right: 50px !important
}

.new-reg-input-wrapper:has(.password_icon) .password_icon:has(div.ml-2) {
    display: inline-flex
}

.new-reg-input-wrapper:has(.password_icon) .password_icon:has(div.ml-2) div {
    right: -40px !important
}

.auth-header-text-new {
    color: var(--text-base)
}

.affiliate_close svg path {
    fill: var(--text-base) !important
}

.aw8-tutorial-main-content {
    background: url(/aw8/img/aw8-tutorial-slider-bg.webp) no-repeat 0;
    background-size: cover;
    height: 320px;
    padding: 1rem
}

.aw8-tutorial-box {
    background: none
}

.download-page-web-bg {
    background-image: url(/aw8/img/download_page/web_bg.webp);
    background-position: 60%;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    width: 100%
}

.THB .download-page-web-bg {
    background-image: url(/aw8/img/download_page/new_web_bg.webp) !important
}

.THB[lang=th] .download-page-web-bg {
    background-image: url(/aw8/img/download_page/new_web_bg_thb.webp) !important
}

@media screen and (max-width:1400px) {
    .download-page-web-bg {
        background-position: 70%
    }
}

.download-page-mobile-bg {
    background-image: url(/aw8/img/download_page/mobile_bg.webp);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    width: 100%
}

.THB .download-page-mobile-bg {
    background-image: url(/aw8/img/download_page/new_mobile_bg.webp) !important
}

.THB[lang=th] .download-page-mobile-bg {
    background-image: url(/aw8/img/download_page/new_mobile_bg_thb.webp) !important
}

.statement-reward .user-table {
    text-align: left
}

.k-input {
    border-radius: 6px !important;
    height: 44px
}

.k-select {
    padding-bottom: .25rem !important;
    padding-top: .25rem !important
}

.o-select-container .mobile-code-font {
    font-size: 16px
}

.new-reg-social-btn {
    border: 1px solid var(--line) !important;
    border-radius: 30px !important
}

.vip-card .vipSwiper .swiper-button-prev,
.vip-card .vipSwiper .swiper-rtl .swiper-button-next {
    left: -40px !important
}

.vip-card .vipSwiper .swiper-button-next,
.vip-card .vipSwiper .swiper-rtl .swiper-button-prev {
    right: -40px !important
}

@media (max-width:767px) {
    .vip-card .swiper {
        max-width: 350px !important
    }

    .vip-card .vipSwiper .swiper-button-prev,
    .vip-card .vipSwiper .swiper-rtl .swiper-button-next {
        left: 5px !important
    }

    .vip-card .vipSwiper .swiper-button-next,
    .vip-card .vipSwiper .swiper-rtl .swiper-button-prev {
        right: 5px !important
    }

    .vip-card .vipSwiper .swiper-button-next:after,
    .vip-card .vipSwiper .swiper-button-prev:after {
        font-size: 12px !important
    }
}

.vip-card .vipSwiper .swiper-button-next:after,
.vip-card .vipSwiper .swiper-button-prev:after {
    background-color: #fff;
    border: 1px solid #d3d3d3;
    border-radius: 100%;
    color: #d3d3d3;
    font-size: 18px;
    padding: 6px 10px
}

.swiper-3d .swiper-slide-shadow {
    background: unset !important
}

.live_btn_left svg,
.live_btn_right svg {
    width: 15px
}

.live_btn_left svg path,
.live_btn_right svg path {
    fill: #000
}

.footer {
    background: #0a0a0a;
    position: relative
}

.footer_content_1 {
    margin-top: 20px
}

.footer_label {
    color: var(--text-base);
    font-size: 12px;
    font-weight: 700
}

.footer_content {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px
}

.footer_content_1 .footer_label {
    text-align: center
}

.footer_content_1 .footer_content {
    justify-content: center
}

.footer_content_2 {
    margin-top: 20px
}

.footer_content_2 .footer_label {
    text-align: center
}

.footer_content_2 .footer_content {
    justify-content: center
}

.footer_line {
    background: #3c4363;
    height: 1px;
    margin: 20px 0;
    width: 100%
}

.footer_content_3 {
    align-items: flex-start;
    display: flex;
    flex-wrap: nowrap;
    gap: 20px;
    justify-content: space-between
}

.footer_logo {
    width: 120px
}

.page_container {
    margin: 0 auto;
    max-width: 1500px;
    width: 95%
}

.footer_link {
    color: var(--text-base) !important;
    font-size: 14px;
    font-weight: 400
}

.footer_copy_right {
    color: var(--text-base);
    font-size: 14px;
    font-weight: 400
}

@media (max-width:767px) {
    .footer_link_box {
        padding-left: 30px;
        width: calc(100% - 120px)
    }

    .footer_content_3_box_1,
    .footer_content_3_box_2 {
        margin-top: 20px;
        width: 50%
    }
}

@media (max-width:450px) {
    .footer_logo {
        width: 100%
    }

    .footer_logo img {
        width: 120px
    }

    .footer_link_box {
        margin-top: 30px;
        padding-left: 0;
        width: 100%
    }

    .footer_content_3_box_1,
    .footer_content_3_box_2 {
        width: 100%
    }
}

@media (max-width:767px) {
    .footer_link {
        display: block;
        font-size: 12px;
        width: 100%
    }

    .footer_copy_right {
        color: var(--text-base);
        font-size: 10px;
        font-weight: 400
    }

    .footer_content_1 .footer_label {
        text-align: left
    }

    .footer_content_1 .footer_content {
        justify-content: left
    }

    .footer_content_2 .footer_label {
        text-align: left
    }

    .footer_content_2 .footer_content {
        justify-content: left
    }
}

.footer_content_media_button {
    align-items: center;
    display: flex;
    height: 30px;
    justify-content: center;
    width: 30px
}

.provider_box {
    -webkit-user-drag: none;
    background: var(--content-light);
    border: 1px solid var(--line);
    border-radius: 5px;
    flex-shrink: 0;
    height: 80px;
    position: relative;
    transition: all .3s;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    width: 100%
}

@media (max-width:767px) {
    .provider_box {
        height: 50px
    }

    .staging .provider_box {
        height: 40px
    }

    .footer_content_1 {
        margin-top: 5px
    }

    .footer_content_2 {
        margin-top: 10px
    }
}

.isDesktop .provider_box:hover {
    background: #1d47b8
}

.provider_box .default {
    opacity: 1
}

.provider_box .active,
.provider_box .default {
    -webkit-user-drag: none;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    width: 70%
}

.isDesktop .provider_box:hover .default,
.provider_box .active {
    opacity: 0
}

.isDesktop .provider_box:hover .active {
    opacity: 1
}

.game_tab {
    border-radius: 10px;
    overflow: hidden;
    padding-top: 100% !important;
    position: relative;
    width: 100%
}

.first_deposit_container {
    height: 560px;
    margin: 20px 0;
    position: relative
}

.header-content {
    align-items: flex-start;
    display: flex;
    justify-content: space-between
}

.welcome-text {
    color: #f8ae1b;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 4px;
    text-transform: uppercase
}

.main-heading {
    color: #fff;
    font-size: 38px;
    font-weight: 700;
    margin-bottom: 8px
}

.highlight {
    color: #f8ae1b
}

.sub-heading {
    color: #fff;
    font-size: 15px
}

.steps-image-container {
    display: flex;
    justify-content: center;
    margin-top: 60px;
    text-align: center;
    width: 100%
}

.steps-image {
    max-width: 960px;
    width: 100%
}

.reward-steps-container {
    display: flex;
    gap: 6rem;
    justify-content: center;
    position: relative
}

.reward-box {
    align-items: center;
    background: linear-gradient(0deg, #dea72d 0, #133bba00);
    border-radius: 16px;
    box-shadow: none;
    display: flex;
    height: 300px;
    justify-content: center;
    width: 212px
}

.reward-box.first-step,
.reward-box.third-step {
    margin-top: -48px
}

.reward-box.fourth-step,
.reward-box.second-step {
    margin-top: 8px
}

.reward-content {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px;
    text-align: center
}

.reward-content img {
    height: 100px;
    margin-bottom: 16px;
    width: 100px
}

.step-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 8px
}

.step-description,
.step-title {
    color: var(--text-base) !important
}

.step-description {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 4px
}

@media (max-width:1240px) {
    .steps-image-container {
        margin: 40px 0
    }

    .first_deposit_container {
        height: 540px
    }

    .how-to-register-bg {
        height: 360px;
        padding: 24px
    }

    .steps-image {
        width: 84%
    }

    .reward-box {
        height: 240px
    }

    .reward-content {
        padding: 12px
    }

    .reward-content img {
        height: 80px;
        width: 80px
    }

    .step-title {
        font-size: 19px
    }

    .step-description {
        font-size: 13px;
        line-height: 1.3
    }

    .reward-box.first-step,
    .reward-box.third-step {
        margin-top: -7%
    }

    .reward-box.fourth-step,
    .reward-box.second-step {
        margin-top: -2%
    }
}

@media (max-width:1024px) {
    .steps-image-container {
        margin: 20px 0
    }

    .reward-box {
        height: 200px
    }

    .steps-image {
        width: 84%
    }

    .reward-content {
        padding: 12px
    }

    .reward-content img {
        height: 70px;
        width: 70px
    }

    .step-title {
        font-size: 16px
    }

    .step-description {
        font-size: 12px;
        line-height: 1.3;
        margin-bottom: 4px
    }

    .reward-steps-container {
        gap: 5rem
    }

    .first_deposit_container {
        height: 440px
    }

    .how-to-register-bg {
        height: 300px;
        padding: 24px
    }

    .welcome-text {
        font-size: 16px
    }

    .sub-heading {
        font-size: 14px
    }

    .register_heading {
        font-size: 30px
    }
}

@media (max-width:850px) {
    .first_deposit_container {
        height: 420px
    }

    .reward-content img {
        height: 60px;
        width: 60px
    }

    .step-title {
        font-size: 13px
    }

    .step-description {
        font-size: 12px;
        line-height: 1.3;
        margin-bottom: 4px
    }

    .reward-steps-container {
        gap: 4rem
    }
}

@media (max-width:767px) {
    .first_deposit_container {
        height: 330px
    }

    .reward-box {
        height: 140px
    }

    .reward-content {
        padding: 12px 4px
    }

    .reward-content img {
        height: 55px;
        margin-bottom: 8px;
        width: 55px
    }

    .step-title {
        font-size: 12px
    }

    .step-description {
        font-size: 10px;
        line-height: 1.2;
        margin-bottom: 4px
    }

    .reward-steps-container {
        gap: 4rem
    }

    .how-to-register-bg {
        height: 240px;
        padding: 12px
    }
}

@media (max-width:640px) {
    .first_deposit_container {
        height: 320px
    }

    .steps-image-container {
        margin: 20px 0
    }

    .reward-box {
        height: 140px
    }

    .steps-image {
        width: 84%
    }

    .reward-content {
        padding: 12px 4px
    }

    .reward-content img {
        height: 50px;
        margin-bottom: 4px;
        width: 50px
    }

    .step-title {
        font-size: 12px
    }

    .step-description {
        font-size: 10px;
        line-height: 1.2;
        margin-bottom: 4px
    }

    .reward-steps-container {
        gap: 3rem
    }

    .how-to-register-bg {
        height: 240px;
        padding: 12px
    }

    .sub-heading,
    .welcome-text {
        font-size: 14px
    }

    .register_heading {
        font-size: 24px
    }

    .register-btn {
        height: 38px;
        width: 110px
    }
}

@media (max-width:550px) {
    .reward-steps-container {
        gap: 2.5rem
    }

    .first_deposit_container {
        height: 260px
    }

    .step-title {
        font-size: 9px;
        margin-bottom: 4px
    }

    .step-description {
        font-size: 10px;
        line-height: 1.2;
        margin-bottom: 4px
    }

    .reward-content img {
        height: 40px;
        margin-bottom: 4px;
        width: 40px
    }

    .reward-box {
        height: 120px
    }

    .how-to-register-bg {
        height: 180px;
        padding: 8px
    }

    .welcome-text {
        font-size: 12px;
        margin-bottom: 0
    }

    .sub-heading {
        font-size: 10px
    }

    .register_heading {
        font-size: 16px;
        margin-bottom: 0
    }
}

@media (max-width:480px) {
    .steps-image-container {
        margin: 10px 0
    }

    .reward-box {
        border-radius: 8px !important;
        height: 165px
    }

    .steps-image {
        width: 84%
    }

    .header-content {
        align-items: flex-start;
        display: flex;
        justify-content: space-between
    }

    .reward-content {
        padding: 12px 4px
    }

    .reward-content img {
        height: 40px;
        margin-bottom: 4px;
        width: 40px
    }

    .step-title {
        font-size: 9px
    }

    .step-description {
        font-size: 8px;
        margin-bottom: 4px
    }

    .reward-steps-container {
        gap: .8rem
    }

    .first_deposit_container {
        height: 250px
    }

    .how-to-register-bg {
        height: 150px;
        padding: 8px
    }

    .welcome-text {
        font-size: 12px;
        margin-bottom: 0
    }

    .sub-heading {
        font-size: 10px
    }

    .register_heading {
        font-size: 16px;
        margin-bottom: 0
    }

    .register-btn {
        font-size: 10px;
        height: 26px;
        width: 80px
    }
}

@media (max-width:400px) {
    .steps-image-container {
        margin: 10px 0
    }

    .reward-box {
        height: 110px
    }

    .steps-image {
        width: 84%
    }

    .header-content {
        align-items: flex-start;
        display: flex;
        justify-content: space-between
    }

    .reward-content {
        padding: 10px 4px
    }

    .reward-content img {
        height: 36px;
        margin-bottom: 4px;
        width: 36px
    }

    .step-title {
        font-size: 8px
    }

    .staging .step-title {
        font-size: 10px
    }

    .step-description {
        font-size: 7px;
        margin-bottom: 4px
    }

    .staging .step-description {
        font-size: 8px
    }

    .reward-steps-container {
        gap: .5rem
    }

    .first_deposit_container {
        height: 220px
    }

    .how-to-register-bg {
        height: 140px;
        padding: 8px
    }

    .welcome-text {
        font-size: 12px;
        margin-bottom: 0
    }

    .sub-heading {
        font-size: 10px
    }

    .register_heading {
        font-size: 16px;
        margin-bottom: 0
    }

    .register-btn {
        font-size: 10px;
        height: 26px;
        width: 80px
    }
}

.o-input.mobile-big {
    font-size: 16px !important
}

.verify-mobile-info {
    background: var(--primary);
    color: #fff
}

.custom-gradient {
    background: #fff;
    color: #000
}

@media (max-width:480px) {

    .bank-select .o-select-content,
    .bank-select.o-select-dropdown {
        max-height: 80vh !important
    }

    .o-select-label-container {
        display: none !important
    }
}

.cashback-header {
    min-height: 35px;
    min-width: 110px;
    text-transform: uppercase
}

.cashback-header.active {
    border: 2px solid var(--primary);
    color: var(--primary)
}

.cashback-status-expired,
.cashback-status-rejected {
    background: red;
    border-radius: 5px;
    padding: 8px
}

.cashback-status-pending {
    background: #939698;
    border-radius: 5px;
    padding: 8px
}

.cashback-status-claimed {
    background: #757575;
    border-radius: 5px;
    padding: 8px
}

.cashback-status-claiming {
    background: #fb5e16;
    border-radius: 5px;
    padding: 8px
}

.cashback-sub-header.active {
    border-bottom: 2px solid var(--secondary) !important;
    color: var(--secondary) !important
}

.report-body-content .report-tab-border-r {
    border-right: 1px solid hsla(0, 0%, 100%, .46)
}

.bg-modal.no-announcement-text {
    color: #111
}

.game_tab_arrow {
    fill: var(--content)
}

.header-back-container-mob {
    background: #17002f;
    color: #fff
}

.header-back-container-mob.env-stage-champ191 {
    background: #000
}

.icon-svg-close {
    fill: #fff
}

.lucky-prize-container {
    color: #be5a18
}

.lucky-prize-prize-text,
.winner-box-date,
.winner-box-username-text {
    color: #fff
}

.winner-box-prize-text {
    color: #ffdb00
}

.lucky_desc_box .html-content-wrapper {
    color: #fff
}

.status_box .status-light-text {
    color: #c98dff
}

.status_box .status-white-text {
    color: #fff
}

.promo-center {
    border: 1px solid var(--line) !important
}

.promo-center-legend-item .promo-center-legend-item-icon1 {
    background: #0093ff
}

.promo-center-legend-item .promo-center-legend-item-icon2 {
    background: #00d600
}

.promo-center-legend-item .promo-center-legend-item-icon3 {
    background: #ff0b0b
}

.promo-center .text-start .status-value-text {
    color: var(--secondary) !important
}

.eligible-m-progress {
    background: #d3d3d3
}

.hot-game-margin {
    margin-top: 80px !important
}

.topbar_menu_item {
    color: var(--topbar-text-color) !important
}

.menu-nav-item {
    position: relative
}

.menu-nav-item .super {
    align-items: center;
    background: linear-gradient(180deg, #69a3fa, #35527d);
    border: 1px solid #173998;
    border-radius: 50%;
    bottom: -15px;
    display: flex;
    flex-direction: column;
    height: 70px;
    justify-content: center;
    position: absolute;
    width: 70px
}

.mobile_bottom_menu_btn_icon.is_middle_icon i {
    font-size: 30px;
    height: 35px
}

.isDesktop .o-input:-webkit-autofill:hover,
.o-input:-webkit-autofill,
.o-input:-webkit-autofill:active,
.o-input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--text-base) !important;
    -webkit-box-shadow: 0 0 0 30px var(--o-bg) inset !important
}

.isDesktop input:-webkit-autofill:hover {
    -webkit-box-shadow: 0 0 0 30px var(--o-bg) inset !important
}

.o-input-wrapper.open .o-input,
.o-input.focus,
.o-input:focus {
    border-color: var(--o-border-color)
}

.text-primary,
.text-secondary {
    color: var(--secondary) !important
}

.ref-toggle-button {
    background-color: var(--o-bg)
}

.referral-dropdown-aw8 {
    background: var(--o-bg)
}

.search_input,
.search_input:focus,
.search_input:focus-visible {
    background: var(--content-light);
    border-color: #27272a;
    border-width: 1px
}

.search_icon path {
    fill: var(--content-light);
    stroke: #757575
}

.search_box .clean_search path {
    fill: #757575
}

.active .tab_btn_text {
    color: var(--text-base)
}

.card-content {
    background: #121212 !important;
    border: 1px solid var(--line)
}

.card-header {
    color: var(--text-base) !important
}

.card-description {
    color: #d4d4d8 !important
}

.accredited-by,
.accredited-page-header-2 .text-bottom,
.accredited-page-text-3,
.average-time-container {
    color: var(--text-base) !important
}

.time-data {
    background: var(--text-base) !important;
    height: 70% !important;
    width: 70% !important
}

.time-label,
.time-value {
    color: #173998 !important
}

.am-link {
    color: var(--text-light) !important
}

.am-link.router-link-exact-active,
.am-link:hover {
    color: var(--text-base) !important
}

a .icon-bank-detail {
    color: var(--text-base)
}

.verify-reward-container:after {
    background-color: #132358
}

.btn.cancel {
    background-color: transparent !important;
    border: 1px solid var(--line)
}

.view-btn {
    background-color: var(--secondary) !important;
    border: 1px solid var(--secondary) !important
}

.claim-btn,
.view-btn {
    color: var(--content) !important
}

.claim-btn {
    background: var(--secondary) !important;
    padding: .5rem
}

.leaderboard_left_bar_btn.active {
    color: var(--text-base) !important
}

.leaderboard-cycle-btn.active {
    color: var(--text-light)
}

.bg-black {
    background: var(--content)
}

.o-input-wrapper .o-icon {
    color: var(--text-light)
}

.bg_refer {
    background: linear-gradient(90deg, #f7a41b00, #f7a41b) !important;
    border-radius: 10px !important
}

.bg_lucky_spin,
.bg_mission {
    background: linear-gradient(90deg, #133bba00, #133bba) !important;
    border-radius: 10px !important
}

.topbar_menu_item.router-link-active {
    color: var(--topbar-text-color-active) !important
}

.blog-card-image img {
    border-radius: 20px 20px 0 0
}

.fmodal-overlay {
    background-color: #f4f4f580 !important
}

.reg-log-modal a {
    color: #a1a1a9 !important;
    text-decoration: underline
}

.calendar-content {
    border: none
}

@media (max-width:480px) {
    .aw8-tutorial-main-content {
        height: 159px;
        padding: .2rem
    }

    .aw8-tutorial-main-content .ambassador-img {
        bottom: 0
    }

    .aw8-tutorial-content .text-\[10px\] {
        color: #f7a41b;
        font-size: 6px
    }

    .aw8-tutorial-content .text-\[20px\] {
        font-size: 14px
    }

    .aw8-tutorial-content p {
        font-size: 4px
    }
}

.leaderboard-main-container {
    background: #242424
}

.turnover_entry_more_text {
    color: #838383
}

.current-deposit-same-text,
.current-deposit-text,
.next-deposit-text {
    color: #009d36
}

.vip-content-level-name {
    color: #fff
}

.btn.vip_introduction {
    background: #fbdbcb !important
}

.current-point-text,
.next-level-current-deposit-text,
.vip-card-slider-text,
.vip-current-deposit-text {
    color: #009d36
}

.end-date-text-label,
.start-date-text-label {
    color: #939698
}

.history-modal {
    background: #e4e5e6 !important
}

.history-modal-header-tab,
.history-modal-tabs.active {
    background: #1e1e1e
}

.history-modal-tabs.non-active {
    background: #fff;
    color: #000
}

.even-index-content {
    background: #ccc
}

.league-name-text {
    color: #646464
}

.row-time-left-text {
    background: #646464
}

.history-modal-pagination {
    background: #e4e5e6
}

.history-acknowledge-modal {
    background: #fff
}

.history-acknowledge-modal-login {
    color: #000
}

.predictor-user-info-container {
    border: 1px solid hsla(210, 4%, 90%, .5)
}

.current-prize-pool-header,
.last-updated-on-text {
    color: #fff
}

.leaderboard-table-body.even-index-content,
.leaderboard-table-pagination {
    background: #e4e5e6
}

.prize-duration-content {
    background: #3c3c3c
}

.prediction-overview-body {
    background: #e4e5e6
}

.prediction-leaderboard-ranking-text,
.prediction-login-text,
.prediction-make-predict-text,
.prediction-reg-text {
    color: #646464
}

.predictor-prediction-container {
    background: #e4e5e6
}

@media (min-width:768px) {
    .your-class {
        background-color: #1e1e1e
    }
}

.prediction-header-container {
    color: #fff
}

.ranking-number-container {
    background: #646464;
    color: #fff
}

.prediction-header-container .username-text {
    color: #fff
}

.prediction-my-history-button {
    background: #e4e5e6;
    color: #000
}

.share-btn-container {
    background: #646464;
    color: #fff
}

.prediction-point-container {
    background: #3c3c3c;
    color: #fff
}

.line-border {
    border-color: #fff
}

.user-prize-text {
    color: #fff
}

.duration-container {
    background: #3c3c3c;
    color: #fff
}

.refresh-match-container {
    color: #000
}

.match-container {
    background: #000
}

.match-date-league-name-text {
    color: #fff
}

.match-number-container {
    background: #646464;
    color: #fff
}

.show-kick-off-container.active {
    background: rgba(0, 0, 0, .3)
}

.show-kick-off-container.non-active {
    background: #fff
}

.kick-off-time-container {
    background: #000
}

.prediction-share-link-tab {
    border: 1px solid #000
}

.prediction-modal-body,
.result-modal-table {
    background: #fff
}

.account-name-label,
.bank-account-label,
.bank-branch-label,
.bank-name-label,
.card-name-label,
.cpf-id-label,
.crypto-channel-label,
.id-number-label,
.pay-id-label,
.wallet-address-label {
    color: #939698
}

.account-name-span,
.bank-account-span,
.bank-branch-span,
.bank-name-span,
.card-name-span,
.cpf-id-span,
.crypto-channel-span,
.id-number-span,
.wallet-address-span {
    color: #e94951
}

.bonus-status-text.completed {
    color: #0bb212
}

.bonus-status-text.non-completed {
    color: #ff0b0b
}

.status .qualified {
    background: #3cad00
}

.status .not-qualified {
    background: #d7443e
}

.deposit-qr-bg {
    background: #fff;
    display: inline-block;
    padding: 10px
}

.download-app-button {
    align-items: center;
    background: var(--secondary);
    border: 1px solid var(--secondary);
    border-radius: 5px;
    color: #000;
    display: flex;
    font-size: 14px;
    font-weight: 400;
    gap: 5px;
    justify-content: center;
    line-height: 14px;
    padding: 5px 0;
    width: 100%
}

.download-app-button i {
    font-size: 12px;
    line-height: 12px
}

.download-app-button.isMobile {
    background: unset;
    border: 1px solid #fff;
    color: #fff;
    padding: 5px 10px
}

.qr-referral-container {
    background: #f0f0f0
}

.referral-link-container {
    border-color: #d8d8d8;
    color: #d8d8d8
}

.claim-success-message {
    color: #e3e3e3
}

.full-sign-up-content {
    color: #111
}

.register-quick-arrow-svg.referral_arrow path {
    fill: #757575
}

.email-memo-text,
.full-name-memo-text {
    background: #f4d2d2
}

.bank-info-text,
.email-memo-text {
    color: #111
}

.bank-info-text-value {
    background: #111
}

.congrats-done-text,
.quick-sign-up-text,
.thank-you-register-text {
    color: #111
}

.quick-sign-up-2-text {
    color: var(--primary)
}

.account-question-content,
.back-home-link {
    color: #111
}

.quick-full-name-memo-text {
    background: #f4d2d2;
    color: #111
}

.instant-rebate-claim-content,
.mission-diary-claim-content,
.notification-content {
    background: #ff4f29
}

.online-gambling-exp-text {
    color: #f7a41b
}

.footer-jw8-container {
    background: #000
}

.footer-copyright-date,
.footer-desc-jw8 {
    color: #909090
}

.certification-title,
.gaming-license-title,
.payment-method-title,
.responsible-gaming-title,
.security-title {
    color: #fff
}

.footer-seo-hr {
    border: 1px solid #707070
}

.game-name-text,
.no-games-found-text {
    color: #fff
}

.dropdown-toggle-wrapper {
    background: #272727 !important
}

.topbar-space-container {
    background: #47494b
}

.promo-center-container .in-progress-text {
    color: #0093ff
}

.promo-card .eligible-svg-container {
    background: #00d600
}

.promo-card .in-progress-svg-container,
.promo-card .non-eligible-svg-container {
    background: #ff0b0b
}

.profile-info-list-title {
    color: #939698
}

.angpow-topbar-container {
    background: #000;
    color: #fff
}

.angpow-topbar-container .header_back_btn svg path {
    fill: #fff
}

.angpow-timer-container {
    background: #fcecde;
    border-color: #e5bb93;
    color: #781c1c
}

.angpow-ranking-number-text {
    background: #750f0f;
    color: #f9dfc7
}

.angpow_ranking_font_size {
    color: #750f0f
}

.angpow-html-content-wrapper {
    color: #fff
}

.angpow-reward-month-list-container {
    background: #fff
}

.angpow-footer-copyright-container {
    background: #781c1c;
    color: #fff
}

.cta_container {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.cta_desc_container {
    border-color: var(--line);
    border-radius: .375rem;
    border-width: 1px;
    padding: .75rem .95rem;
    width: 400px
}

.cta_value {
    color: #8c8c8c;
    margin-top: .25rem
}

.angpow_cta_image {
    background-image: url(../img/angpow/angpow_cta.webp);
    height: 130px
}

.luckyspin_cta_image {
    background-image: url(../img/lucky/luckspin_cta.webp);
    height: 100px
}

.cta_image {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%
}

@media (max-width:767px) {
    .cta_image {
        margin: auto
    }

    .angpow_cta_image {
        height: 110px
    }

    .luckyspin_cta_image {
        height: 80px
    }

    .cta_label {
        font-size: 14px
    }

    .cta_desc_container {
        width: 300px
    }
}

.claim_content .received-text {
    color: #111
}

.claim_content .claimed-amount-text,
.claim_content .claimed-desc-text {
    color: #e94951
}

.sport-bg .leaderboard-li-text,
.sport-bg .livescore-li-text,
.sport-bg .overview-li-text,
.sport-bg .prediction-li-text {
    color: #fff
}

.claim-success-container {
    color: #e3e3e3
}

.invitation-income-bg {
    background: linear-gradient(180deg, #4e5478, #353b55);
    border: 1px solid #3c4363
}

.invitation-income-bg .border-l-2 {
    border: unset
}

.invitation-claim {
    background: var(--secondary);
    color: var(--content) !important
}

.invite-friends .value {
    color: #fff
}

.invite-friends-btn {
    background: var(--secondary);
    color: var(--content) !important
}

.invite-friends-btn i:before {
    color: var(--content)
}

.invitation-faq .icons:before,
.invitation-share .icons:before,
.invite-friends-team .icons:before {
    -webkit-text-fill-color: transparent;
    background: var(--secondary);
    -webkit-background-clip: text
}

.invitation-faq .faq-list {
    background: transparent;
    border: 1px solid var(--primary)
}

.mobile .share-button-list .w-10 {
    width: 35px
}

.my-data-list .tab.active {
    border-color: var(--primary);
    color: var(--primary)
}

.my-data-dashboard,
.my-data-team .list {
    border: 1px solid var(--primary)
}

.my-data-team .card-divider {
    background: linear-gradient(270deg, #0f48e600, #0f48e6, #0f48e600)
}

.referral-my-data-btn {
    background: transparent;
    border: 1px solid #5f5f5f;
    color: #fff
}

.desktop .referral-my-data-btn:hover {
    background: #555
}

.referral-my-data-btn.active,
.referral-my-data-btn.active:hover {
    background: var(--secondary);
    border: 1px solid transparent;
    color: var(--content) !important
}

.my-data-title {
    color: var(--text-base)
}

.my-data-box {
    background: linear-gradient(180deg, #222121, #313030);
    border: 1px solid #5f5f5f
}

.my-data-box-bottom,
.my-data-box-top {
    color: var(--text-base)
}

.my-data-box-line {
    background: linear-gradient(270deg, #5f5f5f00, #5f5f5f 48%, #5f5f5f00)
}

.my-data-dashboard-box {
    border: 1px solid var(--line)
}

.my-data-dashboard-title {
    color: var(--text-base)
}

.my-data-dashboard-table-box-top {
    background: #313030
}

.my-data-dashboard-table-box-top i:before {
    color: #757575
}

.my-data-dashboard-table-box-bottom {
    background: linear-gradient(180deg, #222121, #313030)
}

.my-data-dashboard-table-box-item:nth-child(2):after,
.my-data-dashboard-table-box-item:nth-child(2):before {
    background: #49433a
}

.my-data-dashboard-table-box-bottom-title,
.my-data-dashboard-table-box-bottom-value {
    color: var(--text-base)
}

.my-data-dashboard-table-comm-box-bottom-value {
    -webkit-text-fill-color: transparent;
    background: linear-gradient(180deg, #edb92a, #e1a033);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent
}

.dashboard-head {
    background: var(--bg-main-2);
    color: #fff
}

.dashboard-head i:before {
    color: var(--text-base)
}

.dashboard-card {
    background: transparent;
    border: 1px solid #5f5f5f;
    border-top: unset
}

.income-paid-out .span {
    background: linear-gradient(180deg, #4e5478, #353b55);
    border: 1px solid #3c4363;
    border-radius: 5px;
    box-shadow: 0 -1pt #6c6c6cf5;
    color: #fff;
    padding: 4px 1px;
    width: 27px
}

.income-currency,
.income-currency .icon-thai-currency:before {
    color: #fff !important
}

.invitation-faq .referral-box {
    background: #2e344f;
    border: 1px solid #3c4363;
    border-radius: 5px
}

.invitation-page_yellow {
    color: #fff !important;
    font-weight: 700
}

@media (min-width:768px) {
    .income-paid-out .span {
        padding: 8px 1px;
        width: 40px
    }

    .dashboard-list .list:not(:last-child):after {
        background: #5f5f5f4d;
        content: "";
        height: 45px;
        position: absolute;
        right: -5px;
        top: 50%;
        transform: translateY(-50%);
        width: 1px
    }

    .dashboard-list .list:nth-child(3n):after {
        content: ""
    }
}

@media (max-width:767px) {
    .dashboard-list .list:nth-child(2n):before {
        background: #5f5f5f4d;
        content: "";
        height: 35px;
        left: -5px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 1px
    }
}

.copy-bg {
    background: var(--secondary)
}

.copy-bg i span:before {
    color: #fff !important
}

.invite-friends {
    color: #fff
}

.invite-friends-btn .share-btn {
    background: #1a1a1a
}

.share-btn .share-arrow {
    border-top: 5px solid #1a1a1a
}

.qr-mogal-wrapper .qr-mogal-condent {
    background-color: transparent;
    width: 320px
}

.qr-mogal-wrapper .border-2 {
    border-color: #d6d6d6
}

.qr-mogal-wrapper .icon-close {
    color: #d6d6d6
}

.qr-mogal-bg {
    color: #000
}

.qr-mogal-bg,
.qr-mogal-logo {
    background: #fff;
    border: 1px solid #d6d6d6
}

.domain-bg,
.qr-bg {
    border: 1px solid #d6d6d6
}

.invite-friends-bg {
    background: #fff;
    border: 3px solid #d6d6d6
}

.qr-auth-logo {
    height: 35px;
    width: 140px
}

.qr-logo {
    background-image: url(/logo.png?v=5);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    height: 100%;
    width: 100%
}

.save-image-btn {
    background: var(--bg-main-2);
    color: #fff
}

.referral-no-record i {
    color: #d6d6d6
}

.referral-no-record p {
    color: #fff
}

.qr-auth .auth-logo {
    background-position: 50%
}

.invite-friends-title,
.sub-level-bet-amounts-text span,
.total-daily-income-value {
    color: var(--primary)
}

.invite-bonus-table-container {
    border: 1px solid var(--primary)
}

.sublevels-icon-arrow,
.sublevels-tilted-arrow {
    color: var(--primary)
}

.icon-annoucement {
    color: fff !important
}

.launch_btn_box {
    height: 60px !important;
    right: -25px !important;
    width: 25px !important
}

.promotion_day_info_currency {
    color: #fff !important
}

.total_table_bottom {
    background: #313030;
    bottom: 0;
    justify-content: center;
    padding: 12px 15px;
    z-index: 1
}

.floating-area,
.total_table_bottom {
    align-items: center;
    display: flex;
    left: 0;
    position: fixed;
    width: 100%
}

.floating-area {
    bottom: 40px;
    flex-direction: column;
    margin: 0;
    padding: 0;
    z-index: 2
}

.arrow-container {
    background: var(--secondary);
    border-radius: 25px 25px 0 0;
    cursor: pointer;
    padding: 6px 36px;
    z-index: 3
}

.arrow-down,
.arrow-up {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    height: 0;
    width: 0
}

.arrow-up {
    border-bottom: 6px solid #fff
}

.arrow-down {
    border-top: 6px solid #fff
}

.invite-content {
    background: #000;
    box-sizing: border-box;
    color: #fff;
    margin-top: -2px;
    padding: 16px;
    width: 100%
}

.row {
    display: flex;
    font-size: 14px;
    justify-content: space-between;
    padding: 4px 0
}

.fade-slide-enter-active,
.fade-slide-leave-active {
    transition: all .5s ease
}

.fade-slide-enter-from,
.fade-slide-leave-to {
    opacity: 0;
    transform: translateY(5px)
}

.deposit-amount-bg {
    align-items: center;
    background-color: #2e344f;
    border: 1px solid #3c4363;
    border-radius: .375rem;
    display: flex;
    gap: .5rem;
    height: 50px;
    justify-content: center;
    width: 300px
}

@media screen and (max-width:767px) {
    .security-head {
        background: #2e344f;
        border: 1px solid #3c4363;
        margin: 15px 0
    }
}

.invite-now-text i:after {
    color: var(--content) !important
}

.claim-box {
    background: linear-gradient(180deg, #fff, #ebebeb);
    border: 1px solid #d6d6d6
}

.deposit-amount-text {
    font-size: 21px;
    font-weight: 700
}

.icon-start-soon-color {
    color: #d81a1e
}

.custom-alert-box {
    align-items: center;
    align-self: center;
    background-color: #ad06091a;
    border: 1px solid #ad0609;
    border-radius: 5px;
    display: flex;
    gap: .5rem;
    justify-content: center;
    margin-top: 1rem;
    padding: .5rem
}

.icon-tooltip-color {
    color: #ad0609
}

.custom-bottom-bar {
    align-items: center;
    background-color: #222121;
    bottom: 0;
    display: flex;
    flex: 1;
    flex-direction: column;
    left: 0;
    padding: .5rem 1rem;
    position: fixed;
    right: 0
}

.deposit-method {
    border: 1px solid var(--line);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    padding: .7rem;
    position: relative
}

.deposit-method.selected {
    background: var(--primary);
    border: 1px solid var(--primary);
    box-shadow: inset 0 0 0 2px var(--primary);
    color: #fff
}

.deposit-method-check {
    background-color: var(--primary);
    border-bottom-right-radius: 5px;
    bottom: 0;
    clip-path: polygon(100% 0, 0 100%, 100% 100%);
    height: 22px;
    opacity: 0;
    position: absolute;
    right: 0;
    width: 22px
}

.deposit-method-check img {
    bottom: 1px;
    height: 12px;
    position: absolute;
    right: 1px;
    width: 12px
}

.deposit-method.selected .v-method-check {
    opacity: 1
}

.bg-deposit-method-tab {
    background-color: #d8d8d8
}

.bg-deposit-method-tab-content {
    background-color: #fafafc
}

.deposit-method-border-color {
    border-color: var(--line)
}

.deposit-method-border-color.active {
    border-color: var(--primary)
}

.deposit-quota-value-text,
.deposit-text {
    color: var(--primary)
}

.deposit-receivable-amount {
    color: #55a5ff
}

.receipt-input-add {
    color: var(--primary)
}

.bg-bank-transfer {
    background-color: var(--body)
}

.referral-invite-banner {
    background: linear-gradient(90deg, #e7d5ff, #c695ff);
    color: #000
}

.deposit_channel_button {
    align-items: center;
    display: flex;
    gap: 5px
}

.deposit_channel_circle {
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 100%;
    display: flex;
    height: 20px;
    justify-content: center;
    transition: all .3s;
    width: 20px
}

.deposit_channel_button.active .deposit_channel_circle {
    border: 1px solid var(--primary)
}

.deposit_channel_circle_inner {
    background: transparent;
    border-radius: 100%;
    height: 15px;
    transition: all .3s;
    width: 15px
}

.deposit_channel_button.active .deposit_channel_circle_inner {
    background: var(--bg-main-2)
}

.deposit_channel_text {
    color: var(--text-base);
    font-size: 14px;
    font-weight: 400;
    transition: all .3s
}

.deposit_channel_button.active .deposit_channel_text {
    color: var(--primary)
}

.select_bank_button {
    align-items: center;
    background: var(--content);
    border: 1px solid var(--line);
    border-radius: 5px;
    display: flex;
    justify-content: center;
    padding-top: 50%;
    position: relative;
    transition: all .3s;
    width: 100%
}

.select_bank_button.active {
    border: 1px solid var(--primary);
    overflow: hidden
}

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

.select_bank_button_circle {
    align-items: center;
    border: 1px solid #e5e7eb;
    border-radius: 100%;
    display: flex;
    height: 15px;
    justify-content: center;
    position: absolute;
    right: 5px;
    top: 5px;
    transition: all .3s;
    width: 15px
}

.select_bank_button.active .select_bank_button_circle {
    border: 1px solid var(--primary)
}

.select_bank_button_circle_inner {
    background: transparent;
    border-radius: 100%;
    height: 10px;
    transition: all .3s;
    width: 10px
}

.select_bank_button.active .select_bank_button_circle_inner {
    background: var(--primary)
}

@media (max-width:767px) {
    .select_bank_button_circle {
        height: 10px;
        right: 2px;
        top: 2px;
        width: 10px
    }

    .select_bank_button_circle_inner {
        height: 5px;
        width: 5px
    }

    .bg-deposit-preset-box .deposit_amount_circle {
        right: 2px;
        top: 2px
    }
}

.upload_receipt_box {
    align-items: center;
    display: flex;
    margin-top: 10px
}

.upload_receipt_button {
    background: var(--content);
    border: 1px solid var(--line);
    border-radius: 10px;
    cursor: pointer;
    height: 150px;
    position: relative;
    width: 300px
}

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

.upload_receipt_plus {
    align-items: center;
    background: #757575;
    border: 1px solid #757575;
    border-radius: 10px;
    display: flex;
    height: 40px;
    justify-content: center;
    margin: 0 auto;
    width: 40px
}

.upload_receipt_plus svg {
    color: var(--text-base);
    width: 80%
}

.upload_receipt_text {
    color: var(--text-base);
    font-size: 16px;
    font-weight: 400;
    margin-top: 10px;
    text-align: center;
    white-space: nowrap
}

.upload_receipt_box_note {
    padding-left: 20px;
    width: calc(100% - 300px)
}

.upload_receipt_box_note_text {
    color: var(--text-base);
    font-size: 16px;
    font-weight: 400;
    width: 100%
}

.upload_receipt_note_special {
    color: var(--primary)
}

.upload_receipt_file_display {
    height: 100%;
    width: 100%
}

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

.upload_receipt_file_img {
    display: block;
    max-height: 100%;
    max-width: 100%
}

.upload_receipt_remove_file_button {
    align-items: center;
    background: rgba(0, 0, 0, .5);
    border-radius: 100%;
    color: #fff;
    display: flex;
    height: 25px;
    justify-content: center;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 25px
}

@media (max-width:767px) {
    .upload_receipt_button {
        height: 80px;
        width: 180px
    }

    .upload_receipt_plus {
        border-radius: 5px;
        height: 20px;
        width: 20px
    }

    .upload_receipt_text {
        font-size: 12px;
        margin-top: 5px
    }

    .upload_receipt_remove_file_button {
        height: 20px;
        right: 5px;
        top: 5px;
        width: 20px
    }

    .upload_receipt_box_note {
        padding-left: 10px;
        width: calc(100% - 180px)
    }

    .upload_receipt_box_note_text {
        font-size: 12px
    }
}

.deposit_label {
    color: var(--text-base);
    font-size: 12px;
    font-weight: 400
}

.deposit_label_primary {
    color: var(--secondary) !important;
    font-size: 12px;
    font-weight: 600
}

.isDesktop .deposit_label {
    color: var(--text-base);
    font-size: 16px;
    font-weight: 400
}

.isDesktop .deposit_label_primary {
    color: var(--primary);
    font-size: 16px;
    font-weight: 600
}

.deposit_information_box {
    background: var(--content);
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 10px;
    width: 400px
}

.deposit_information_title {
    color: var(--text-base);
    font-size: 14px;
    font-weight: 600
}

.deposit_information_content {
    align-items: center;
    display: flex;
    flex-wrap: wrap
}

.deposit_information_content_label {
    color: var(--text-light);
    font-size: 14px;
    font-weight: 400;
    width: 150px
}

.deposit_information_content_display {
    align-items: center;
    display: flex;
    justify-content: space-between;
    width: calc(100% - 150px)
}

.deposit_information_content_display .text {
    color: var(--text-base);
    font-size: 14px;
    font-weight: 400;
    padding-right: 5px;
    word-break: break-all
}

@media (max-width:767px) {
    .deposit_information_box {
        width: 100%
    }

    .deposit_information_content_label {
        font-size: 12px;
        width: 120px
    }

    .deposit_information_content_display {
        width: calc(100% - 120px)
    }

    .deposit_information_content_display .text {
        font-size: 12px
    }
}

@media (max-width:370px) {
    .deposit_information_content_label {
        width: 80px
    }

    .deposit_information_content_display {
        width: calc(100% - 80px)
    }
}

.deposit_copy_btn {
    align-items: center;
    background: linear-gradient(180deg, #1145dd, #123cbe);
    border-radius: 5px;
    display: flex;
    gap: 5px;
    padding: 5px 6px;
    white-space: nowrap
}

.deposit_copy_btn .text {
    color: var(--text-base);
    font-size: 12px;
    font-weight: 400
}

.deposit_copy_btn .icon {
    color: var(--text-base);
    width: 14px
}

.bg-deposit-preset-box {
    position: relative
}

.bg-deposit-preset-box .deposit_amount_circle .deposit_amount_circle_inner {
    background: transparent;
    border-radius: 100%;
    height: 12px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s;
    width: 12px
}

.bg-deposit-preset-box.active .deposit_amount_circle {
    border-color: #55a5ff
}

.bg-deposit-preset-box.active .deposit_amount_circle .deposit_amount_circle_inner {
    background: #55a5ff
}

.ee1mwfyk10 .css-ohv7r6 .ejbfa1m0 {
    color: var(--secondary)
}

.selected-deposit-method-border .checkmark-bg {
    background-color: var(--secondary)
}

.select-amount-button {
    position: relative
}

.select-amount-button .deposit_amount_circle .deposit_amount_circle_inner {
    background: transparent;
    border-radius: 100%;
    height: 9px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s;
    width: 9px
}

.select-amount-button.active .deposit_amount_circle .deposit_amount_circle_inner {
    background: var(--primary)
}

.bg-deposit-preset-box .deposit_amount_circle {
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 100%;
    height: 16px;
    position: absolute;
    right: 5px;
    top: 5px;
    transition: all .3s;
    width: 16px
}

.btn_deposit {
    background: var(--bg-main-2)
}

.btn_withdraw {
    background: var(--secondary) !important;
    color: var(--content) !important
}

@media (max-width:640px) {
    .btn_deposit {
        padding: 16px 32px
    }

    .back-btn,
    .btn_deposit {
        border-radius: 4px;
        font-size: 14px;
        margin-bottom: 4px
    }

    .back-btn {
        padding: 10px 16px
    }
}

.bg-upload {
    background: linear-gradient(180deg, #0f48e6, #133bba);
    padding: 8px 36px
}

.transfer-info__caret-double-down--B2 .icon-dropdown:before {
    color: #55a5ff
}

.btn_transfer {
    background: var(--bg-main-2);
    border-radius: 5px;
    color: var(--text-base);
    font-size: 14px;
    padding: 16px 36px
}

@media (max-width:640px) {
    .btn_transfer {
        border-radius: 4px;
        font-size: 12px;
        margin-bottom: 4px;
        padding: 4px 16px
    }
}

.deposit_information_content_labels {
    color: #fafafa;
    font-size: 12px;
    font-weight: 300;
    width: 150px
}

.deposit_channel_text,
.processing_fees_text,
.quick_select_text {
    font-size: 12px
}

.deposit_channel_text,
.quick_select_text {
    font-weight: 600
}

.processing_fees_text {
    font-weight: 300
}

.transfer_to_text {
    font-size: 12px;
    font-weight: 600
}

@media (min-width:768px) {

    .deposit_channel_text,
    .quick_select_text {
        font-size: 16px;
        font-weight: 600
    }

    .processing_fees_text {
        font-size: 12px
    }

    .transfer_to_text {
        font-size: 16px;
        font-weight: 600
    }
}

.bank_detail_text {
    color: #757575
}

.bank_detail_content {
    color: #fff
}

.currency_text {
    font-size: 16px
}

@media (max-width:640px) {
    .currency_text {
        font-size: 12px
    }
}

.important_dont_save_text {
    font-size: 10px;
    font-weight: 300
}

.copy_btn_text {
    font-size: 14px;
    font-weight: 300
}

.upload_text {
    font-size: 14px;
    font-weight: 600
}

.deposit_text {
    font-size: 14px;
    font-weight: 300
}

.deposit_support_text {
    font-size: 12px;
    font-weight: 300
}

.currency-text {
    font-size: 12px
}

@media (min-width:641px) {
    .currency-text {
        font-size: 16px
    }
}

.deposit-method-button,
.deposit-method-button * {
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.btn_deposits {
    background: var(--secondary);
    border-radius: 5px;
    color: var(--content);
    font-size: 14px;
    padding: 12px 36px
}

@media (min-width:640px) {
    .btn_deposits {
        border-radius: 4px;
        font-size: 16px;
        height: 55px;
        margin-bottom: 4px;
        padding: 16px 32px;
        width: 180px
    }
}

.payment_type_text {
    color: #5f5f5f;
    font-size: 8px;
    font-weight: 500;
    text-transform: uppercase
}

@media (min-width:640px) {
    .payment_type_text {
        color: #5f5f5f;
        font-size: 12px;
        font-weight: 500;
        text-transform: uppercase
    }
}

.selected-bank-bg {
    background: var(--o-option-selected-bg)
}

.btn_submit {
    background: var(--secondary);
    border-radius: 5px;
    color: var(--content);
    font-size: 14px;
    padding: 14px 48px
}

.add_bank_text {
    font-size: 16px;
    font-weight: 500
}

.proceed_to_withdrawal_deposit {
    font-size: 16px;
    font-weight: 300
}

@media (max-width:640px) {
    .add_bank_text {
        font-size: 12px;
        font-weight: 600
    }

    .proceed_to_withdrawal_deposit {
        font-size: 12px;
        font-weight: 300
    }
}

.selected-deposit-method-border {
    border: 2px solid var(--secondary) !important
}

.deposit-border {
    border: 2px solid transparent
}

.channel-bg {
    background: #1e1e1e
}

.channel-amount-bg {
    background: #33302c
}

@media screen and (max-width:768px) {
    .staging .invite-friends-team {
        padding-left: unset;
        padding-right: unset
    }
}

.hint-svg-color,
.hint-text-color {
    color: #757575
}

.hint-svg-color span:before {
    color: #757575 !important
}

.show_toggle_text i:before {
    fill: #fff;
    color: #fff
}

.method_name_text {
    color: var(--primary);
    font-size: 10px
}

.bank_method_name_text {
    font-size: 10px
}

@media (min-width:768px) {

    .bank_method_name_text,
    .method_name_text {
        font-size: 14px
    }
}

.fixed-deposit-btn {
    background: #222121
}

.bank_method_name_text,
.method_name_text {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    align-items: center;
    display: -webkit-box;
    display: flex;
    height: 2.8em;
    justify-content: center;
    line-height: 1.4em;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: normal
}

.deposit-button-method,
.deposit-button-method * {
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.deposit-button-method {
    background: #33333c;
    border: 1px solid #5f5f5f;
    border-radius: 6px;
    height: 110px;
    position: relative;
    transition: all .2s;
    width: 100%
}

.deposit-button-method.active {
    background-color: var(--content);
    border: 1px solid var(--secondary)
}

.deposit-method-bank-name-box {
    align-items: center;
    display: flex;
    height: 40px;
    justify-content: center;
    margin-top: 8px;
    padding: 0 15px;
    width: 100%
}

.deposit-method-bank-name {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: var(--text-base);
    display: -webkit-box;
    font-size: 16px;
    font-weight: 600;
    line-height: 18px;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: normal;
    width: 100%
}

.deposit-channel-content-top {
    background: #33333c;
    padding: 8px;
    width: 100%
}

.deposit-channel-content-channel-text {
    color: #55a5ff;
    font-size: 16px;
    font-weight: 400;
    line-height: 18px;
    text-align: center;
    width: 100%
}

.deposit-channel-content-channel-name-text {
    color: #fafafa;
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    margin-top: 4px;
    width: 100%
}

.deposit-channel-content-bottom {
    align-items: center;
    background: #27305c;
    display: flex;
    justify-content: center;
    padding: 8px;
    width: 100%
}

.deposit-channel-content-channel-amount-text {
    color: #fff;
    font-size: 16px;
    font-weight: 600
}

.game_vpn_tag {
    position: absolute;
    right: 25px;
    top: 5px;
    width: 40px
}

.mobile_vpn_tag {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px
}

.mobile_game_vpn_tag {
    left: 0;
    position: absolute;
    top: 0;
    width: 30px
}

.top_vpn_tag {
    position: absolute;
    right: 60px;
    top: -2px;
    width: 30px
}

.game_mobile_vpn_tag {
    position: absolute;
    right: 10px;
    top: 1px;
    width: 30px
}

@media (max-width:767px) {
    .deposit-button-method {
        height: 80px
    }

    .deposit-method-bank-name-box {
        height: 25px;
        margin: 4px 0
    }

    .deposit-method-bank-name {
        font-size: 10px;
        line-height: 12px
    }

    .deposit-channel-content-top {
        padding: 5px 8px
    }

    .deposit-channel-content-channel-text {
        font-size: 12px;
        line-height: 14px
    }

    .deposit-channel-content-channel-name-text {
        font-size: 10px;
        line-height: 12px
    }

    .deposit-channel-content-bottom {
        padding: 5px 8px
    }

    .deposit-channel-content-channel-amount-text {
        font-size: 12px;
        line-height: 14px
    }
}

@media (max-width:375px) {
    .deposit-method-bank-name-box {
        height: 30%;
        margin: 8% 0
    }

    .deposit-method-bank-name {
        font-size: 50%;
        line-height: 125%
    }
}

.deposit-button-method-checkmark {
    align-items: center;
    background-color: #febc65;
    border-bottom-right-radius: 4px;
    border-top-left-radius: 14px;
    bottom: 0;
    display: flex;
    height: 18px;
    justify-content: center;
    padding-left: 4px;
    padding-top: 4px;
    position: absolute;
    right: 0;
    width: 18px
}

.custom-border {
    border: .5px solid #5f5f5f80;
    width: 100%
}

.my-account-text {
    color: #faf7f7;
    font-size: 12px;
    font-weight: 300;
    text-align: left;
    white-space: nowrap
}

.upload-slip-container {
    border: 1px solid #5f5f5f;
    border-radius: 5px;
    margin-top: 0;
    overflow: hidden
}

@media (min-width:768px) {
    .upload-slip-container {
        margin-top: .75rem
    }
}

.profile_date_svg_1,
.submit-username-button-container .icon-close {
    align-items: center;
    background: var(--bg-exit-icon-fill);
    border-radius: 5px;
    display: flex;
    justify-content: center
}

.profile_date_svg_2,
.submit-username-button-container .icon-tick {
    align-items: center;
    background: var(--bg-save-icon-fill);
    border-radius: 5px;
    display: flex;
    justify-content: center
}

.icon-close:before,
.icon-tick:before {
    color: #fff !important
}

.upload_slip_text {
    color: #fafafa
}

.deposit-channel-wrapper .o-select-container {
    background-color: #000 !important
}

.tab-deposit {
    background: #000;
    border: 2px solid var(--primary);
    color: #fff !important
}

.tab-deposit.current {
    color: var(--primary) !important
}

.deposit-method-new {
    background: #939393;
    color: #fff !important;
    overflow: hidden
}

.deposit-method-new img {
    filter: grayscale(1);
    opacity: .5
}

.deposit-method-new.selected img {
    filter: none !important;
    opacity: 1 !important
}

@media screen and (min-width:768px) {
    .deposit-method-new img {
        height: 70px;
        max-height: 70px
    }
}

.deposit-method-border-color .text-primary {
    color: #fafafa !important
}

.deposit-channel-btn {
    border: 1px solid #5f5f5f
}

.deposit-channel-btn.selected {
    border: 1px solid #febc65;
    color: #febc65
}

.mobile .auth-log-reg-modal {
    align-items: flex-start !important;
    padding: 0 !important
}

.auth-log-reg-modal .fmodal-content {
    height: 100% !important
}

.transaction-tab-section {
    background: var(--content)
}

.transaction-tab-btn {
    border-bottom: 2px solid transparent;
    color: #fff
}

.\  !border-b-primary {
    border-bottom-color: var(--secondary) !important
}

.transaction-tab-btn.router-link-active {
    border-bottom: 2px solid var(--secondary);
    color: #fff
}

.loading-api-block {
    background: rgba(0, 0, 0, .5) !important
}

.invite-now-text i:before {
    color: var(--content) !important
}

.invite-friends-title-img {
    border-radius: 10px
}

.invite-friends-title {
    color: var(--secondary)
}

.invite-friends-desc {
    color: #fafafa
}

.levels-card,
.your-income-card {
    background: var(--invite-friends-income-amounts-bg);
    border: 1px solid #5f5f5f;
    border-radius: 5px;
    position: relative
}

.levels-card:before,
.your-income-card:before {
    background: url(../img/invite-friends/pattern-dark.webp);
    background-position: 50%;
    content: "";
    inset: 0;
    opacity: 1;
    pointer-events: none;
    position: absolute;
    z-index: 0
}

.levels-card>*,
.your-income-card>* {
    position: relative;
    z-index: 1
}

.level-box,
.your-income-profile-box {
    background: linear-gradient(180deg, #f5e3b5, #b9925d)
}

.level-box-inner,
.your-income-profile-box-inner {
    background: linear-gradient(180deg, #faf8b1, #e2c497)
}

.level-box .inner,
.your-income-profile-box .inner {
    background: radial-gradient(circle, gray 0, #000 60%)
}

.levels-card-container span,
.your-income-profile-container span {
    background: #222121;
    border-radius: 15px
}

.sub-level-bet-amounts-text span,
.total-daily-income-value {
    background: unset;
    color: var(--secondary)
}

.your-income-profile-box .inner-circle-line {
    background: transparent;
    border: 1px solid #f5e3b5
}

.invite-bonus-table-container {
    border: 1px solid var(--secondary)
}

.invite-bonus-table {
    background: var(--invite-friends-income-amounts-bg)
}

.invite-bonus-table th {
    background: var(--invite-friends-income-amounts-bg);
    border: .5px solid #707070;
    color: #fff
}

.invite-bonus-table td {
    background: transparent;
    border: .5px solid #707070;
    color: #fff
}

.invite-bonus-table tr:hover {
    background: rgba(232, 141, 4, .2)
}

.invite-bonus-table th {
    border-top: none
}

.invite-bonus-table tr:last-child td {
    border-bottom: none
}

.invite-bonus-table th:first-child,
.invite-bonus-table tr td:first-child {
    border-left: none
}

.invite-bonus-table th:last-child,
.invite-bonus-table tr td:last-child {
    border-right: none
}

.invite-bonus-title i {
    -webkit-text-fill-color: transparent;
    background: var(--bg-main);
    -webkit-background-clip: text;
    display: inline-block
}

.sublevels-icon-arrow,
.sublevels-tilted-arrow {
    color: var(--secondary)
}

.claim-box {
    background: linear-gradient(180deg, #f0af0c26, #aa550026);
    border: 1px solid #c7b5874d
}

.deposit-tooltip-box {
    align-items: center;
    align-self: center;
    background-color: #ad06091a;
    border: 1px solid #ad0609;
    border-radius: 5px;
    display: flex;
    gap: .5rem;
    justify-content: center;
    margin-top: 1rem;
    padding: .5rem
}

.deposit-tooltip-box .icon-alert:before,
.deposit-tooltip-box .icon-tooltip:before {
    color: #ad0609
}

.bank-info-bg {
    border: 1px solid #5f5f5f;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-bottom: .5rem;
    margin-top: .75rem;
    padding-bottom: .75rem;
    padding-left: 1rem;
    padding-right: 1rem;
    width: 100%
}

@media (min-width:768px) {
    .bank-info-bg {
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }
}

.withdrawal-disabled-input {
    background-color: #4d4d4d
}

.selected-border {
    border-color: var(--secondary) !important
}

.selected-bg {
    background-color: var(--secondary) !important
}

.bg-after-transfer-box {
    align-items: center;
    background-color: #222121;
    bottom: 0;
    display: flex;
    flex: 1;
    flex-direction: column;
    left: 0;
    padding: .5rem 1rem;
    position: fixed;
    right: 0
}

.back-btn {
    background: #757575
}

.back-btn,
.btn_deposit {
    border-radius: 5px;
    color: var(--text-base);
    font-size: 14px;
    padding: 12px 36px
}

.btn_deposit {
    background: linear-gradient(180deg, #0f48e6, #133bba)
}

.btn_withdraw {
    background: linear-gradient(180deg, #febc65, #ea9044);
    color: #41210e
}

.btn-after-tranfer {
    background: linear-gradient(180deg, #0f48e6, #133bba);
    border-radius: 5px;
    color: var(--text-base);
    font-size: 14px;
    padding: 16px 32px
}

.available_texts,
.crypto-rate {
    color: var(--secondary) !important
}

.infinite-svg {
    fill: #fff
}

.deposit-topbar {
    background: var(--body) !important
}

.quickLaunchBox-v2 .btn-quick-center {
    background: var(--secondary)
}

.quickLaunchBox-v2 .btn-quick-center .icon-dropup:before {
    color: var(--content)
}

.quickLaunchBox-v2 .btn-quick-center i:before {
    color: var(--text-base)
}

.quickLaunchBox-v2 .btn-quick-box {
    background: #313030
}

.quickLaunchBox-v2 .btn-quick-box i:before {
    color: var(--text-base)
}

.quickLaunchBox-v2.vertical .swiper-container-wrapper {
    background: rgba(0, 0, 0, .7);
    box-shadow: .02rem .04rem .28rem #00000040
}

.quickLaunchBox-v2 .swiper-container-wrapper .swiper-slide {
    height: 100% !important
}

.quickLaunchBox-v2.vertical .quick-toggle-nav {
    background: var(--secondary)
}

.quickLaunchBox-v2.vertical .quick-toggle-nav i:before {
    color: var(--content)
}

.right_launch_btn_bg {
    background: var(--secondary)
}

.right_launch_arrow {
    background-color: var(--content) !important;
    clip-path: polygon(100% 0, 100% 100%, 0 50%);
    height: 20px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) rotate(0);
    transition: all .3s;
    width: 8px
}

.mobileNewChangePasswordSection .o-input-wrapper .o-icon.password_icon {
    right: 10px !important
}

@media (max-width:1024px) {
    .header_logo {
        width: 80px !important
    }
}

.transaction-tab-btn.router-link-active {
    border-bottom: 2px solid #febc65;
    color: #febc65
}

.select-bank-button:hover {
    background: #febc65 !important
}

.transaction-tab-btn {
    font-weight: 700 !important
}

.withdraw_texts {
    color: #41210e
}

.selected-button-withdraw {
    background: #febc65 !important
}

.selected-border-withdraw-channel {
    border-color: #febc65 !important
}

.selected-bg-withdraw-channel-tick {
    background: #febc65 !important
}

.selected-bg-withdraw-channel-tick .withdrawal-tick {
    color: #41210e !important
}

.deposit-button-method.active,
.selected-deposit-method-border {
    border: 1px solid #febc65
}

.active .deposit-method-bank-name,
.available_texts {
    color: #febc65 !important
}

.deposit-submit {
    background: linear-gradient(180deg, #febc65, #ea9044) !important;
    color: #41210e !important
}

.copy-btn .copy-btn-express-deposit {
    color: #febc65 !important
}

.first\:mr-0:first-child {
    margin-right: 0
}

.last\:mb-0:last-child {
    margin-bottom: 0
}

.last\:border-b-0:last-child {
    border-bottom-width: 0
}

.hover\:scale-105:hover {
    --tw-scale-x: 1.05;
    --tw-scale-y: 1.05
}

.hover\:scale-105:hover,
.hover\:scale-110:hover {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.hover\:scale-110:hover {
    --tw-scale-x: 1.1;
    --tw-scale-y: 1.1
}

.hover\:bg-\[\#000AFF\]:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(0 10 255/var(--tw-bg-opacity))
}

.hover\:bg-\[var\(--o-option-hover-bg\)\]:hover {
    background-color: var(--o-option-hover-bg)
}

.hover\:bg-gray-50:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(249 250 251/var(--tw-bg-opacity))
}

.hover\:text-\[color\:var\(--primary\)\]:hover {
    color: var(--primary)
}

.hover\:text-gray-700:hover {
    --tw-text-opacity: 1;
    color: rgb(55 65 81/var(--tw-text-opacity))
}

.hover\:text-white:hover {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity))
}

.focus\:border-\[var\(--line\)\]:focus {
    border-color: var(--line)
}

.focus\:\  !shadow-none:focus {
    --tw-shadow: 0 0 #0000 !important;
    --tw-shadow-colored: 0 0 #0000 !important;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.focus\:\  !outline-none:focus {
    outline: 2px solid transparent !important;
    outline-offset: 2px !important
}

.focus\:outline-none:focus {
    outline: 2px solid transparent;
    outline-offset: 2px
}

.focus\:\  !ring-0:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important
}

.focus\:ring-0:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)
}

.active\:bg-gray-100:active {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246/var(--tw-bg-opacity))
}

.disabled\:opacity-40:disabled {
    opacity: .4
}

.group:hover .group-hover\:scale-105 {
    --tw-scale-x: 1.05;
    --tw-scale-y: 1.05;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.group:hover .group-hover\:opacity-0 {
    opacity: 0
}

.group:hover .group-hover\:opacity-100 {
    opacity: 1
}

.group:active .group-active\:opacity-50 {
    opacity: .5
}

:is(.dark .dark\:inline) {
    display: inline
}

:is(.dark .dark\:hidden) {
    display: none
}

@media (min-width:640px) {
    .sm\:-bottom-4 {
        bottom: -1rem
    }

    .sm\:-bottom-\[38\%\] {
        bottom: -38%
    }

    .sm\:-bottom-\[48\%\] {
        bottom: -48%
    }

    .sm\:-right-2 {
        right: -.5rem
    }

    .sm\:-right-3 {
        right: -.75rem
    }

    .sm\:-right-4 {
        right: -1rem
    }

    .sm\:-right-5 {
        right: -1.25rem
    }

    .sm\:-top-5 {
        top: -1.25rem
    }

    .sm\:-top-6 {
        top: -1.5rem
    }

    .sm\:bottom-11 {
        bottom: 2.75rem
    }

    .sm\:bottom-14 {
        bottom: 3.5rem
    }

    .sm\:bottom-5 {
        bottom: 1.25rem
    }

    .sm\:bottom-\[-60px\] {
        bottom: -60px
    }

    .sm\:left-10 {
        left: 2.5rem
    }

    .sm\:left-12 {
        left: 3rem
    }

    .sm\:left-14 {
        left: 3.5rem
    }

    .sm\:left-6 {
        left: 1.5rem
    }

    .sm\:left-8 {
        left: 2rem
    }

    .sm\:left-\[35\%\] {
        left: 35%
    }

    .sm\:right-10 {
        right: 2.5rem
    }

    .sm\:right-16 {
        right: 4rem
    }

    .sm\:right-5 {
        right: 1.25rem
    }

    .sm\:right-\[unset\] {
        right: unset
    }

    .sm\:top-10 {
        top: 2.5rem
    }

    .sm\:top-3 {
        top: .75rem
    }

    .sm\:top-4 {
        top: 1rem
    }

    .sm\:top-6 {
        top: 1.5rem
    }

    .sm\:top-8 {
        top: 2rem
    }

    .sm\:top-\[-25px\] {
        top: -25px
    }

    .sm\:top-\[10\%\] {
        top: 10%
    }

    .sm\:top-\[11px\] {
        top: 11px
    }

    .sm\:top-\[18px\] {
        top: 18px
    }

    .sm\:top-\[66\%\] {
        top: 66%
    }

    .sm\:top-\[70px\] {
        top: 70px
    }

    .sm\:col-span-3 {
        grid-column: span 3/span 3
    }

    .sm\:col-span-9 {
        grid-column: span 9/span 9
    }

    .sm\:m-2 {
        margin: .5rem
    }

    .sm\:mx-0 {
        margin-left: 0;
        margin-right: 0
    }

    .sm\:mx-auto {
        margin-left: auto;
        margin-right: auto
    }

    .sm\:my-1 {
        margin-bottom: .25rem;
        margin-top: .25rem
    }

    .sm\:mb-16 {
        margin-bottom: 4rem
    }

    .sm\:mb-3 {
        margin-bottom: .75rem
    }

    .sm\:mb-4 {
        margin-bottom: 1rem
    }

    .sm\:mb-5 {
        margin-bottom: 1.25rem
    }

    .sm\:mb-8 {
        margin-bottom: 2rem
    }

    .sm\:ml-0 {
        margin-left: 0
    }

    .sm\:mr-3 {
        margin-right: .75rem
    }

    .sm\:mt-0 {
        margin-top: 0
    }

    .sm\:mt-2 {
        margin-top: .5rem
    }

    .sm\:mt-2\.5 {
        margin-top: .625rem
    }

    .sm\:mt-3 {
        margin-top: .75rem
    }

    .sm\:mt-6 {
        margin-top: 1.5rem
    }

    .sm\:mt-8 {
        margin-top: 2rem
    }

    .sm\:block {
        display: block
    }

    .sm\:flex {
        display: flex
    }

    .sm\:hidden {
        display: none
    }

    .sm\:\  !h-auto {
        height: auto !important
    }

    .sm\:h-\[100px\] {
        height: 100px
    }

    .sm\:h-\[200px\] {
        height: 200px
    }

    .sm\:h-\[30px\] {
        height: 30px
    }

    .sm\:h-\[45px\] {
        height: 45px
    }

    .sm\:h-\[60px\] {
        height: 60px
    }

    .sm\:h-full {
        height: 100%
    }

    .sm\:min-h-\[200px\] {
        min-height: 200px
    }

    .sm\:min-h-\[35px\] {
        min-height: 35px
    }

    .sm\:\  !w-\[130px\] {
        width: 130px !important
    }

    .sm\:\  !w-\[300px\] {
        width: 300px !important
    }

    .sm\:w-0 {
        width: 0
    }

    .sm\:w-\[100px\] {
        width: 100px
    }

    .sm\:w-\[110px\] {
        width: 110px
    }

    .sm\:w-\[180px\] {
        width: 180px
    }

    .sm\:w-\[200px\] {
        width: 200px
    }

    .sm\:w-\[22\.5vw\] {
        width: 22.5vw
    }

    .sm\:w-\[25\.5vw\] {
        width: 25.5vw
    }

    .sm\:w-\[27\%\] {
        width: 27%
    }

    .sm\:w-\[30px\] {
        width: 30px
    }

    .sm\:w-\[35px\] {
        width: 35px
    }

    .sm\:w-\[40px\] {
        width: 40px
    }

    .sm\:w-\[45px\] {
        width: 45px
    }

    .sm\:w-\[50\%\] {
        width: 50%
    }

    .sm\:w-\[50px\] {
        width: 50px
    }

    .sm\:w-\[56\.5\%\] {
        width: 56.5%
    }

    .sm\:w-\[70px\] {
        width: 70px
    }

    .sm\:w-\[75\%\] {
        width: 75%
    }

    .sm\:w-\[80\%\] {
        width: 80%
    }

    .sm\:w-\[8vw\] {
        width: 8vw
    }

    .sm\:w-\[92\%\] {
        width: 92%
    }

    .sm\:w-\[auto\],
    .sm\:w-auto {
        width: auto
    }

    .sm\:w-fit {
        width: -moz-fit-content;
        width: fit-content
    }

    .sm\:w-full {
        width: 100%
    }

    .sm\:min-w-\[100px\] {
        min-width: 100px
    }

    .sm\:min-w-\[110px\] {
        min-width: 110px
    }

    .sm\:min-w-\[125px\] {
        min-width: 125px
    }

    .sm\:min-w-\[15\%\] {
        min-width: 15%
    }

    .sm\:min-w-\[350px\] {
        min-width: 350px
    }

    .sm\:min-w-\[60px\] {
        min-width: 60px
    }

    .sm\:max-w-\[100\%\] {
        max-width: 100%
    }

    .sm\:max-w-\[18rem\] {
        max-width: 18rem
    }

    .sm\:max-w-\[250px\] {
        max-width: 250px
    }

    .sm\:max-w-\[275px\] {
        max-width: 275px
    }

    .sm\:max-w-\[300px\] {
        max-width: 300px
    }

    .sm\:max-w-\[350px\] {
        max-width: 350px
    }

    .sm\:max-w-\[465px\] {
        max-width: 465px
    }

    .sm\:max-w-\[475px\] {
        max-width: 475px
    }

    .sm\:max-w-\[500px\] {
        max-width: 500px
    }

    .sm\:max-w-none {
        max-width: none
    }

    .sm\:-translate-x-1\/2 {
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
    }

    .sm\:grid-cols-12 {
        grid-template-columns: repeat(12, minmax(0, 1fr))
    }

    .sm\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .sm\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .sm\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .sm\:flex-row {
        flex-direction: row
    }

    .sm\:items-stretch {
        align-items: stretch
    }

    .sm\:justify-start {
        justify-content: flex-start
    }

    .sm\:justify-center {
        justify-content: center
    }

    .sm\:gap-2 {
        gap: .5rem
    }

    .sm\:gap-3 {
        gap: .75rem
    }

    .sm\:gap-4 {
        gap: 1rem
    }

    .sm\:gap-5 {
        gap: 1.25rem
    }

    .sm\:gap-6 {
        gap: 1.5rem
    }

    .sm\:gap-x-2 {
        -moz-column-gap: .5rem;
        column-gap: .5rem
    }

    .sm\:gap-x-20 {
        -moz-column-gap: 5rem;
        column-gap: 5rem
    }

    .sm\:overflow-x-clip {
        overflow-x: clip
    }

    .sm\:\  !rounded-\[12px\] {
        border-radius: 12px !important
    }

    .sm\:rounded-\[30px\] {
        border-radius: 30px
    }

    .sm\:rounded-b-xl {
        border-bottom-left-radius: .75rem;
        border-bottom-right-radius: .75rem
    }

    .sm\:rounded-bl-\[10px\] {
        border-bottom-left-radius: 10px
    }

    .sm\:rounded-br-\[10px\] {
        border-bottom-right-radius: 10px
    }

    .sm\:rounded-tl-\[10px\] {
        border-top-left-radius: 10px
    }

    .sm\:rounded-tr-\[10px\] {
        border-top-right-radius: 10px
    }

    .sm\:\  !p-\[8px\] {
        padding: 8px !important
    }

    .sm\:p-3 {
        padding: .75rem
    }

    .sm\:p-4 {
        padding: 1rem
    }

    .sm\:p-5 {
        padding: 1.25rem
    }

    .sm\:p-6 {
        padding: 1.5rem
    }

    .sm\:p-\[10px\] {
        padding: 10px
    }

    .sm\:p-\[14px\] {
        padding: 14px
    }

    .sm\:\  !px-5 {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important
    }

    .sm\:px-0 {
        padding-left: 0;
        padding-right: 0
    }

    .sm\:px-10 {
        padding-left: 2.5rem;
        padding-right: 2.5rem
    }

    .sm\:px-14 {
        padding-left: 3.5rem;
        padding-right: 3.5rem
    }

    .sm\:px-2 {
        padding-left: .5rem;
        padding-right: .5rem
    }

    .sm\:px-3 {
        padding-left: .75rem;
        padding-right: .75rem
    }

    .sm\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem
    }

    .sm\:px-5 {
        padding-left: 1.25rem;
        padding-right: 1.25rem
    }

    .sm\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }

    .sm\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem
    }

    .sm\:px-\[14px\] {
        padding-left: 14px;
        padding-right: 14px
    }

    .sm\:px-\[18px\] {
        padding-left: 18px;
        padding-right: 18px
    }

    .sm\:px-\[30px\] {
        padding-left: 30px;
        padding-right: 30px
    }

    .sm\:px-\[50px\] {
        padding-left: 50px;
        padding-right: 50px
    }

    .sm\:py-0 {
        padding-bottom: 0;
        padding-top: 0
    }

    .sm\:py-1 {
        padding-bottom: .25rem;
        padding-top: .25rem
    }

    .sm\:py-1\.5 {
        padding-bottom: .375rem;
        padding-top: .375rem
    }

    .sm\:py-2 {
        padding-bottom: .5rem;
        padding-top: .5rem
    }

    .sm\:py-2\.5 {
        padding-bottom: .625rem;
        padding-top: .625rem
    }

    .sm\:py-3 {
        padding-bottom: .75rem;
        padding-top: .75rem
    }

    .sm\:py-4 {
        padding-bottom: 1rem;
        padding-top: 1rem
    }

    .sm\:py-5 {
        padding-bottom: 1.25rem;
        padding-top: 1.25rem
    }

    .sm\:py-6 {
        padding-bottom: 1.5rem;
        padding-top: 1.5rem
    }

    .sm\:py-7 {
        padding-bottom: 1.75rem;
        padding-top: 1.75rem
    }

    .sm\:py-8 {
        padding-bottom: 2rem;
        padding-top: 2rem
    }

    .sm\:py-9 {
        padding-bottom: 2.25rem;
        padding-top: 2.25rem
    }

    .sm\:py-\[30px\] {
        padding-bottom: 30px;
        padding-top: 30px
    }

    .sm\:py-\[50px\] {
        padding-bottom: 50px;
        padding-top: 50px
    }

    .sm\:pb-0 {
        padding-bottom: 0
    }

    .sm\:pb-1 {
        padding-bottom: .25rem
    }

    .sm\:pb-16 {
        padding-bottom: 4rem
    }

    .sm\:pb-2 {
        padding-bottom: .5rem
    }

    .sm\:pb-3 {
        padding-bottom: .75rem
    }

    .sm\:pb-5 {
        padding-bottom: 1.25rem
    }

    .sm\:pb-6 {
        padding-bottom: 1.5rem
    }

    .sm\:pb-8 {
        padding-bottom: 2rem
    }

    .sm\:pb-9 {
        padding-bottom: 2.25rem
    }

    .sm\:pl-10 {
        padding-left: 2.5rem
    }

    .sm\:pr-2 {
        padding-right: .5rem
    }

    .sm\:pt-0 {
        padding-top: 0
    }

    .sm\:pt-12 {
        padding-top: 3rem
    }

    .sm\:pt-3 {
        padding-top: .75rem
    }

    .sm\:pt-6 {
        padding-top: 1.5rem
    }

    .sm\:pt-8 {
        padding-top: 2rem
    }

    .sm\:pt-\[85px\] {
        padding-top: 85px
    }

    .sm\:text-center {
        text-align: center
    }

    .sm\:text-2xl {
        font-size: 1.5rem;
        line-height: 2rem
    }

    .sm\:text-3xl {
        font-size: 1.875rem;
        line-height: 2.25rem
    }

    .sm\:text-5xl {
        font-size: 3rem;
        line-height: 1
    }

    .sm\:text-\[14px\] {
        font-size: 14px
    }

    .sm\:text-\[16px\] {
        font-size: 16px
    }

    .sm\:text-\[18px\] {
        font-size: 18px
    }

    .sm\:text-\[2\.25vw\] {
        font-size: 2.25vw
    }

    .sm\:text-\[2\.5vw\] {
        font-size: 2.5vw
    }

    .sm\:text-\[20px\] {
        font-size: 20px
    }

    .sm\:text-\[24px\] {
        font-size: 24px
    }

    .sm\:text-\[2vw\] {
        font-size: 2vw
    }

    .sm\:text-\[30px\] {
        font-size: 30px
    }

    .sm\:text-\[32px\] {
        font-size: 32px
    }

    .sm\:text-\[34px\] {
        font-size: 34px
    }

    .sm\:text-\[3vw\] {
        font-size: 3vw
    }

    .sm\:text-\[40px\] {
        font-size: 40px
    }

    .sm\:text-\[50px\] {
        font-size: 50px
    }

    .sm\:text-\[55px\] {
        font-size: 55px
    }

    .sm\:text-\[60px\] {
        font-size: 60px
    }

    .sm\:text-base {
        font-size: 1rem;
        line-height: 1.5rem
    }

    .sm\:text-lg {
        font-size: 1.125rem;
        line-height: 1.75rem
    }

    .sm\:text-sm {
        font-size: .875rem;
        line-height: 1.25rem
    }

    .sm\:text-xl {
        font-size: 1.25rem;
        line-height: 1.75rem
    }

    .sm\:text-xs {
        font-size: .75rem;
        line-height: 1rem
    }

    .sm\:font-extrabold {
        font-weight: 800
    }

    .sm\:leading-10 {
        line-height: 2.5rem
    }

    .sm\:leading-4 {
        line-height: 1rem
    }

    .sm\:leading-5 {
        line-height: 1.25rem
    }

    .sm\:leading-\[2\.25vw\] {
        line-height: 2.25vw
    }

    .sm\:leading-\[2\.5vw\] {
        line-height: 2.5vw
    }

    .sm\:leading-\[2vw\] {
        line-height: 2vw
    }

    .sm\:leading-\[35px\] {
        line-height: 35px
    }

    .sm\:leading-\[36px\] {
        line-height: 36px
    }

    .sm\:leading-\[55px\] {
        line-height: 55px
    }

    .sm\:leading-\[60px\] {
        line-height: 60px
    }
}

@media (min-width:768px) {
    .md\:absolute {
        position: absolute
    }

    .md\:-top-\[17\%\] {
        top: -17%
    }

    .md\:-top-\[20\%\] {
        top: -20%
    }

    .md\:bottom-8 {
        bottom: 2rem
    }

    .md\:bottom-\[-20px\] {
        bottom: -20px
    }

    .md\:left-\[270px\] {
        left: 270px
    }

    .md\:right-4 {
        right: 1rem
    }

    .md\:right-auto {
        right: auto
    }

    .md\:top-\[-45px\] {
        top: -45px
    }

    .md\:top-\[10px\] {
        top: 10px
    }

    .md\:top-\[90px\] {
        top: 90px
    }

    .md\:order-1 {
        order: 1
    }

    .md\:order-2 {
        order: 2
    }

    .md\:order-3 {
        order: 3
    }

    .md\:order-4 {
        order: 4
    }

    .md\:col-span-1 {
        grid-column: span 1/span 1
    }

    .md\:col-span-2 {
        grid-column: span 2/span 2
    }

    .md\:col-span-3 {
        grid-column: span 3/span 3
    }

    .md\:col-span-5 {
        grid-column: span 5/span 5
    }

    .md\:col-span-9 {
        grid-column: span 9/span 9
    }

    .md\:mx-0 {
        margin-left: 0;
        margin-right: 0
    }

    .md\:mx-5 {
        margin-left: 1.25rem;
        margin-right: 1.25rem
    }

    .md\:mx-\[100px\] {
        margin-left: 100px;
        margin-right: 100px
    }

    .md\:mx-\[10px\] {
        margin-left: 10px;
        margin-right: 10px
    }

    .md\:mx-\[20px\] {
        margin-left: 20px;
        margin-right: 20px
    }

    .md\:my-0 {
        margin-bottom: 0;
        margin-top: 0
    }

    .md\:my-2 {
        margin-bottom: .5rem;
        margin-top: .5rem
    }

    .md\:my-5 {
        margin-bottom: 1.25rem;
        margin-top: 1.25rem
    }

    .md\:-mt-\[200px\] {
        margin-top: -200px
    }

    .md\:mb-0 {
        margin-bottom: 0
    }

    .md\:mb-10 {
        margin-bottom: 2.5rem
    }

    .md\:mb-2 {
        margin-bottom: .5rem
    }

    .md\:mb-3 {
        margin-bottom: .75rem
    }

    .md\:mb-4 {
        margin-bottom: 1rem
    }

    .md\:mb-5 {
        margin-bottom: 1.25rem
    }

    .md\:mb-6 {
        margin-bottom: 1.5rem
    }

    .md\:mb-\[-50px\] {
        margin-bottom: -50px
    }

    .md\:ml-4 {
        margin-left: 1rem
    }

    .md\:mr-2 {
        margin-right: .5rem
    }

    .md\:mr-3 {
        margin-right: .75rem
    }

    .md\:mr-\[10px\] {
        margin-right: 10px
    }

    .md\:ms-auto {
        margin-inline-start: auto
    }

    .md\:mt-0 {
        margin-top: 0
    }

    .md\:mt-1 {
        margin-top: .25rem
    }

    .md\:mt-10 {
        margin-top: 2.5rem
    }

    .md\:mt-11 {
        margin-top: 2.75rem
    }

    .md\:mt-2 {
        margin-top: .5rem
    }

    .md\:mt-20 {
        margin-top: 5rem
    }

    .md\:mt-24 {
        margin-top: 6rem
    }

    .md\:mt-3 {
        margin-top: .75rem
    }

    .md\:mt-4 {
        margin-top: 1rem
    }

    .md\:mt-5 {
        margin-top: 1.25rem
    }

    .md\:mt-6 {
        margin-top: 1.5rem
    }

    .md\:mt-7 {
        margin-top: 1.75rem
    }

    .md\:mt-8 {
        margin-top: 2rem
    }

    .md\:mt-\[-30px\] {
        margin-top: -30px
    }

    .md\:mt-\[10px\] {
        margin-top: 10px
    }

    .md\:mt-\[20px\] {
        margin-top: 20px
    }

    .md\:mt-\[30px\] {
        margin-top: 30px
    }

    .md\:\  !block {
        display: block !important
    }

    .md\:block {
        display: block
    }

    .md\:\  !flex {
        display: flex !important
    }

    .md\:flex {
        display: flex
    }

    .md\:grid {
        display: grid
    }

    .md\:hidden {
        display: none
    }

    .md\:\  !h-\[35px\] {
        height: 35px !important
    }

    .md\:h-10 {
        height: 2.5rem
    }

    .md\:h-16 {
        height: 4rem
    }

    .md\:h-20 {
        height: 5rem
    }

    .md\:h-3 {
        height: .75rem
    }

    .md\:h-4 {
        height: 1rem
    }

    .md\:h-40 {
        height: 10rem
    }

    .md\:h-48 {
        height: 12rem
    }

    .md\:h-5 {
        height: 1.25rem
    }

    .md\:h-6 {
        height: 1.5rem
    }

    .md\:h-9 {
        height: 2.25rem
    }

    .md\:h-\[100px\] {
        height: 100px
    }

    .md\:h-\[120px\] {
        height: 120px
    }

    .md\:h-\[140px\] {
        height: 140px
    }

    .md\:h-\[150px\] {
        height: 150px
    }

    .md\:h-\[160px\] {
        height: 160px
    }

    .md\:h-\[200px\] {
        height: 200px
    }

    .md\:h-\[20px\] {
        height: 20px
    }

    .md\:h-\[225px\] {
        height: 225px
    }

    .md\:h-\[25px\] {
        height: 25px
    }

    .md\:h-\[2px\] {
        height: 2px
    }

    .md\:h-\[30px\] {
        height: 30px
    }

    .md\:h-\[35px\] {
        height: 35px
    }

    .md\:h-\[36px\] {
        height: 36px
    }

    .md\:h-\[40px\] {
        height: 40px
    }

    .md\:h-\[420px\] {
        height: 420px
    }

    .md\:h-\[45px\] {
        height: 45px
    }

    .md\:h-\[50px\] {
        height: 50px
    }

    .md\:h-\[55px\] {
        height: 55px
    }

    .md\:h-\[56px\] {
        height: 56px
    }

    .md\:h-\[75px\] {
        height: 75px
    }

    .md\:h-\[89px\] {
        height: 89px
    }

    .md\:h-\[90px\] {
        height: 90px
    }

    .md\:h-\[95px\] {
        height: 95px
    }

    .md\:h-auto {
        height: auto
    }

    .md\:h-full {
        height: 100%
    }

    .md\:max-h-\[350px\] {
        max-height: 350px
    }

    .md\:min-h-\[100px\] {
        min-height: 100px
    }

    .md\:min-h-\[27\.83px\] {
        min-height: 27.83px
    }

    .md\:min-h-\[56px\] {
        min-height: 56px
    }

    .md\:\  !w-\[105px\] {
        width: 105px !important
    }

    .md\:\  !w-\[200px\] {
        width: 200px !important
    }

    .md\:\  !w-\[300px\] {
        width: 300px !important
    }

    .md\:\  !w-\[35px\] {
        width: 35px !important
    }

    .md\:\  !w-\[4\.25em\] {
        width: 4.25em !important
    }

    .md\:\  !w-\[75px\] {
        width: 75px !important
    }

    .md\:w-0 {
        width: 0
    }

    .md\:w-1\/2 {
        width: 50%
    }

    .md\:w-10 {
        width: 2.5rem
    }

    .md\:w-16 {
        width: 4rem
    }

    .md\:w-20 {
        width: 5rem
    }

    .md\:w-32 {
        width: 8rem
    }

    .md\:w-4 {
        width: 1rem
    }

    .md\:w-40 {
        width: 10rem
    }

    .md\:w-48 {
        width: 12rem
    }

    .md\:w-5 {
        width: 1.25rem
    }

    .md\:w-6 {
        width: 1.5rem
    }

    .md\:w-8 {
        width: 2rem
    }

    .md\:w-\[1000px\] {
        width: 1000px
    }

    .md\:w-\[100px\] {
        width: 100px
    }

    .md\:w-\[120px\] {
        width: 120px
    }

    .md\:w-\[130px\] {
        width: 130px
    }

    .md\:w-\[14px\] {
        width: 14px
    }

    .md\:w-\[150px\] {
        width: 150px
    }

    .md\:w-\[160px\] {
        width: 160px
    }

    .md\:w-\[20px\] {
        width: 20px
    }

    .md\:w-\[22px\] {
        width: 22px
    }

    .md\:w-\[250px\] {
        width: 250px
    }

    .md\:w-\[25px\] {
        width: 25px
    }

    .md\:w-\[28px\] {
        width: 28px
    }

    .md\:w-\[30px\] {
        width: 30px
    }

    .md\:w-\[320px\] {
        width: 320px
    }

    .md\:w-\[32px\] {
        width: 32px
    }

    .md\:w-\[35px\] {
        width: 35px
    }

    .md\:w-\[36px\] {
        width: 36px
    }

    .md\:w-\[40\%\] {
        width: 40%
    }

    .md\:w-\[400px\] {
        width: 400px
    }

    .md\:w-\[40px\] {
        width: 40px
    }

    .md\:w-\[500px\] {
        width: 500px
    }

    .md\:w-\[50px\] {
        width: 50px
    }

    .md\:w-\[55px\] {
        width: 55px
    }

    .md\:w-\[60\%\] {
        width: 60%
    }

    .md\:w-\[600px\] {
        width: 600px
    }

    .md\:w-\[65px\] {
        width: 65px
    }

    .md\:w-\[70\%\] {
        width: 70%
    }

    .md\:w-\[750px\] {
        width: 750px
    }

    .md\:w-\[75px\] {
        width: 75px
    }

    .md\:w-\[85px\] {
        width: 85px
    }

    .md\:w-\[89px\] {
        width: 89px
    }

    .md\:w-\[90px\] {
        width: 90px
    }

    .md\:w-\[95px\] {
        width: 95px
    }

    .md\:w-auto {
        width: auto
    }

    .md\:w-fit {
        width: -moz-fit-content;
        width: fit-content
    }

    .md\:w-full {
        width: 100%
    }

    .md\:min-w-\[100px\] {
        min-width: 100px
    }

    .md\:min-w-\[120px\] {
        min-width: 120px
    }

    .md\:min-w-\[130px\] {
        min-width: 130px
    }

    .md\:min-w-\[240px\] {
        min-width: 240px
    }

    .md\:min-w-\[275px\] {
        min-width: 275px
    }

    .md\:min-w-\[80px\] {
        min-width: 80px
    }

    .md\:max-w-\[250px\] {
        max-width: 250px
    }

    .md\:max-w-\[300px\] {
        max-width: 300px
    }

    .md\:max-w-\[350px\] {
        max-width: 350px
    }

    .md\:max-w-\[500px\] {
        max-width: 500px
    }

    .md\:max-w-\[600px\] {
        max-width: 600px
    }

    .md\:max-w-\[630px\] {
        max-width: 630px
    }

    .md\:max-w-\[750px\] {
        max-width: 750px
    }

    .md\:max-w-\[90\%\] {
        max-width: 90%
    }

    .md\:max-w-\[95\%\] {
        max-width: 95%
    }

    .md\:grow-0 {
        flex-grow: 0
    }

    .md\:basis-4\/12 {
        flex-basis: 33.333333%
    }

    .md\:basis-8\/12 {
        flex-basis: 66.666667%
    }

    .md\:grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .md\:grid-cols-11 {
        grid-template-columns: repeat(11, minmax(0, 1fr))
    }

    .md\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .md\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .md\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .md\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr))
    }

    .md\:grid-cols-7 {
        grid-template-columns: repeat(7, minmax(0, 1fr))
    }

    .md\:grid-rows-3 {
        grid-template-rows: repeat(3, minmax(0, 1fr))
    }

    .md\:flex-row {
        flex-direction: row
    }

    .md\:flex-col {
        flex-direction: column
    }

    .md\:flex-col-reverse {
        flex-direction: column-reverse
    }

    .md\:items-start {
        align-items: flex-start
    }

    .md\:items-center {
        align-items: center
    }

    .md\:justify-start {
        justify-content: flex-start
    }

    .md\:justify-center {
        justify-content: center
    }

    .md\:justify-between {
        justify-content: space-between
    }

    .md\:gap-0 {
        gap: 0
    }

    .md\:gap-12 {
        gap: 3rem
    }

    .md\:gap-2 {
        gap: .5rem
    }

    .md\:gap-3 {
        gap: .75rem
    }

    .md\:gap-4 {
        gap: 1rem
    }

    .md\:gap-5 {
        gap: 1.25rem
    }

    .md\:gap-6 {
        gap: 1.5rem
    }

    .md\:gap-8 {
        gap: 2rem
    }

    .md\:gap-\[10px\] {
        gap: 10px
    }

    .md\:gap-x-10 {
        -moz-column-gap: 2.5rem;
        column-gap: 2.5rem
    }

    .md\:gap-x-5 {
        -moz-column-gap: 1.25rem;
        column-gap: 1.25rem
    }

    .md\:gap-y-1 {
        row-gap: .25rem
    }

    .md\:space-y-3>:not([hidden])~:not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-bottom: calc(.75rem*var(--tw-space-y-reverse));
        margin-top: calc(.75rem*(1 - var(--tw-space-y-reverse)))
    }

    .md\:justify-self-center {
        justify-self: center
    }

    .md\:overflow-hidden {
        overflow: hidden
    }

    .md\:\  !rounded-\[10px\] {
        border-radius: 10px !important
    }

    .md\:\  !rounded-\[12px\] {
        border-radius: 12px !important
    }

    .md\:\  !rounded-\[20px\] {
        border-radius: 20px !important
    }

    .md\:rounded-3xl {
        border-radius: 1.5rem
    }

    .md\:rounded-\[50px\] {
        border-radius: 50px
    }

    .md\:rounded-\[5px\] {
        border-radius: 5px
    }

    .md\:rounded-full {
        border-radius: 9999px
    }

    .md\:rounded-md {
        border-radius: .375rem
    }

    .md\:rounded-none {
        border-radius: 0
    }

    .md\:rounded-xl {
        border-radius: .75rem
    }

    .md\:rounded-b-md {
        border-bottom-left-radius: .375rem;
        border-bottom-right-radius: .375rem
    }

    .md\:rounded-b-none {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0
    }

    .md\:rounded-t-\[50px\] {
        border-top-left-radius: 50px;
        border-top-right-radius: 50px
    }

    .md\:rounded-bl-\[12px\] {
        border-bottom-left-radius: 12px
    }

    .md\:rounded-br-\[12px\] {
        border-bottom-right-radius: 12px
    }

    .md\:rounded-tl-\[12px\] {
        border-top-left-radius: 12px
    }

    .md\:rounded-tr-\[12px\] {
        border-top-right-radius: 12px
    }

    .md\:border {
        border-width: 1px
    }

    .md\:border-4,
    .md\:border-\[4px\] {
        border-width: 4px
    }

    .md\:border-\[6px\] {
        border-width: 6px
    }

    .md\:border-none {
        border-style: none
    }

    .md\:border-\[rgba\(228\, 229\, 230\, \.5\)\] {
        border-color: #e4e6e780
    }

    .md\:border-line {
        border-color: var(--line)
    }

    .md\:\  !bg-content-light {
        background-color: var(--content-light) !important
    }

    .md\:\  !bg-white {
        --tw-bg-opacity: 1 !important;
        background-color: rgb(255 255 255/var(--tw-bg-opacity)) !important
    }

    .md\:bg-\[var\(--auth-input-wrapper-bg\)\] {
        background-color: var(--auth-input-wrapper-bg)
    }

    .md\:bg-content {
        background-color: var(--content)
    }

    .md\:bg-primary-light {
        background-color: var(--primary-light)
    }

    .md\:bg-transparent {
        background-color: transparent
    }

    .md\:bg-right {
        background-position: 100%
    }

    .md\:\  !p-10 {
        padding: 2.5rem !important
    }

    .md\:\  !p-4 {
        padding: 1rem !important
    }

    .md\:p-0 {
        padding: 0
    }

    .md\:p-2 {
        padding: .5rem
    }

    .md\:p-3 {
        padding: .75rem
    }

    .md\:p-4 {
        padding: 1rem
    }

    .md\:p-6 {
        padding: 1.5rem
    }

    .md\:p-8 {
        padding: 2rem
    }

    .md\:p-\[10px\] {
        padding: 10px
    }

    .md\:p-\[20px\] {
        padding: 20px
    }

    .md\:\  !px-14 {
        padding-left: 3.5rem !important;
        padding-right: 3.5rem !important
    }

    .md\:\  !px-5 {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important
    }

    .md\:\  !px-8 {
        padding-left: 2rem !important;
        padding-right: 2rem !important
    }

    .md\:\  !py-3 {
        padding-bottom: .75rem !important;
        padding-top: .75rem !important
    }

    .md\:px-0 {
        padding-left: 0;
        padding-right: 0
    }

    .md\:px-10 {
        padding-left: 2.5rem;
        padding-right: 2.5rem
    }

    .md\:px-2 {
        padding-left: .5rem;
        padding-right: .5rem
    }

    .md\:px-24 {
        padding-left: 6rem;
        padding-right: 6rem
    }

    .md\:px-3 {
        padding-left: .75rem;
        padding-right: .75rem
    }

    .md\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem
    }

    .md\:px-5 {
        padding-left: 1.25rem;
        padding-right: 1.25rem
    }

    .md\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }

    .md\:px-7 {
        padding-left: 1.75rem;
        padding-right: 1.75rem
    }

    .md\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem
    }

    .md\:px-\[150px\] {
        padding-left: 150px;
        padding-right: 150px
    }

    .md\:px-\[20px\] {
        padding-left: 20px;
        padding-right: 20px
    }

    .md\:px-\[30px\] {
        padding-left: 30px;
        padding-right: 30px
    }

    .md\:px-\[6px\] {
        padding-left: 6px;
        padding-right: 6px
    }

    .md\:py-0 {
        padding-bottom: 0;
        padding-top: 0
    }

    .md\:py-10 {
        padding-bottom: 2.5rem;
        padding-top: 2.5rem
    }

    .md\:py-2 {
        padding-bottom: .5rem;
        padding-top: .5rem
    }

    .md\:py-2\.5 {
        padding-bottom: .625rem;
        padding-top: .625rem
    }

    .md\:py-28 {
        padding-bottom: 7rem;
        padding-top: 7rem
    }

    .md\:py-3 {
        padding-bottom: .75rem;
        padding-top: .75rem
    }

    .md\:py-4 {
        padding-bottom: 1rem;
        padding-top: 1rem
    }

    .md\:py-5 {
        padding-bottom: 1.25rem;
        padding-top: 1.25rem
    }

    .md\:py-6 {
        padding-bottom: 1.5rem;
        padding-top: 1.5rem
    }

    .md\:py-8 {
        padding-bottom: 2rem;
        padding-top: 2rem
    }

    .md\:py-\[10px\] {
        padding-bottom: 10px;
        padding-top: 10px
    }

    .md\:py-\[25px\] {
        padding-bottom: 25px;
        padding-top: 25px
    }

    .md\:py-\[30px\] {
        padding-bottom: 30px;
        padding-top: 30px
    }

    .md\:py-\[6px\] {
        padding-bottom: 6px;
        padding-top: 6px
    }

    .md\:\  !pl-\[45px\] {
        padding-left: 45px !important
    }

    .md\:\  !pl-\[55px\] {
        padding-left: 55px !important
    }

    .md\:pb-0 {
        padding-bottom: 0
    }

    .md\:pb-1 {
        padding-bottom: .25rem
    }

    .md\:pb-10 {
        padding-bottom: 2.5rem
    }

    .md\:pb-2 {
        padding-bottom: .5rem
    }

    .md\:pb-4 {
        padding-bottom: 1rem
    }

    .md\:pb-5 {
        padding-bottom: 1.25rem
    }

    .md\:pb-6 {
        padding-bottom: 1.5rem
    }

    .md\:pb-7 {
        padding-bottom: 1.75rem
    }

    .md\:pb-8 {
        padding-bottom: 2rem
    }

    .md\:pl-0 {
        padding-left: 0
    }

    .md\:pl-10 {
        padding-left: 2.5rem
    }

    .md\:pl-7 {
        padding-left: 1.75rem
    }

    .md\:pl-8 {
        padding-left: 2rem
    }

    .md\:pl-\[42px\] {
        padding-left: 42px
    }

    .md\:pl-\[50px\] {
        padding-left: 50px
    }

    .md\:pr-12 {
        padding-right: 3rem
    }

    .md\:pt-0 {
        padding-top: 0
    }

    .md\:pt-10 {
        padding-top: 2.5rem
    }

    .md\:pt-16 {
        padding-top: 4rem
    }

    .md\:pt-3 {
        padding-top: .75rem
    }

    .md\:pt-6 {
        padding-top: 1.5rem
    }

    .md\:pt-8 {
        padding-top: 2rem
    }

    .md\:text-left {
        text-align: left
    }

    .md\:\  !text-\[16px\] {
        font-size: 16px !important
    }

    .md\:\  !text-base {
        font-size: 1rem !important;
        line-height: 1.5rem !important
    }

    .md\:\  !text-sm {
        font-size: .875rem !important;
        line-height: 1.25rem !important
    }

    .md\:\  !text-xs {
        font-size: .75rem !important;
        line-height: 1rem !important
    }

    .md\:text-2xl {
        font-size: 1.5rem;
        line-height: 2rem
    }

    .md\:text-3xl {
        font-size: 1.875rem;
        line-height: 2.25rem
    }

    .md\:text-4xl {
        font-size: 2.25rem;
        line-height: 2.5rem
    }

    .md\:text-\[11px\] {
        font-size: 11px
    }

    .md\:text-\[13px\] {
        font-size: 13px
    }

    .md\:text-\[15px\] {
        font-size: 15px
    }

    .md\:text-\[16px\] {
        font-size: 16px
    }

    .md\:text-\[17px\] {
        font-size: 17px
    }

    .md\:text-\[22px\] {
        font-size: 22px
    }

    .md\:text-\[30px\] {
        font-size: 30px
    }

    .md\:text-\[35px\] {
        font-size: 35px
    }

    .md\:text-\[38px\] {
        font-size: 38px
    }

    .md\:text-\[40px\] {
        font-size: 40px
    }

    .md\:text-\[50px\] {
        font-size: 50px
    }

    .md\:text-\[80px\] {
        font-size: 80px
    }

    .md\:text-base {
        font-size: 1rem;
        line-height: 1.5rem
    }

    .md\:text-lg {
        font-size: 1.125rem;
        line-height: 1.75rem
    }

    .md\:text-sm {
        font-size: .875rem;
        line-height: 1.25rem
    }

    .md\:text-xl {
        font-size: 1.25rem;
        line-height: 1.75rem
    }

    .md\:text-xs {
        font-size: .75rem;
        line-height: 1rem
    }

    .md\:font-bold {
        font-weight: 700
    }

    .md\:font-normal {
        font-weight: 400
    }

    .md\:text-primary {
        color: var(--primary)
    }
}

@media (min-width:1024px) {
    .lg\:order-1 {
        order: 1
    }

    .lg\:order-2 {
        order: 2
    }

    .lg\:col-span-1 {
        grid-column: span 1/span 1
    }

    .lg\:col-span-10 {
        grid-column: span 10/span 10
    }

    .lg\:col-span-2 {
        grid-column: span 2/span 2
    }

    .lg\:col-span-3 {
        grid-column: span 3/span 3
    }

    .lg\:mb-0 {
        margin-bottom: 0
    }

    .lg\:mb-3 {
        margin-bottom: .75rem
    }

    .lg\:mt-0 {
        margin-top: 0
    }

    .lg\:mt-10 {
        margin-top: 2.5rem
    }

    .lg\:mt-3 {
        margin-top: .75rem
    }

    .lg\:mt-5 {
        margin-top: 1.25rem
    }

    .lg\:mt-\[18px\] {
        margin-top: 18px
    }

    .lg\:block {
        display: block
    }

    .lg\:flex {
        display: flex
    }

    .lg\:grid {
        display: grid
    }

    .lg\:hidden {
        display: none
    }

    .lg\:\  !h-10 {
        height: 2.5rem !important
    }

    .lg\:h-\[160px\] {
        height: 160px
    }

    .lg\:h-\[300px\] {
        height: 300px
    }

    .lg\:h-\[30px\] {
        height: 30px
    }

    .lg\:h-\[70px\] {
        height: 70px
    }

    .lg\:h-\[90px\] {
        height: 90px
    }

    .lg\:min-h-\[125px\] {
        min-height: 125px
    }

    .lg\:\  !w-\[250px\] {
        width: 250px !important
    }

    .lg\:w-1\/2 {
        width: 50%
    }

    .lg\:w-1\/4 {
        width: 25%
    }

    .lg\:w-2\/4 {
        width: 50%
    }

    .lg\:w-\[1000px\] {
        width: 1000px
    }

    .lg\:w-\[130px\] {
        width: 130px
    }

    .lg\:w-\[500px\] {
        width: 500px
    }

    .lg\:w-\[60\%\] {
        width: 60%
    }

    .lg\:w-\[70px\] {
        width: 70px
    }

    .lg\:w-\[900px\] {
        width: 900px
    }

    .lg\:w-\[90px\] {
        width: 90px
    }

    .lg\:max-w-\[1032px\] {
        max-width: 1032px
    }

    .lg\:max-w-\[450px\] {
        max-width: 450px
    }

    .lg\:max-w-\[506px\] {
        max-width: 506px
    }

    .lg\:max-w-\[550px\] {
        max-width: 550px
    }

    .lg\:max-w-\[820px\] {
        max-width: 820px
    }

    .lg\:max-w-\[85\%\] {
        max-width: 85%
    }

    .lg\:max-w-\[900px\] {
        max-width: 900px
    }

    .lg\:grid-cols-12 {
        grid-template-columns: repeat(12, minmax(0, 1fr))
    }

    .lg\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .lg\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .lg\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .lg\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr))
    }

    .lg\:grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }

    .lg\:grid-cols-8 {
        grid-template-columns: repeat(8, minmax(0, 1fr))
    }

    .lg\:flex-row {
        flex-direction: row
    }

    .lg\:justify-between {
        justify-content: space-between
    }

    .lg\:gap-10 {
        gap: 2.5rem
    }

    .lg\:gap-4 {
        gap: 1rem
    }

    .lg\:gap-5 {
        gap: 1.25rem
    }

    .lg\:gap-6 {
        gap: 1.5rem
    }

    .lg\:gap-8 {
        gap: 2rem
    }

    .lg\:gap-x-12 {
        -moz-column-gap: 3rem;
        column-gap: 3rem
    }

    .lg\:gap-y-2 {
        row-gap: .5rem
    }

    .lg\:bg-content-light {
        background-color: var(--content-light)
    }

    .lg\:bg-none {
        background-image: none
    }

    .lg\:p-0 {
        padding: 0
    }

    .lg\:p-8 {
        padding: 2rem
    }

    .lg\:px-0 {
        padding-left: 0;
        padding-right: 0
    }

    .lg\:px-10 {
        padding-left: 2.5rem;
        padding-right: 2.5rem
    }

    .lg\:px-12 {
        padding-left: 3rem;
        padding-right: 3rem
    }

    .lg\:px-3 {
        padding-left: .75rem;
        padding-right: .75rem
    }

    .lg\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }

    .lg\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem
    }

    .lg\:px-\[50px\] {
        padding-left: 50px;
        padding-right: 50px
    }

    .lg\:py-12 {
        padding-bottom: 3rem;
        padding-top: 3rem
    }

    .lg\:py-2 {
        padding-bottom: .5rem;
        padding-top: .5rem
    }

    .lg\:py-4 {
        padding-bottom: 1rem;
        padding-top: 1rem
    }

    .lg\:py-7 {
        padding-bottom: 1.75rem;
        padding-top: 1.75rem
    }

    .lg\:py-\[10px\] {
        padding-bottom: 10px;
        padding-top: 10px
    }

    .lg\:py-\[30px\] {
        padding-bottom: 30px;
        padding-top: 30px
    }

    .lg\:pt-10 {
        padding-top: 2.5rem
    }

    .lg\:text-left {
        text-align: left
    }

    .lg\:text-2xl {
        font-size: 1.5rem;
        line-height: 2rem
    }

    .lg\:text-3xl {
        font-size: 1.875rem;
        line-height: 2.25rem
    }

    .lg\:text-\[14px\] {
        font-size: 14px
    }

    .lg\:text-\[15px\] {
        font-size: 15px
    }

    .lg\:text-\[18px\] {
        font-size: 18px
    }

    .lg\:text-\[26px\] {
        font-size: 26px
    }

    .lg\:text-\[40px\] {
        font-size: 40px
    }

    .lg\:text-\[48px\] {
        font-size: 48px
    }

    .lg\:text-base {
        font-size: 1rem;
        line-height: 1.5rem
    }

    .lg\:text-lg {
        font-size: 1.125rem;
        line-height: 1.75rem
    }

    .lg\:text-sm {
        font-size: .875rem;
        line-height: 1.25rem
    }

    .lg\:font-bold {
        font-weight: 700
    }

    .lg\:leading-5 {
        line-height: 1.25rem
    }
}

@media (min-width:1280px) {
    .xl\:col-span-1 {
        grid-column: span 1/span 1
    }

    .xl\:col-span-2 {
        grid-column: span 2/span 2
    }

    .xl\:col-span-3 {
        grid-column: span 3/span 3
    }

    .xl\:col-span-4 {
        grid-column: span 4/span 4
    }

    .xl\:col-span-7 {
        grid-column: span 7/span 7
    }

    .xl\:col-span-8 {
        grid-column: span 8/span 8
    }

    .xl\:mx-\[250px\] {
        margin-left: 250px;
        margin-right: 250px
    }

    .xl\:mt-4 {
        margin-top: 1rem
    }

    .xl\:hidden {
        display: none
    }

    .xl\:h-\[90px\] {
        height: 90px
    }

    .xl\:w-3\/4 {
        width: 75%
    }

    .xl\:w-\[250px\] {
        width: 250px
    }

    .xl\:w-\[70\%\] {
        width: 70%
    }

    .xl\:w-\[80\%\] {
        width: 80%
    }

    .xl\:w-\[90\%\] {
        width: 90%
    }

    .xl\:w-full {
        width: 100%
    }

    .xl\:max-w-\[100\%\] {
        max-width: 100%
    }

    .xl\:max-w-\[70\%\] {
        max-width: 70%
    }

    .xl\:max-w-\[75\%\] {
        max-width: 75%
    }

    .xl\:max-w-\[85\%\] {
        max-width: 85%
    }

    .xl\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .xl\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .xl\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .xl\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr))
    }

    .xl\:grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }

    .xl\:grid-cols-8 {
        grid-template-columns: repeat(8, minmax(0, 1fr))
    }

    .xl\:flex-col-reverse {
        flex-direction: column-reverse
    }

    .xl\:gap-5 {
        gap: 1.25rem
    }

    .xl\:gap-6 {
        gap: 1.5rem
    }

    .xl\:gap-x-8 {
        -moz-column-gap: 2rem;
        column-gap: 2rem
    }

    .xl\:justify-self-auto {
        justify-self: auto
    }

    .xl\:p-6 {
        padding: 1.5rem
    }

    .xl\:\  !px-12 {
        padding-left: 3rem !important;
        padding-right: 3rem !important
    }

    .xl\:px-0 {
        padding-left: 0;
        padding-right: 0
    }

    .xl\:px-2 {
        padding-left: .5rem;
        padding-right: .5rem
    }

    .xl\:px-3 {
        padding-left: .75rem;
        padding-right: .75rem
    }

    .xl\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }

    .xl\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem
    }

    .xl\:py-4 {
        padding-bottom: 1rem;
        padding-top: 1rem
    }

    .xl\:py-6 {
        padding-bottom: 1.5rem;
        padding-top: 1.5rem
    }

    .xl\:pb-\[150px\] {
        padding-bottom: 150px
    }

    .xl\:pl-10 {
        padding-left: 2.5rem
    }

    .xl\:pl-4 {
        padding-left: 1rem
    }

    .xl\:text-2xl {
        font-size: 1.5rem;
        line-height: 2rem
    }

    .xl\:text-\[14px\] {
        font-size: 14px
    }

    .xl\:text-\[32px\] {
        font-size: 32px
    }

    .xl\:text-base {
        font-size: 1rem;
        line-height: 1.5rem
    }

    .xl\:text-sm {
        font-size: .875rem;
        line-height: 1.25rem
    }

    .xl\:text-xl {
        font-size: 1.25rem;
        line-height: 1.75rem
    }
}

@media (min-width:1536px) {
    .\32xl\:col-span-10 {
        grid-column: span 10/span 10
    }

    .\32xl\:col-span-2 {
        grid-column: span 2/span 2
    }

    .\32xl\:col-span-9 {
        grid-column: span 9/span 9
    }

    .\32xl\:mt-0 {
        margin-top: 0
    }

    .\32xl\:min-h-\[150px\] {
        min-height: 150px
    }

    .\32xl\:w-\[15\%\] {
        width: 15%
    }

    .\32xl\:w-\[65\%\] {
        width: 65%
    }

    .\32xl\:w-\[80\%\] {
        width: 80%
    }

    .\32xl\:w-\[80px\] {
        width: 80px
    }

    .\32xl\:w-\[90\%\] {
        width: 90%
    }

    .\32xl\:max-w-\[80\%\] {
        max-width: 80%
    }

    .\32xl\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .\32xl\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr))
    }

    .\32xl\:grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }

    .\32xl\:flex-row {
        flex-direction: row
    }

    .\32xl\:gap-4 {
        gap: 1rem
    }

    .\32xl\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem
    }

    .\32xl\:py-3 {
        padding-bottom: .75rem;
        padding-top: .75rem
    }

    .\32xl\:pb-8 {
        padding-bottom: 2rem
    }

    .\32xl\:text-base {
        font-size: 1rem;
        line-height: 1.5rem
    }
}

.btn {
    background-color: transparent;
    border: unset;
    border-radius: var(--o-border-radius);
    display: inline-block;
    padding: var(--o-padding);
    text-decoration: none;
    transition: all .3s
}

.btn.primary {
    border: 1.5px solid #132358
}

.btn.alternative,
.btn.primary {
    background: var(--secondary) !important;
    color: var(--content) !important;
    overflow: hidden;
    position: relative;
    transition: all .3s
}

.btn.alternative {
    border: none
}

.btn.btn-install {
    background: var(--secondary) !important;
    color: var(--content) !important
}

.btn.btn-install,
.btn.main {
    overflow: hidden;
    position: relative;
    transition: all .3s
}

.btn.main {
    background: var(--bg-main);
    color: #fff
}

.btn.shining {
    background: var(--secondary) !important;
    color: var(--content) !important
}

.btn.shining,
.btn.shining-2 {
    overflow: hidden;
    position: relative;
    transition: all .3s
}

.isDesktop .btn.shining-2:hover:after,
.isDesktop .btn.shining:hover:after {
    animation: shiningAnimation 2s ease infinite;
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0), #fff 50%, hsla(0, 0%, 100%, 0));
    content: "";
    height: 40%;
    left: -10%;
    opacity: .3;
    position: absolute;
    top: 0;
    transition: all 1s;
    width: 500%
}

.isDesktop .btn.shining-2.slow:hover:after,
.isDesktop .btn.shining.slow:hover:after {
    animation-duration: 4s
}

@keyframes shiningAnimation {
    0% {
        transform: translate(-50%) rotate(-25deg)
    }

    to {
        transform: translate(100%) rotate(-25deg)
    }
}

.btn.outline-primary {
    background-color: transparent;
    border: 1px solid var(--primary);
    color: var(--primary);
    position: relative
}

.isDesktop .btn.outline-primary:not(:disabled):hover {
    box-shadow: var(--shadow-main-hover)
}

.forgot-password-login,
.login-sign-up,
.reg-login {
    background-color: transparent;
    border: 1px solid var(--primary);
    color: var(--primary);
    position: relative
}

.btn.cancel {
    background-color: #9e9e9e;
    color: #fff
}

.btn.outline-black {
    background-color: transparent;
    border: 1px solid #d6d6d6;
    color: #000;
    position: relative
}

.isDesktop .btn.outline-black:not(:disabled):hover {
    box-shadow: #d6d6d6
}

.btn.danger {
    background-color: transparent;
    color: var(--danger)
}

.isDesktop .btn.danger:hover {
    border: 1px solid var(--danger)
}

.btn:disabled {
    opacity: .6
}

.btn.rotating {
    animation: rotating 2s linear infinite;
    cursor: pointer;
    transition: all .3s
}

@keyframes rotating {
    0% {
        -webkit-transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(1turn)
    }
}

.btn.secondary {
    background: var(--primary);
    color: #fff;
    overflow: hidden;
    position: relative;
    transition: all .3s
}

.topbar_btn_1 {
    background-color: transparent;
    border: 1px solid #fff;
    border-radius: 5px;
    color: #fff !important
}

.topbar_btn_1,
.topbar_btn_2 {
    font-size: 16px;
    font-weight: 400;
    height: 35px;
    padding: 0 15px;
    text-transform: uppercase;
    white-space: nowrap
}

.topbar_btn_2 {
    background: var(--secondary);
    border: 1px solid var(--secondary);
    border-radius: 5px;
    color: #000
}

@media (max-width:767px) {

    .topbar_btn_1,
    .topbar_btn_2 {
        font-size: 12px;
        height: 29px;
        padding: 0 10px
    }
}

.contact_btn,
.launch_btn_bg {
    background: var(--bg-main)
}

.p-btn {
    background-color: var(--content-light);
    border: 1px solid var(--line);
    color: var(--text-base)
}

.p-btn.active {
    background-color: var(--secondary) !important;
    border: 1px solid var(--secondary);
    color: var(--content) !important
}

.p-next svg path,
.p-prev svg path {
    fill: #757575
}

.p-dot {
    color: #757575
}

.search_btn {
    background: var(--primary);
    color: #fff
}

.clean_search path {
    fill: #000
}

.lottery_tab_btn {
    align-items: center;
    background: transparent;
    border-radius: 50px;
    color: #fff;
    display: flex;
    font-size: 16px;
    font-weight: 700;
    justify-content: center;
    padding: 5px 30px;
    text-transform: uppercase;
    transition: all .3s
}

.lottery_tab_btn.active {
    background: var(--secondary) !important;
    color: var(--content) !important
}

.promotion_tab_btn {
    align-items: center;
    background-color: #00000080;
    color: #fff;
    display: flex;
    flex-shrink: 0;
    font-size: 16px;
    font-weight: 400;
    margin-right: 10px;
    padding: 10px 20px;
    text-transform: uppercase
}

.promotion_tab_btn.active {
    background: var(--secondary) !important;
    color: #000
}

.promotion_tab_btn:last-child {
    margin-right: 0
}

.btn_apply_promotion {
    background: var(--bg-main);
    border: unset;
    border-radius: 5px;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    padding: 5px 20px
}

.dairy_btn_1 {
    background: var(--secondary);
    color: var(--content) !important;
    padding: 6px 0
}

.dairy_btn_1,
.dairy_btn_2 {
    align-items: center;
    border-radius: 50px;
    display: flex;
    font-size: 16px;
    font-weight: 700;
    justify-content: center;
    width: 100%
}

.dairy_btn_2 {
    background-color: transparent;
    border: 1px solid #52525b;
    color: #f4f4f5;
    padding: 5px 0
}

.btn_mission_calendar_1 {
    align-items: center;
    background: var(--secondary);
    border-radius: 50px;
    color: var(--content) !important;
    display: flex;
    font-size: 14px;
    font-weight: 700;
    height: 32px;
    justify-content: center;
    position: relative;
    width: 100%
}

.btn_add_bank_account {
    background: var(--primary);
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    margin: 0 auto;
    max-width: 300px;
    padding: 20px;
    text-align: center;
    width: 100%
}

.btn_promotion {
    border-radius: 5px;
    padding: 7px 24px
}

.btn-primary,
.btn_promotion {
    background: var(--secondary) !important;
    color: var(--content) !important;
    font-size: 14px;
    font-weight: 400
}

.btn-primary {
    background: var(--primary);
    color: #fff;
    margin: 0 auto;
    padding: 12px
}

.btn_cancel {
    background-color: #9e9e9e;
    border: 1px solid #9e9e9e;
    color: #fff;
    position: relative
}

.info_btn {
    background-color: transparent;
    border: 1px solid #272729;
    border-radius: 3px;
    color: #f4f4f5;
    font-size: 14px;
    font-weight: 400;
    margin-right: 6px;
    padding: 7px;
    transition: all .3s;
    white-space: nowrap
}

.info_btn.active,
.info_btn.router-link-exact-active {
    background: var(--secondary) !important;
    color: var(--content) !important
}

.sidebar_button .text {
    font-size: 13px;
    font-weight: 500
}

.sidebar_button .text,
.sidebar_button i,
.sidebar_button.router-link-active .text,
.sidebar_button.router-link-active i {
    color: var(--text-base)
}

.sidebar_button {
    align-items: center;
    display: flex;
    overflow: hidden;
    padding: 10px;
    position: relative
}

.sidebar_button.home {
    border: 1px solid #fff;
    border-radius: 10px;
    padding: 5px 10px
}

.sidebar_button.home .text,
.sidebar_button.home i {
    color: #fff
}

.mobile_sidebar_icon_home {
    margin-right: 5px;
    width: 15px
}

.mobile_sidebar_icon_home path {
    fill: #adacb1
}

.sidebar_button.router-link-active .mobile_sidebar_icon_home path {
    fill: var(--primary)
}

.sidebar_button .sidebar_button_content .text {
    color: #fff
}

.sidebar_button.active .sidebar_button_content .text {
    color: var(--content) !important
}

.download_btn {
    align-items: center;
    border: 1px solid #52525b;
    border-radius: 50px;
    display: flex;
    margin: 20px auto;
    padding: 10px 20px;
    width: 280px
}

.download-text {
    color: #f4f4f5
}

.game_menu_btn {
    align-items: center;
    background-color: transparent;
    background: var(--content);
    border: unset;
    border-radius: 5px;
    color: #fff !important;
    display: flex;
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 400;
    padding: 5px 8px;
    position: relative;
    transition: all .3s;
    white-space: nowrap
}

.game_menu_btn,
.game_menu_btn:last-child {
    margin-right: 6px
}

.game_menu_btn:first-child {
    margin-left: 6px
}

.game_menu_btn.active {
    color: #fff
}

.game_menu_btn.active:before {
    background: #0f48e6;
    border-radius: 5px;
    content: "";
    height: 100%;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.btn_game_view {
    align-items: center;
    background: #000;
    border-radius: 5px;
    display: flex;
    height: 35px;
    justify-content: center;
    width: 35px
}

.btn_game_view svg {
    height: 20px;
    width: 20px
}

.btn_game_view svg path {
    fill: var(--primary)
}

.btn_filter {
    align-items: center;
    background: #000;
    border-radius: 5px;
    color: var(--primary);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    height: 35px;
    justify-content: center
}

.btn_filter svg {
    margin-right: 5px;
    width: 20px
}

.btn_filter svg path {
    fill: var(--primary)
}

.btn_filter_modal_close {
    align-items: center;
    background: #272727;
    border-radius: 5px;
    color: var(--primary);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    justify-content: center;
    margin: 0 auto;
    padding: 5px 20px
}

.btn_filter_modal_tab {
    background: #f5f5f5;
    border: 1px solid var(--primary);
    border-radius: 5px;
    color: #272727;
    font-size: 14px;
    font-weight: 500;
    padding: 5px 10px;
    transition: all .3s
}

.btn_filter_modal_tab.active {
    background: var(--primary);
    color: #fff
}

.contact-us-button {
    color: #d4d4d8
}

.btn.otp_btn {
    background: var(--bg-main);
    color: #fff;
    overflow: hidden;
    position: relative;
    transition: all .3s
}

.forgot-password-text .resend-code-btn {
    color: #50a69a
}

.cs-status-link-btn,
.vip-next-level-btn {
    background: #46ad4d !important
}

.my-history-btn {
    background: #e4e5e6;
    color: #000
}

.day-date-btn {
    background: #fff;
    color: #000
}

.kick-off-time-btn {
    background: #646464
}

.kick-off-submit-btn {
    color: #fff
}

.invite-friends-btn .share-btn {
    background: #222121
}

.email-otp-code-btn,
.mobile-otp-code-btn {
    background: var(--primary) !important;
    color: #fff
}

.complete-sign-up-btn,
.register-deposit-btn,
.submit-next-btn {
    background: var(--primary);
    color: #fff
}

.login-now-btn,
.register-home-btn {
    color: var(--primary)
}

.register-home-btn {
    border-color: var(--primary)
}

.sport-bet-btn {
    background: #ffcf04;
    color: #000
}

.rebate-btn-approved {
    background: #757575
}

.new-reg-buttons {
    align-items: center;
    border-radius: 6px;
    display: flex;
    font-size: 18px;
    font-weight: 600;
    height: 50px;
    justify-content: center;
    letter-spacing: 1.2px;
    line-height: 18px
}

.o-input-wrapper {
    position: relative
}

.o-input-wrapper .o-icon {
    align-items: center;
    color: #000;
    cursor: pointer;
    display: flex;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: all .3s;
    z-index: 2
}

.o-input-wrapper .o-icon>svg>path {
    fill: #757575
}

.btn-password-change {
    background-color: var(--secondary)
}

.o-input-wrapper.left .o-input {
    padding-left: 2.25em
}

.o-input-wrapper.left .o-icon.left {
    left: 1.25em;
    transform: translateY(-50%) translate(-50%)
}

.o-input-wrapper.right .o-input {
    padding-right: 2.25em
}

.o-input-wrapper.right .o-icon.right {
    right: 1.25em;
    transform: translateY(-50%) translate(50%)
}

.o-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-clip: padding-box;
    background-color: #121212;
    border-color: #303030;
    border-radius: var(--o-border-radius);
    border-style: solid;
    border-width: var(--o-border-width);
    box-shadow: var(--o-shadow);
    color: var(--o-text);
    display: block;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.5;
    outline: none;
    padding: var(--o-padding);
    transition: all .2s;
    width: 100%
}

.o-input-wrapper.disabled .o-input .o-input.disabled,
.o-input.dateinput.disabled,
.o-input:disabled {
    background-color: var(--o-disabled);
    opacity: 1
}

@media screen and (max-width:767px) {
    .o-input.disabled {
        background-color: var(--o-disabled);
        opacity: 1
    }
}

@media screen and (min-width:767px) {
    .o-input.disabled {
        color: #707070
    }
}

.o-input-wrapper.open .o-input,
.o-input.focus,
.o-input:focus {
    background-color: var(--o-bg);
    border-color: var(--o-primary);
    box-shadow: var(--o-shadow-focus);
    color: var(--o-text);
    outline: 0
}

.o-input-wrapper.open .o-icon,
.o-input:focus~.o-icon {
    color: var(--o-primary)
}

select.o-input {
    background-image: var(--o-select-arrow);
    background-position: right .75rem center;
    background-repeat: no-repeat;
    background-size: .8em
}

.o-input.o-password::-ms-clear,
.o-input.o-password::-ms-reveal {
    display: none
}

input[type=number].o-number::-webkit-inner-spin-button,
input[type=number].o-number::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number].o-number {
    -moz-appearance: textfield
}

textarea.o-input {
    transition: box-shadow .3s, border .3s
}

.o-input.mobile-big {
    font-size: 12px;
    padding: 1rem
}

.login_modal_container .o-input {
    align-items: center;
    background-color: #fff;
    display: flex;
    font-size: .875em;
    height: 45px;
    overflow: hidden
}

.login_modal_container .o-input.mobile-big {
    background-color: #fff;
    font-size: .875em;
    padding: var(--o-padding);
    padding-right: 70px
}

@media screen and (min-width:768px) {
    .o-input.mobile-big {
        font-size: 16px;
        padding: .75rem 1.25rem
    }
}

.o-input-wrapper.valid .o-input {
    border: 1px solid #009d36
}

.o-input-wrapper.valid:after {
    background-color: #009d36;
    background-image: url(../img/icons/checkmark.png);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 66%;
    border-radius: 50%;
    content: "";
    height: 1em;
    position: absolute;
    right: .5em;
    top: 50%;
    transform: translateY(-50%);
    width: 1em
}

.fmodal-overlay[data-v-d21412c8] {
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    background-color: #0000004d;
    height: var(--window-height);
    left: 0;
    opacity: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    transition: all .3s;
    visibility: hidden;
    width: 100vw;
    z-index: 1050
}

.fmodal-wrapper[data-v-d21412c8] {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    overflow-y: hidden;
    padding: 15px;
    position: relative;
    width: 100%
}

.fmodal-overlay.show[data-v-d21412c8] {
    opacity: 1;
    visibility: visible
}

.fmodal-content[data-v-d21412c8] {
    max-height: 100%;
    overflow-y: auto;
    transform: translateY(70px);
    transition: all .1s
}

.fmodal-overlay.show .fmodal-content[data-v-d21412c8] {
    transform: translateY(0)
}

@media screen and (max-width:767px) {
    .fmodal-wrapper[data-v-d21412c8] {
        align-items: flex-end;
        padding: 0
    }

    .fmodal-content[data-v-d21412c8] {
        max-width: 100% !important
    }
}

.calendar-head[data-v-d20f25e3] {
    background: var(--mission-calendar-header);
    color: var(--ms-diary-text-head-color)
}

.calendar-content[data-v-d20f25e3] {
    background-color: var(--ms-diary-bg);
    border-color: var(--ms-diary-border-color);
    color: var(--ms-diary-text-color)
}

.ms-nav[data-v-d20f25e3] {
    align-items: center;
    background: transparent;
    border-radius: 50%;
    display: flex;
    height: 32px;
    justify-content: center;
    position: relative;
    width: 32px
}

.ms-head-cell[data-v-d20f25e3] {
    font-size: .875rem;
    padding: .75rem
}

.ms-body-cell[data-v-d20f25e3],
.ms-head-cell[data-v-d20f25e3] {
    text-align: center;
    width: 14.28571%
}

.ms-body-cell[data-v-d20f25e3] {
    border-collapse: collapse;
    cursor: pointer;
    font-size: .75em;
    padding: .75em 0
}

.ms-day[data-v-d20f25e3] {
    margin: 3px auto auto;
    max-width: 48px;
    width: 70%
}

.ms-day-box[data-v-d20f25e3] {
    background-color: var(--ms-diary-box-bg);
    border: 1px solid var(--ms-diary-box-border-color);
    border-radius: 6px;
    margin: auto;
    padding-top: 100%;
    position: relative
}

.ms-day-box.green[data-v-d20f25e3] {
    background-color: var(--ms-diary-box-green-bg);
    border-color: var(--ms-diary-box-green-border-color)
}

.ms-day-box.gold[data-v-d20f25e3] {
    background-color: var(--ms-diary-box-gold-bg);
    border-color: var(--ms-diary-box-gold-border-color)
}

.ms-day-box.dot[data-v-d20f25e3]:before {
    background: #ffba00;
    border-radius: 50%;
    content: "";
    height: 8px;
    position: absolute;
    right: 0;
    top: -4px;
    width: 8px
}

.ms-day-box[data-v-d20f25e3]:after {
    background-image: url(../img/icons/calendar-x.webp);
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 18px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 18px
}

.ms-day-box.gray[data-v-d20f25e3]:after {
    background-image: url(../img/icons/diamond-gray.webp);
    top: calc(50% + 2px)
}

.ms-day-box.green[data-v-d20f25e3]:after {
    background-image: url(../img/icons/calendar-check.webp);
    top: calc(50% + 2px);
    width: 16px
}

.ms-day-box.gold[data-v-d20f25e3]:after {
    background-image: unset
}

.ms-day-box-content[data-v-d20f25e3] {
    align-items: center;
    display: flex;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 0
}

.calenderDiamond[data-v-d20f25e3] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1
}

.fs-overlay[data-v-01462de4] {
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    background-color: #0009;
    display: flex;
    flex-direction: column;
    left: 0;
    opacity: 0;
    overflow: auto;
    position: fixed;
    top: 0;
    transition: all .3s;
    visibility: hidden;
    width: 100vw;
    z-index: 1050
}

.fs-overlay.show[data-v-01462de4] {
    opacity: 1;
    visibility: visible
}

.fs-overlay .isLoginModal[data-v-01462de4] {
    background-color: #000 !important;
    background-image: url(../img/modal_bg_1.webp);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    max-width: 100vw !important;
    width: 100vw
}

.isLoginModal[data-v-01462de4] {
    background-color: #fffc
}

.daily_left[data-v-b75cb264] {
    align-items: flex-end;
    background-color: var(--ms-diary-bg);
    border-radius: 5px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    overflow: hidden;
    padding: 20px 10px;
    position: relative;
    width: 190px
}

.daily_left_icon[data-v-b75cb264] {
    width: 100px
}

.daily_bg[data-v-b75cb264],
.daily_left_icon[data-v-b75cb264] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%)
}

.daily_bg[data-v-b75cb264] {
    background-color: #0009;
    cursor: pointer;
    height: calc(100% + 10px);
    width: calc(100% + 10px);
    z-index: 1
}

.finger_json[data-v-b75cb264] {
    bottom: 35%;
    left: 50%;
    position: absolute;
    transform: translate(-50%);
    width: 100px;
    z-index: 2
}

.gift_box_json[data-v-b75cb264] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 150px;
    z-index: 1
}

.mission_daily_close_btn[data-v-b75cb264] {
    border-radius: 100%;
    height: 40px;
    padding: 10px;
    position: absolute;
    right: -15px;
    top: 0;
    width: 40px;
    z-index: 2
}

@media (max-width:767px) {
    .daily_left[data-v-b75cb264] {
        display: none
    }

    .mission_daily_close_btn[data-v-b75cb264] {
        height: 30px;
        padding: 8px;
        right: 10px;
        top: 10px;
        width: 30px
    }
}

.preloader[data-v-04780d26] {
    align-items: center;
    background: rgba(0, 0, 0, .8);
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    transition: all .3s;
    visibility: hidden;
    width: 100%;
    z-index: 1000
}

.preloader.show[data-v-04780d26] {
    opacity: 1;
    visibility: visible
}

.preloader img[data-v-04780d26] {
    max-width: 300px;
    width: 60%
}

.contactBox[data-v-24ff37ee] {
    overflow: hidden;
    position: fixed;
    width: 50px;
    z-index: 10
}

.contactBox[data-v-24ff37ee]:hover {
    width: 200px
}

.contact_btn[data-v-24ff37ee] {
    align-items: center;
    display: flex;
    padding: 10px;
    position: relative;
    transition: all .3s;
    width: 200px
}

.contactBox.right-mode:hover .contact_btn[data-v-24ff37ee] {
    left: 150px
}

.contactBox.right-mode:hover .contact_btn[data-v-24ff37ee]:hover {
    left: 0
}

.contactBox.left-mode:hover .contact_btn[data-v-24ff37ee] {
    display: flex;
    flex-direction: row-reverse;
    right: 150px
}

.contactBox.left-mode:hover .contact_btn[data-v-24ff37ee]:hover {
    right: 0
}

.contactBox.left-mode:hover .contact_btn .contact-tab-img[data-v-24ff37ee] {
    margin: unset
}

.contact-tab[data-v-24ff37ee] {
    width: calc(100% - 42px)
}

.contactBox[data-v-cfd1ead8] {
    align-items: center;
    display: flex;
    position: fixed;
    transition: all .3s;
    width: 270px;
    z-index: 10
}

.contactBox.right-mode[data-v-cfd1ead8] {
    right: -240px
}

.contactBox.left-mode[data-v-cfd1ead8] {
    display: flex;
    flex-direction: row-reverse;
    left: -240px
}

.contactBox.right-mode.active[data-v-cfd1ead8] {
    right: 0
}

.contactBox.left-mode.active[data-v-cfd1ead8] {
    left: 0
}

.contactBox_left[data-v-cfd1ead8] {
    align-items: center;
    display: flex;
    flex-direction: column;
    font-size: 12px;
    font-weight: 400;
    justify-content: center;
    padding: 20px 0;
    white-space: nowrap;
    width: 30px;
    z-index: 2
}

.left-mode .contactBox_left[data-v-cfd1ead8] {
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px
}

.right-mode .contactBox_left[data-v-cfd1ead8] {
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px
}

.contactbox_text[data-v-cfd1ead8] {
    transform: rotate(0);
    writing-mode: vertical-lr
}

.active .contact_us_arrow[data-v-cfd1ead8] {
    transform: rotate(180deg)
}

.contact_us_arrow svg[data-v-cfd1ead8] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) rotate(90deg);
    width: 9px
}

.contactBox_right[data-v-cfd1ead8] {
    align-self: stretch;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    padding: 10px;
    transition: all .15s;
    width: calc(100% - 30px)
}

.contactBox.active .contactBox_right[data-v-cfd1ead8] {
    margin-left: 0;
    padding: 10px 0 0 20px;
    width: calc(100% - 30px)
}

.contact_btn_mobile[data-v-cfd1ead8] {
    align-items: center;
    display: flex;
    margin-top: 15px
}

.contact_btn_mobile[data-v-cfd1ead8]:first-child {
    margin-top: 0
}

.o-select-backdrop[data-v-ef9343f9] {
    animation: fadeIn-ef9343f9 .1s;
    background-color: #0008;
    display: flex;
    flex-direction: column;
    height: var(--window-height);
    justify-content: flex-end;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1050
}

.o-select-content[data-v-ef9343f9] {
    background-color: var(--o-dropdown-bg);
    display: flex;
    flex-direction: column;
    max-height: 40vh;
    overflow: auto;
    transition: all .1s
}

.o-select-content[data-v-ef9343f9],
.o-select-dropdown[data-v-ef9343f9] {
    border-radius: var(--o-border-radius);
    box-shadow: var(--o-dropdown-shadow)
}

.o-select-dropdown[data-v-ef9343f9] {
    max-height: 50vh;
    overflow: hidden;
    z-index: 1050
}

@media (max-width:800px) {

    .o-select-content[data-v-ef9343f9],
    .o-select-dropdown[data-v-ef9343f9] {
        max-height: 40vh
    }
}

.o-select-dropdown.isRegister[data-v-ef9343f9] {
    border-radius: 0
}

.o-select-backdrop .o-select-content[data-v-ef9343f9] {
    max-height: var(--window-height)
}

@media (max-width:767px) {
    .o-select-content[data-v-ef9343f9] {
        animation: slideUp-ef9343f9 .3s;
        border-radius: 0;
        padding-bottom: 20px
    }

    .o-select-content.noAnimation[data-v-ef9343f9] {
        animation: unset;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        padding-bottom: unset
    }
}

@keyframes fadeIn-ef9343f9 {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes slideUp-ef9343f9 {
    0% {
        transform: translateY(60px)
    }

    to {
        transform: translateY(0)
    }
}

.o-select-lg-input[data-v-55befdfe] {
    outline: none;
    width: 100%
}

.o-select-value-label[data-v-55befdfe] {
    align-items: center;
    display: flex;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.o-select-value-label .o-select-value-label-img-container[data-v-55befdfe] {
    margin-right: .75em
}

.o-select-value-label img[data-v-55befdfe] {
    width: 1.25rem
}

.o-select-label-container[data-v-55befdfe] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: .625rem 1rem
}

.o-select-close[data-v-55befdfe] {
    background-color: transparent;
    border: none;
    font-size: 1.5rem;
    font-size: 30px;
    line-height: .65;
    padding-left: .75rem;
    padding-right: 0
}

.o-select-search-container[data-v-55befdfe] {
    flex-shrink: 0;
    padding: 0 1rem 1rem
}

@media screen and (min-width:768px) {

    .o-select-close[data-v-55befdfe],
    .o-select-label-container[data-v-55befdfe],
    .o-select-search-container[data-v-55befdfe] {
        display: none
    }
}

.o-select-value-label .o-select-value-label-icon-container[data-v-55befdfe] {
    font-size: 18px;
    margin-right: 1.5rem
}

.o-select-options-container[data-v-55befdfe] {
    flex-grow: 1;
    font-size: .875em;
    overflow: auto;
    width: 100%
}

.o-select-search-container .o-input[data-v-55befdfe] {
    font-size: .875em
}

.o-select-pills-wrapper[data-v-55befdfe] {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%
}

.o-select-pill[data-v-55befdfe] {
    align-items: center;
    background-color: var(--o-option-selected-bg);
    border-radius: 2px;
    color: var(--o-option-selected-text);
    display: flex;
    font-size: .75rem;
    gap: 5px;
    margin-bottom: .125rem;
    margin-right: .25rem;
    padding: .125rem .25rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.o-select-body[data-v-55befdfe] {
    border-radius: var(--o-border-radius)
}

.o-select-option[data-v-55befdfe] {
    align-items: center;
    cursor: pointer;
    display: flex;
    padding: .75em 1em
}

@media screen and (min-width:768px) {
    .o-select-option[data-v-55befdfe] {
        padding: .25em 1em
    }

    .o-select-option.select-euro[data-v-55befdfe] {
        padding: 1em
    }
}

.o-select-option img[data-v-55befdfe] {
    margin-right: 1rem;
    width: 1.25rem
}

.isDesktop .o-select-body .o-select-option[data-v-55befdfe]:hover {
    background-color: var(--o-option-hover-bg);
    color: var(--content-dark)
}

.o-select-body:not(.multiple) .o-select-option.selected[data-v-55befdfe] {
    background: var(--o-option-selected-bg);
    color: var(--o-option-selected-text)
}

.o-select-body.multiple .o-select-option[data-v-55befdfe] {
    display: flex
}

.o-select-body.multiple .o-checkbox[data-v-55befdfe] {
    align-self: center;
    background-color: var(--checbox-bg);
    border: 1px solid var(--checkbox-border-color);
    border-radius: var(--checkbox-border-radius);
    box-shadow: var(--o-shadow);
    cursor: pointer;
    display: inline-block;
    flex-shrink: 0;
    height: 1em;
    margin-right: .5em;
    position: relative;
    transition: all .15s;
    vertical-align: middle;
    width: 1em
}

.o-select-body.multiple .o-checkbox.checked[data-v-55befdfe] {
    background-color: var(--o-primary)
}

.o-select-body.multiple .o-checkbox[data-v-55befdfe]:after {
    border-bottom: .18em solid var(--tick-color);
    border-right: .18em solid var(--tick-color);
    box-shadow: var(--o-shadow);
    box-sizing: border-box;
    content: "";
    height: .6em;
    left: 50%;
    position: absolute;
    top: calc(50% - .04em);
    transform: translate(-50%, -50%) rotate(38deg) scale(0);
    transition: all .15s;
    width: .35em
}

.o-select-body.multiple .o-checkbox.checked[data-v-55befdfe]:after {
    transform: translate(-50%, -50%) rotate(38deg) scale(1)
}

.icon-close[data-v-55befdfe] {
    font-size: 14px !important
}

.o-phone-select[data-v-5d8436f5] .o-select-container .o-icon.right {
    right: .25rem
}

.o-phone-select[data-v-5d8436f5] .o-select-container .o-icon.right .o-select-arrow {
    width: 8px
}

.o-phone-select[data-v-5d8436f5] .o-select-value-label .o-select-value-label-img-container {
    clip-path: circle(50% at 50% 50%);
    margin-right: .5em
}

.password_input_right[data-v-3f60ff32] {
    padding-right: 2.25em
}

.password_input_right.with_tooltip[data-v-3f60ff32] {
    padding-right: 70px
}

.password_icon[data-v-3f60ff32] {
    right: 10px
}

.pin-input[data-v-59a13f3b] {
    border-radius: 0;
    font-size: 16px;
    height: 40px;
    outline: none;
    padding: .5em .6em;
    text-align: center !important;
    width: 30px
}

@media screen and (min-width:768px) {
    .pin-input[data-v-59a13f3b] {
        height: 50px;
        padding: var(--o-padding);
        width: 45px
    }
}

.slide-container[data-v-ae526f5a] {
    display: flex;
    overflow: hidden;
    position: relative;
    width: 100%
}

.slide-container .slide_container_aspect_ratio[data-v-ae526f5a] {
    padding-top: 31.25%;
    width: 100%
}

.slide-wrapper[data-v-ae526f5a] {
    position: absolute;
    width: 100%
}

.slide_left[data-v-ae526f5a] {
    background-color: #00000080;
    border-radius: 100%;
    height: 50px;
    left: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    z-index: 2
}

.lucky_spin .slide_left[data-v-ae526f5a] {
    background-color: #000;
    height: 20px;
    left: 5px;
    width: 20px
}

.slide_right[data-v-ae526f5a] {
    background-color: #00000080;
    border-radius: 100%;
    height: 50px;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    z-index: 2
}

.lucky_spin .slide_right[data-v-ae526f5a] {
    background-color: #000;
    height: 20px;
    right: 5px;
    width: 20px
}

.arrow_icon[data-v-ae526f5a] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 20px
}

.lucky_spin .arrow_icon[data-v-ae526f5a] {
    width: 10px
}

.arrow_icon path[data-v-ae526f5a] {
    fill: #fff
}

.slide_dot[data-v-ae526f5a] {
    background-color: #ffffff80;
    border-radius: 100%;
    height: 10px;
    margin: 5px;
    transition: all .3s;
    width: 10px
}

.lucky_spin .slide_dot[data-v-ae526f5a] {
    display: none
}

.slide_dot.active[data-v-ae526f5a] {
    background-color: #fff
}

.slide_dot_box[data-v-ae526f5a] {
    align-items: center;
    bottom: 20px;
    display: inline-flex;
    left: 50%;
    margin: 0 auto;
    position: absolute;
    transform: translate(-50%);
    z-index: 2
}

@media (max-width:767px) {
    .slide_left[data-v-ae526f5a] {
        height: 30px;
        left: 5px;
        width: 30px
    }

    .arrow_icon[data-v-ae526f5a] {
        width: 15px
    }

    .slide_right[data-v-ae526f5a] {
        height: 30px;
        right: 5px;
        width: 30px
    }

    .slide_dot_box[data-v-ae526f5a] {
        bottom: 5px
    }

    .slide_dot[data-v-ae526f5a] {
        height: 5px;
        margin: 3px;
        width: 5px
    }

    .slide_dot_box[data-v-ae526f5a] {
        display: flex;
        gap: 8px;
        justify-content: center
    }

    .slide_dot[data-v-ae526f5a] {
        height: 10px;
        position: relative;
        width: 10px
    }

    .slide_dot[data-v-ae526f5a]:before {
        content: "";
        height: 18px;
        left: 50%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 18px
    }
}

.o-checkbox-wrapper[data-v-6a87b334] {
    align-items: center;
    display: flex;
    justify-content: flex-end
}

.o-checkbox[data-v-6a87b334] {
    background-color: var(--checbox-bg);
    border: 1px solid var(--checkbox-border-color);
    border-radius: var(--checkbox-border-radius);
    box-shadow: var(--o-shadow);
    cursor: pointer;
    display: inline-block;
    flex-shrink: 0;
    height: 1em;
    position: relative;
    transition: all .15s;
    vertical-align: middle;
    width: 1em
}

.o-checkbox.checked[data-v-6a87b334] {
    background-color: var(--primary)
}

.o-checkbox[data-v-6a87b334]:after {
    border-bottom: .15em solid var(--tick-color);
    border-right: .15em solid var(--tick-color);
    box-shadow: var(--o-shadow);
    box-sizing: border-box;
    content: "";
    height: .6em;
    left: 50%;
    position: absolute;
    top: calc(50% - .04em);
    transform: translate(-50%, -50%) rotate(38deg) scale(0);
    transition: all .15s;
    width: .35em
}

.o-checkbox.checked[data-v-6a87b334]:after {
    transform: translate(-50%, -50%) rotate(38deg) scale(1)
}

.o-checkbox.o-switch[data-v-6a87b334] {
    border-radius: 1em;
    width: 2em
}

.o-checkbox.o-switch[data-v-6a87b334]:after {
    background-color: var(--switch-thumb);
    border: none;
    border-radius: 50%;
    height: .7em;
    left: .1em;
    top: 50%;
    transform: translateY(-50%);
    width: .7em
}

.o-checkbox.o-switch.checked[data-v-6a87b334]:after {
    background-color: var(--switch-thumb-checked);
    left: calc(100% - .8em)
}

.o-checkbox.checked.disabled[data-v-6a87b334] {
    background-color: var(--o-primary-light)
}

.o-checkbox-label[data-v-6a87b334] {
    color: var(--checkbox-label-color);
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    font-weight: 400;
    margin-left: .5em
}

.o-checkbox-wrapper.reverse[data-v-6a87b334] {
    flex-direction: row-reverse
}

.o-checkbox-wrapper.reverse .o-checkbox-label[data-v-6a87b334] {
    margin-left: 0;
    margin-right: .75em
}

.date-year-input[data-v-6c4a0bfd] {
    background-color: transparent;
    outline: none;
    transition: all .3s;
    width: 3rem
}

.date-day-input[data-v-6c4a0bfd],
.date-month-input[data-v-6c4a0bfd] {
    background-color: transparent;
    outline: none;
    transition: all .3s;
    width: 2rem
}

.date-slash[data-v-6c4a0bfd] {
    margin: 0 .5rem
}

.date_input_right input[data-v-6c4a0bfd] {
    text-align: right
}

.bg-auth-modal-header[data-v-265f2879] {
    background-color: var(--auth-modal-header-bg)
}

.bg-auth-modal[data-v-265f2879] {
    background-color: var(--auth-modal-bg)
}

[data-v-265f2879] .o-checkbox-wrapper {
    justify-content: flex-start
}

[data-v-265f2879] .o-checkbox-wrapper .o-checkbox-label {
    color: #111
}

[data-v-265f2879] .__input .o-select-value-label {
    justify-content: end
}

[data-v-265f2879] .__input .password_icon {
    right: 0
}

.__input.valid[data-v-265f2879] {
    padding-right: 25px
}

.__input.valid[data-v-265f2879]:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' data-name='green tick'%3E%3Cg data-name='Group 6319'%3E%3Cpath fill='%23009d36' d='M7.5 0A7.5 7.5 0 1 1 0 7.5 7.479 7.479 0 0 1 7.458 0Z' data-name='Path 32894'/%3E%3Cpath fill='%23fff' d='m11.564 5.377-5.211 5.47-2.918-3.041 1.188-1.225 1.73 1.794 4.023-4.223Z' data-name='Path 32895'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    content: "";
    height: 15px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 15px
}

.referral_arrow[data-v-265f2879] {
    cursor: pointer;
    margin-left: 10px;
    position: relative;
    transform: rotate(0);
    transition: all .3s;
    width: 15px
}

.referral_arrow.close[data-v-265f2879] {
    transform: rotate(180deg)
}

.active-step-bg[data-v-265f2879] {
    background: var(--reg-step-active-bg-color)
}

.step-bg[data-v-265f2879] {
    background: var(--reg-step-bg-color)
}

.rotate[data-v-265f2879] {
    animation: rotating 2s linear infinite;
    transition: all .3s
}

.myr-reg-modal .tnc-text[data-v-265f2879] {
    color: var(--content)
}

[data-v-265f2879] .phone-input .phone-input-bg {
    background: unset;
    text-align: right
}

[data-v-265f2879] .phone-input .phone-select-bg {
    background: unset !important;
    text-align: right
}

[data-v-265f2879] .phone-input.o-input:focus {
    background-color: var(--o-bg);
    border: unset;
    box-shadow: unset;
    color: var(--o-text);
    outline: unset
}

[data-v-265f2879] .phone-input.o-input.focus,
[data-v-265f2879] .phone-input {
    background-color: var(--o-bg);
    border: unset;
    box-shadow: unset;
    color: var(--o-text);
    outline: unset
}

.captcha-input-box[data-v-f5e379d7] {
    font-size: 16px;
    padding: var(--o-padding)
}

.modal-container[data-v-2a455521] {
    display: flex;
    flex-direction: column
}

.modal-body[data-v-2a455521] {
    align-items: center;
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    justify-content: center;
    padding: 2rem 1.5rem;
    text-align: center;
    width: 100%
}

.modal-text[data-v-2a455521] {
    color: #000;
    line-height: 1.25rem
}

.modal-footer[data-v-2a455521] {
    border-top: 1px solid #e5e7eb;
    height: 60px;
    width: 100%
}

.cta-btn[data-v-2a455521] {
    background-color: transparent;
    border: none;
    color: #2563eb;
    cursor: pointer;
    font-weight: 600;
    outline: none;
    padding-bottom: 1rem;
    padding-top: 1rem;
    text-align: center;
    transition-duration: .15s;
    transition-property: background-color, color;
    width: 100%
}

.cta-btn[data-v-2a455521]:hover {
    background-color: #f9fafb
}

.cta-btn[data-v-2a455521]:active {
    background-color: #f3f4f6
}

.close_btn[data-v-39536013] {
    height: 20px;
    position: absolute;
    right: 0;
    top: 0;
    width: 20px;
    z-index: 1
}

.close_btn img[data-v-39536013] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 15px
}

.ios_modal_text_1[data-v-39536013] {
    color: #5c5c5c;
    font-size: 14px;
    text-align: center
}

.ios_modal_text_2[data-v-39536013] {
    color: #5c5c5c;
    font-size: 12px;
    font-weight: 400;
    margin-top: 5px;
    text-align: center
}

.ios_modal_img[data-v-39536013] {
    margin-top: 10px;
    position: relative;
    width: 100%
}

.ios_modal_img img[data-v-39536013] {
    width: 100%
}

.ios_modal_text_3[data-v-39536013] {
    margin-top: 20px
}

.ios_modal_text_3[data-v-39536013],
.ios_modal_text_4[data-v-39536013] {
    align-items: center;
    color: #5c5c5c;
    display: flex;
    font-size: 12px;
    font-weight: 400
}

.ios_modal_box[data-v-39536013] {
    background: #f9f9f9;
    border-radius: 10px;
    color: #000;
    font-size: 12px;
    font-weight: 500;
    padding: 0 20px;
    width: 100%
}

.ios_modal_box_1[data-v-39536013] {
    position: relative
}

.ios_modal_box_1[data-v-39536013],
.ios_modal_box_2[data-v-39536013] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    height: 40px;
    justify-content: space-between
}

.ios_modal_box_2[data-v-39536013] {
    border-bottom: 1px solid #e6e6e7;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.ios_modal_box_3[data-v-39536013] {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    height: 40px
}

.ios_modal_box_3[data-v-39536013],
.ios_modal_box_4[data-v-39536013] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.ios_modal_box_4[data-v-39536013] {
    border: 1px solid #bcbcbc;
    box-shadow: 0 0 3px #0000004d;
    -webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, .3);
    -moz-box-shadow: 0 0 3px 0 rgba(0, 0, 0, .3);
    font-size: 16px;
    height: 50px;
    position: relative
}

.ios_modal_box .icon[data-v-39536013] {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative;
    width: 30px
}

.ios_modal_box_1 .icon svg[data-v-39536013] {
    height: 20px;
    width: 15px
}

.ios_modal_box_2 .icon svg[data-v-39536013] {
    height: 10px;
    width: 20px
}

.ios_modal_box_3 .icon svg[data-v-39536013] {
    height: 12px;
    width: 15px
}

.ios_modal_box_4 .icon svg[data-v-39536013] {
    height: 25px;
    width: 25px
}

.ios_modal_number_1[data-v-39536013] {
    left: 55%;
    top: 15%
}

.ios_modal_number_1[data-v-39536013],
.ios_modal_number_2[data-v-39536013] {
    align-items: center;
    background: #000;
    border-radius: 100%;
    color: #fff;
    display: flex;
    font-size: 12px;
    font-weight: 400;
    height: 20px;
    justify-content: center;
    position: absolute;
    width: 20px
}

.ios_modal_number_2[data-v-39536013] {
    left: 60%;
    top: 50%;
    transform: translateY(-50%)
}

.community_modal_wrapper[data-v-b56f4363] {
    background: #111;
    border-radius: 15px;
    color: #fff;
    overflow: visible;
    width: 100%
}

.community_header[data-v-b56f4363] {
    align-items: center;
    background: url(../img/community_header.webp) no-repeat 50%;
    background-size: cover;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    color: #fff;
    display: flex;
    justify-content: flex-start;
    min-height: 160px;
    overflow: visible;
    padding: 40px 25px 25px;
    position: relative
}

.community_header[data-v-b56f4363]:before {
    content: "";
    inset: 0;
    position: absolute;
    z-index: 1.5
}

.close_btn[data-v-b56f4363] {
    align-items: center;
    background: none;
    border-radius: 100%;
    cursor: pointer;
    display: flex;
    height: 15px;
    justify-content: center;
    position: absolute;
    right: 20px;
    top: 20px;
    width: 15px;
    z-index: 10
}

.close_btn img[data-v-b56f4363] {
    filter: brightness(0) invert(1);
    height: 20px;
    width: 20px
}

.header_text[data-v-b56f4363] {
    flex-grow: 1;
    position: relative;
    z-index: 2
}

.header_text .title[data-v-b56f4363] {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 5px
}

.header_text .subtitle[data-v-b56f4363] {
    font-size: 14px;
    opacity: .9
}

.header_agent_character[data-v-b56f4363] {
    height: 160px;
    -o-object-fit: contain;
    object-fit: contain;
    position: absolute;
    right: 30px;
    top: -20px;
    z-index: 3
}

.tab_navigation[data-v-b56f4363] {
    background: #000;
    border-bottom: 1px solid #333;
    display: flex;
    padding: 0 20px
}

.tab_item[data-v-b56f4363] {
    color: #888;
    cursor: pointer;
    flex: 1;
    font-size: 16px;
    font-weight: 500;
    padding: 15px 0;
    position: relative;
    text-align: center;
    transition: color .3s
}

.tab_item.active[data-v-b56f4363] {
    color: #fff
}

.tab_item.active[data-v-b56f4363]:after {
    background: var(--primary);
    border-radius: 2px 2px 0 0;
    bottom: 0;
    content: "";
    height: 4px;
    left: 0;
    position: absolute;
    width: 100%
}

.community_buttons_container[data-v-b56f4363] {
    background: #000;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(3, 1fr);
    padding: 25px
}

.community_button_card[data-v-b56f4363] {
    background: #121212;
    border: 1px solid #333;
    border-radius: 8px;
    padding: 20px 10px;
    text-align: center;
    transition: all .3s ease
}

.community_button_card[data-v-b56f4363]:hover {
    background: #252525;
    border-color: var(--primary)
}

.community_button[data-v-b56f4363] {
    flex-direction: column;
    gap: 8px;
    text-decoration: none
}

.community_button[data-v-b56f4363],
.icon_box[data-v-b56f4363] {
    align-items: center;
    display: flex
}

.icon_box[data-v-b56f4363] {
    border-radius: 50%;
    justify-content: center
}

.icon_box[data-v-b56f4363],
.icon_box img[data-v-b56f4363] {
    height: 54px;
    width: 54px
}

.community_button .text[data-v-b56f4363] {
    color: #fff;
    font-size: 15px;
    font-weight: 500
}

@media (max-width:767px) {
    .community_header[data-v-b56f4363] {
        min-height: 120px;
        padding: 25px 20px 20px
    }

    .close_btn[data-v-b56f4363] {
        right: 15px;
        top: 15px
    }

    .close_btn[data-v-b56f4363],
    .close_btn img[data-v-b56f4363] {
        height: 15px;
        width: 15px
    }

    .header_text .title[data-v-b56f4363] {
        font-size: 18px
    }

    .header_text .subtitle[data-v-b56f4363] {
        font-size: 13px
    }

    .header_agent_character[data-v-b56f4363] {
        height: 120px;
        right: 25px;
        top: -15px
    }

    .community_buttons_container[data-v-b56f4363] {
        gap: 7px;
        grid-template-columns: repeat(3, 1fr);
        padding: 15px
    }

    .community_button_card[data-v-b56f4363] {
        padding: 15px 5px
    }

    .icon_box[data-v-b56f4363],
    .icon_box img[data-v-b56f4363] {
        height: 34px;
        width: 34px
    }

    .community_button .text[data-v-b56f4363] {
        font-size: 13px
    }
}

.sidebar_container[data-v-fe63887f] {
    height: 100%;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    visibility: hidden;
    width: 100%;
    z-index: 51
}

.sidebar_container.active[data-v-fe63887f] {
    visibility: visible
}

.mobile_sidebar_bg[data-v-fe63887f] {
    background-color: #0009;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.mobile_sidebar_bg[data-v-fe63887f],
.sidebar_menu[data-v-fe63887f] {
    height: 100%;
    position: fixed;
    width: 100%
}

.sidebar_menu[data-v-fe63887f] {
    background-color: var(--sidepanel-bg);
    left: 0;
    overflow: auto;
    padding: 20px 10px;
    top: 0;
    transform: translate(-100%);
    transition: all .3s
}

.active .sidebar_menu[data-v-fe63887f] {
    transform: translate(0)
}

.close_btn[data-v-fe63887f] {
    height: 20px;
    position: absolute;
    right: 10px;
    top: 18px;
    width: 20px;
    z-index: 1
}

.close_btn img[data-v-fe63887f] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 15px
}

.bg_lucky_spin[data-v-fe63887f] {
    background: #22546e;
    background: linear-gradient(90deg, #22546e 40%, rgba(34, 84, 110, 0));
    border-radius: 5px
}

.bg_mission[data-v-fe63887f] {
    background: #25437a;
    background: linear-gradient(90deg, #25437a 40%, rgba(37, 67, 122, 0));
    border-radius: 5px
}

.bg_angpow[data-v-fe63887f] {
    background: #6f2323;
    background: linear-gradient(90deg, #6f2323 40%, rgba(111, 35, 35, 0));
    border-radius: 5px
}

.bg_leaderboard[data-v-fe63887f] {
    background: #6e2269;
    background: linear-gradient(90deg, #6e2269 40%, rgba(110, 34, 105, 0));
    border-radius: 5px
}

.bg_refer[data-v-fe63887f] {
    background: #472417;
    background: linear-gradient(90deg, #472417 40%, rgba(71, 36, 23, 0));
    border-radius: 5px
}

.bg-affiliate[data-v-fe63887f] {
    background: #009006;
    background: linear-gradient(90deg, #009006 40%, rgba(71, 36, 23, 0));
    border-radius: 5px
}

.bg_predictor[data-v-fe63887f] {
    background: #2029d8;
    background: linear-gradient(90deg, #2029d8 40%, rgba(71, 36, 23, 0));
    border-radius: 5px
}

.header_icon_referral_light[data-v-fe63887f] {
    left: -12px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 60px
}

.user-rank[data-v-75113476] {
    background: transparent !important
}

.scroll-td[data-v-75113476] {
    font-size: 12px;
    overflow: hidden;
    position: relative;
    text-align: center;
    white-space: nowrap;
    width: 100%
}

.modal_close_btn[data-v-66bcdbe2] {
    align-items: center;
    background-color: #fff;
    border-radius: 100%;
    display: flex;
    height: 30px;
    justify-content: center;
    position: absolute;
    right: 5px;
    top: 5px;
    width: 30px;
    z-index: 1
}

.inner_shadow[data-v-eeeed1be] {
    box-shadow: inset 0 -5px 9px #ffffff80;
    -webkit-box-shadow: inset 0 -5px 9px 0 hsla(0, 0%, 100%, .5);
    -moz-box-shadow: inset 0 -5px 9px 0 hsla(0, 0%, 100%, .5)
}

.ranking_box[data-v-eeeed1be] {
    background: #2b292c;
    background: linear-gradient(180deg, #1e1e1e, #242424);
    width: 100%
}

.fade-enter-active[data-v-eeeed1be],
.fade-leave-active[data-v-eeeed1be],
.fade-move[data-v-eeeed1be] {
    transition: all .5s
}

.fade-enter-from[data-v-eeeed1be] {
    opacity: 0;
    transform: translateY(30px)
}

.fade-leave-to[data-v-eeeed1be] {
    opacity: 0;
    transform: translateY(-30px)
}

.fade-leave-active[data-v-eeeed1be] {
    position: absolute;
    width: 100%
}

[data-v-eeeed1be] .leaderboard-table .head .tr {
    background: #000;
    background: linear-gradient(0deg, #000, #4a4a4a);
    color: #fff
}

[data-v-eeeed1be] .leaderboard-table .head .th {
    font-weight: 900;
    padding: .475rem;
    text-align: center;
    white-space: nowrap
}

[data-v-eeeed1be] .leaderboard-table .body .td {
    align-items: center;
    color: #fff;
    display: grid;
    padding: 6px
}

[data-v-eeeed1be] .leaderboard-table .body .td:first-child {
    color: #ffcd57
}

[data-v-eeeed1be] .leaderboard-table .body .tr {
    background: #1e1e1e;
    background: linear-gradient(180deg, #1e1e1e, #242424)
}

[data-v-eeeed1be] .leaderboard-table .body .tr.rank-1 {
    background: #da0;
    background: linear-gradient(270deg, #da0, #dd7f00)
}

[data-v-eeeed1be] .leaderboard-table .body .tr.rank-2 {
    background: #a3a3a3;
    background: linear-gradient(270deg, #a3a3a3, #3c4852)
}

[data-v-eeeed1be] .leaderboard-table .body .tr.rank-3 {
    background: #aa7249;
    background: linear-gradient(270deg, #aa7249, #503618)
}

.modal_close_btn[data-v-6120003b] {
    align-items: center;
    background-color: #fff;
    border-radius: 100%;
    display: flex;
    height: 30px;
    justify-content: center;
    position: absolute;
    right: 5px;
    top: 5px;
    width: 30px;
    z-index: 1
}

.transaction-copy-btn[data-v-33e53147] {
    color: #febc65
}

.note-box[data-v-ea5d3401] {
    background: var(--reg-success-box-bg);
    border-radius: 7px;
    font-size: 13px;
    margin-bottom: 15px;
    padding: 15px 20px
}

.note-box .text[data-v-ea5d3401] {
    color: var(--reg-success-box-text)
}

.copy-btn[data-v-ea5d3401] {
    font-size: 14px !important;
    margin-left: 8px
}

.note-box[data-v-acf52797] {
    background: var(--reg-success-box-bg);
    border-radius: 7px;
    font-size: 16px;
    margin-bottom: 15px;
    padding: 15px 20px
}

.note-box .text[data-v-acf52797] {
    color: var(--reg-success-box-text)
}

.copy-btn[data-v-acf52797] {
    font-size: 14px !important;
    margin-left: 8px
}

.success-regioster-title[data-v-acf52797] {
    font-size: 25px;
    font-weight: 700;
    line-height: 20px;
    padding-bottom: 24px;
    text-align: center;
    text-transform: capitalize
}

.no_show[data-v-7f797141] {
    align-items: center;
    display: flex;
    justify-content: center;
    margin-top: 20px
}

.no_show[data-v-7f797141] .o-checkbox {
    background-color: #343434;
    border: 2px solid #777;
    border-radius: 4px;
    height: 24px;
    width: 24px
}

.no_show[data-v-7f797141] .o-checkbox.checked {
    background-color: var(--primary)
}

.no_show[data-v-7f797141] .o-checkbox-label {
    color: #aaa;
    font-size: 16px;
    font-weight: 700;
    margin-left: 10px
}

.close_btn[data-v-7f797141] {
    background-color: var(--announcement-close-modal);
    border-radius: 100%;
    height: 50px;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    z-index: 1
}

.close_btn img[data-v-7f797141] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 20px
}

.list_bg[data-v-7f797141] {
    background-color: #d6d6d6;
    border-radius: 10px;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 290px
}

.announcement_btn[data-v-7f797141] {
    align-items: center;
    background-color: transparent;
    border-bottom: 1px solid var(--announcement-border);
    display: flex;
    height: 65px;
    overflow: hidden;
    padding-left: 10px;
    position: relative;
    width: 300px
}

.announcement_btn.active[data-v-7f797141] {
    background: var(--announcement-active)
}

.announcement_selected[data-v-7f797141] {
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: all .3s;
    width: 100%
}

.announcement_btn.active .announcement_selected[data-v-7f797141] {
    opacity: 1
}

.unread[data-v-7f797141] {
    background-color: var(--primary);
    border-radius: 100%;
    height: 8px;
    opacity: 0;
    position: relative;
    transition: all .3s;
    width: 8px
}

.unread.active[data-v-7f797141] {
    opacity: 1
}

.announcement_icon[data-v-7f797141] {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative;
    width: 45px
}

.announcement_title[data-v-7f797141] {
    color: var(--announcement-text);
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    position: relative;
    text-align: left;
    transition: all .3s;
    width: calc(100% - 80px)
}

.active .announcement_title[data-v-7f797141] {
    color: var(--announcement-active-text)
}

.announcement_menu[data-v-7f797141] {
    overflow: auto;
    position: relative;
    width: 300px
}

.announcement_desc_box[data-v-7f797141] {
    border-left: 1px solid var(--line);
    position: relative;
    width: calc(100% - 300px)
}

.announcement_desc[data-v-7f797141] {
    min-height: 300px;
    overflow: auto;
    padding: 20px 20px 70px;
    position: relative;
    width: 100%
}

.announcement_desc[data-v-7f797141]::-webkit-scrollbar {
    width: 5px
}

.announcement_desc[data-v-7f797141]::-webkit-scrollbar-track {
    background-color: transparent !important
}

.announcement_desc[data-v-7f797141]::-webkit-scrollbar-thumb {
    background-color: #c7c7c7
}

.announcement_dot[data-v-7f797141] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 15px auto
}

.announcement_dot .dot[data-v-7f797141] {
    background-color: #565759;
    border: 1px solid #727374;
    border-radius: 100%;
    cursor: pointer;
    height: 15px;
    margin: 10px;
    transition: all .3s;
    width: 15px
}

.announcement_dot .dot.active[data-v-7f797141] {
    background-color: #fff;
    border: 1px solid #fff
}

.announcement_slide_left[data-v-7f797141] {
    left: 5px
}

.announcement_slide_left[data-v-7f797141],
.announcement_slide_right[data-v-7f797141] {
    background-color: #00000080;
    border-radius: 100%;
    height: 30px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    z-index: 2
}

.announcement_slide_right[data-v-7f797141] {
    right: 5px
}

.announcement_arrow_icon[data-v-7f797141] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 15px
}

.announcement_arrow_icon path[data-v-7f797141] {
    fill: #fff
}

@media (max-width:767px) {

    .announcement_menu[data-v-7f797141],
    .list_bg[data-v-7f797141] {
        display: none
    }

    .announcement_desc[data-v-7f797141] {
        border-left: unset;
        max-height: 100%;
        padding: 0;
        width: 100%
    }

    .close_btn[data-v-7f797141] {
        background-color: #62707c;
        height: 30px;
        right: -10px;
        top: -15px;
        width: 30px
    }

    .close_btn svg[data-v-7f797141] {
        left: 50%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 15px
    }

    .close_btn svg path[data-v-7f797141] {
        fill: #fff
    }
}

.modernWay[data-v-7f797141] {
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis
}

.announcement_check_box[data-v-7f797141] {
    align-items: center;
    bottom: 0;
    display: flex;
    height: 50px;
    justify-content: center;
    left: 50%;
    position: absolute;
    transform: translate(-50%);
    width: 100%
}

@media (max-width:767px) {
    .announcement_check_box[data-v-7f797141] {
        height: 40px
    }
}

.announcement_content[data-v-7f797141] {
    white-space: pre-wrap;
    word-break: break-word
}

.lucky-spin-container[data-v-39eaae7b] {
    display: flex;
    flex-direction: column;
    overflow: auto
}

.spin-now-text[data-v-39eaae7b] {
    color: #fff;
    text-shadow: 0 3px 3px #964b0780
}

.arrow-down-icon[data-v-39eaae7b] {
    transition: transform 1s ease
}

.lucky-list[data-v-39eaae7b] {
    max-height: 0;
    transition: max-height .5s ease
}

.lucky-list.opening[data-v-39eaae7b] {
    max-height: var(--max-height)
}

.lucky-list.closing[data-v-39eaae7b] {
    max-height: 0 !important
}

.animation_effect .diamond[data-v-39eaae7b] {
    animation: diamond-39eaae7b 3s ease-in-out infinite
}

@keyframes diamond-39eaae7b {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-10px)
    }

    to {
        transform: translateY(0)
    }
}

.animation_effect .coin1[data-v-39eaae7b] {
    animation: coin-1-39eaae7b 3s ease-in-out infinite
}

@keyframes coin-1-39eaae7b {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-20px)
    }

    to {
        transform: translateY(0)
    }
}

.animation_effect .coin2[data-v-39eaae7b] {
    animation: coin-2-39eaae7b 3s ease-in-out infinite
}

@keyframes coin-2-39eaae7b {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-20px)
    }

    to {
        transform: translateY(0)
    }
}

.start_button_icon.star[data-v-39eaae7b] {
    animation: star-39eaae7b 1s ease-in-out infinite
}

@keyframes star-39eaae7b {
    0% {
        transform: scale(.9)
    }

    to {
        transform: scale(1.1)
    }
}

.frame[data-v-39eaae7b],
.rank_icon[data-v-39eaae7b] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.wheel_wrapper .wheel_wrapper_aspect_ratio[data-v-39eaae7b] {
    padding-top: 100%;
    width: 100%
}

.wheel_frame[data-v-39eaae7b],
.wheel_wrapper_box[data-v-39eaae7b] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.wheel_frame[data-v-39eaae7b] {
    overflow: hidden
}

.wheel_container[data-v-39eaae7b] {
    transition: all 5s;
    transition-timing-function: cubic-bezier(.13, .85, .4, 1)
}

.wheel_container[data-v-39eaae7b],
.wheel_container_load[data-v-39eaae7b] {
    background: #fff;
    background: radial-gradient(circle, #fff 0, #ffd400 100%);
    border-radius: 100%;
    height: 85%;
    left: 50%;
    overflow: hidden;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) rotate(0);
    width: 85%
}

.wheel_product[data-v-39eaae7b] {
    color: #fff4c6;
    font-size: 70%;
    font-weight: 700;
    left: 50%;
    line-height: 100%;
    overflow-wrap: break-word;
    position: absolute;
    text-align: center;
    top: 25%;
    transform: translate(-50%);
    width: 50%;
    word-break: break-word
}

.wheel_product.isImage[data-v-39eaae7b] {
    top: 21%
}

.wheel_num[data-v-39eaae7b] {
    bottom: 1%;
    color: #fff;
    font-size: 35px;
    font-weight: 900;
    left: 50%;
    margin-bottom: 35px;
    position: absolute;
    text-shadow: -2px -2px 0 #9a6621, 2px -2px 0 #9a6621, -2px 2px 0 #9a6621, 2px 2px 0 #9a6621;
    transform: translate(-50%)
}

.img-spin-word[data-v-39eaae7b] {
    margin-bottom: 4rem;
    width: 26px
}

.coin_effect[data-v-39eaae7b] {
    position: relative;
    width: 100%
}

.coin_effect .aspect_ratio_box[data-v-39eaae7b] {
    padding-top: 100%;
    width: 100%
}

.coin_1[data-v-39eaae7b] {
    animation: coin1-39eaae7b 4s ease-in-out infinite;
    left: 10%;
    position: absolute;
    top: 5%;
    width: 10%
}

@keyframes coin1-39eaae7b {
    0% {
        left: 35%;
        opacity: 0;
        top: 30%;
        width: 0
    }

    60% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    to {
        left: 10%;
        opacity: 0;
        top: 5%;
        width: 10%
    }
}

.coin_2[data-v-39eaae7b] {
    animation: coin2-39eaae7b 3s ease-in-out infinite;
    left: 0;
    position: absolute;
    top: 26%;
    width: 15%
}

@keyframes coin2-39eaae7b {
    0% {
        left: 30%;
        opacity: 0;
        top: 40%;
        width: 0
    }

    60% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    to {
        left: 0;
        opacity: 0;
        top: 26%;
        width: 15%
    }
}

.coin_3[data-v-39eaae7b] {
    animation: coin3-39eaae7b 5s linear infinite;
    left: 5%;
    position: absolute;
    top: 60%;
    width: 35%
}

@keyframes coin3-39eaae7b {
    0% {
        left: 40%;
        opacity: 0;
        top: 65%;
        width: 0
    }

    60% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    to {
        left: 5%;
        opacity: 0;
        top: 60%;
        width: 35%
    }
}

.coin_4[data-v-39eaae7b] {
    animation: coin4-39eaae7b 3s linear infinite;
    position: absolute;
    right: 0;
    top: 15%;
    width: 20%
}

@keyframes coin4-39eaae7b {
    0% {
        opacity: 0;
        right: 35%;
        top: 40%;
        width: 0
    }

    60% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    to {
        opacity: 0;
        right: 0;
        top: 15%;
        width: 20%
    }
}

.coin_5[data-v-39eaae7b] {
    animation: coin5-39eaae7b 4s linear infinite;
    position: absolute;
    right: 0;
    top: 50%;
    width: 15%
}

@keyframes coin5-39eaae7b {
    0% {
        opacity: 0;
        right: 35%;
        top: 50%;
        width: 0
    }

    60% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    to {
        opacity: 0;
        right: 0;
        top: 50%;
        width: 15%
    }
}

.coin_6[data-v-39eaae7b] {
    animation: coin6-39eaae7b 3s linear infinite;
    position: absolute;
    right: 15%;
    top: 75%;
    width: 15%
}

@keyframes coin6-39eaae7b {
    0% {
        opacity: 0;
        right: 40%;
        top: 60%;
        width: 0
    }

    60% {
        opacity: 1
    }

    80% {
        opacity: 0
    }

    to {
        opacity: 0;
        right: 15%;
        top: 75%;
        width: 15%
    }
}

.wheel_count_frame[data-v-39eaae7b] {
    position: absolute;
    right: 0;
    top: 5%;
    width: 25%
}

.wheel_count_frame img[data-v-39eaae7b] {
    width: 100%
}

.wheel_count_frame .text[data-v-39eaae7b] {
    color: #ff3b15;
    font-size: 20px;
    font-style: italic;
    font-weight: 700;
    left: 50%;
    position: absolute;
    text-align: center;
    text-shadow: 0 0 5px #f3c519;
    top: 50%;
    transform: translate(-50%, -50%);
    white-space: nowrap;
    width: 100%
}

.wheel_count_frame .text span[data-v-39eaae7b] {
    font-size: 11px
}

.start_button[data-v-39eaae7b] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 15%
}

.start_button_icon[data-v-39eaae7b] {
    height: 100%;
    position: relative;
    width: 100%
}

.winner_box.layer-1[data-v-39eaae7b] {
    background: linear-gradient(180deg, #f0af0c, #a50);
    border: 1px solid #ffb700
}

.winner_box .layer-2[data-v-39eaae7b] {
    border: 5px dotted #ffefad;
    color: #ffefe6
}

.winner_box .layer-3[data-v-39eaae7b] {
    background: linear-gradient(180deg, #373123, #251f15)
}

.winner_box_list[data-v-39eaae7b] {
    height: 108px
}

.ranking_container[data-v-39eaae7b] {
    bottom: -36px;
    left: 0;
    position: absolute;
    transform: translateY(0);
    width: 100%
}

.ranking_container.below[data-v-39eaae7b] {
    bottom: unset;
    top: 0
}

.ranking_container.move[data-v-39eaae7b] {
    transform: translateY(-36px);
    transition: all .5s
}

.ranking_box[data-v-39eaae7b] {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    width: 100%
}

.ranking_box[data-v-39eaae7b]:nth-child(odd) {
    background-color: #382204
}

.ranking_box[data-v-39eaae7b]:nth-child(2n) {
    background-color: #443313
}

.lucky_wheel_List[data-v-39eaae7b] {
    background: linear-gradient(180deg, #373123, #251f15);
    border: 1px solid #c7b587;
    color: #fafafa
}

.lucky_wheel_List .icon-down[data-v-39eaae7b]:before {
    color: #fafafa
}

.status_box[data-v-39eaae7b] {
    background-color: #1f022f;
    border: 1px solid #f781d9;
    border-radius: 10px;
    padding: 15px;
    position: relative
}

.status_box.status_5[data-v-39eaae7b] {
    background-color: #000;
    border: 1px solid #f4f4f4
}

.status_label[data-v-39eaae7b] {
    left: 50%;
    position: absolute;
    top: -30px;
    transform: translate(-50%);
    width: 100%
}

.status_label img[data-v-39eaae7b] {
    width: 100%
}

.status_label .text[data-v-39eaae7b] {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    left: 50%;
    position: absolute;
    text-shadow: 0 0 10px #f781d9;
    top: 10px;
    transform: translate(-50%)
}

.status_face_box[data-v-39eaae7b] {
    height: 150px;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    width: 200px
}

.status_face[data-v-39eaae7b] {
    left: 50%;
    max-height: unset;
    max-width: unset;
    position: absolute;
    top: 55%;
    transform: translate(-50%, -50%);
    width: 200px
}

.status_button[data-v-39eaae7b] {
    left: 50%;
    margin-top: 10px;
    position: relative;
    transform: translate(-50%)
}

.status_button img[data-v-39eaae7b] {
    width: 70px
}

.status_button .text[data-v-39eaae7b] {
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    white-space: nowrap
}

.lucky_spin_box[data-v-39eaae7b],
.status_button .text[data-v-39eaae7b] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%)
}

.lucky_spin_box[data-v-39eaae7b] {
    background-color: transparent;
    overflow: hidden;
    padding-top: 100%
}

.lucky_spin_box_triangle[data-v-39eaae7b] {
    background-color: #fff;
    clip-path: polygon(50% 100%, 100% 9%, 100% 0, 0 0, 0 9%);
    height: 50%;
    left: 50%;
    position: absolute;
    top: 0;
    transform: translate(-50%);
    width: 100%
}

.lucky_spin_box:nth-child(odd) .lucky_spin_box_triangle[data-v-39eaae7b] {
    background: linear-gradient(180deg, #411c4b, #7328a5)
}

.lucky_spin_box:nth-child(2n) .lucky_spin_box_triangle[data-v-39eaae7b] {
    background: linear-gradient(180deg, #522b84, #b53cf5)
}

.lucky_spin_divider[data-v-39eaae7b] {
    height: 100%;
    left: 50%;
    overflow: hidden;
    position: absolute;
    top: 50%;
    width: 3px
}

.divider_box[data-v-39eaae7b] {
    background: #ebab2e;
    background: linear-gradient(0deg, #f0be5c, #ff0, #ebab42, #fff, #ebab2e);
    height: 50%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.lucky_prize_img[data-v-39eaae7b] {
    left: 50%;
    position: absolute;
    top: 90px;
    transform: translate(-50%);
    width: 40px
}

.outer-timer-wrap[data-v-39eaae7b] {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 120px;
    justify-content: center
}

.container-title[data-v-39eaae7b] {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent;
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 10px;
    text-align: center;
    width: 100%
}

.container-timer[data-v-39eaae7b] {
    display: flex;
    justify-content: center;
    margin-bottom: 24px
}

.timer-text[data-v-39eaae7b] {
    align-items: center;
    color: #fafafa;
    display: flex;
    font-size: 18px
}

.timer-text .icon-countdown[data-v-39eaae7b] {
    font-size: 24px;
    margin-right: 6px
}

.timer-text .icon-countdown[data-v-39eaae7b]:before {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent
}

.inner-timer[data-v-39eaae7b] {
    align-items: center;
    display: flex
}

.cd-box-wrap[data-v-39eaae7b] {
    position: relative
}

.cd-box[data-v-39eaae7b],
.cd-box-wrap[data-v-39eaae7b] {
    align-items: center;
    display: flex;
    justify-content: center
}

.cd-box[data-v-39eaae7b] {
    border: 1px solid #5f5f5f;
    border-radius: 10px;
    color: #fafafa;
    font-size: 18px;
    height: 50px;
    margin-left: 6px;
    margin-right: 6px;
    padding: 6px;
    width: 50px
}

.cd-desc[data-v-39eaae7b] {
    bottom: -18px;
    font-size: 12px;
    position: absolute
}

.cd-colon[data-v-39eaae7b],
.cd-desc[data-v-39eaae7b] {
    color: #fafafa
}

.wheel_point_box[data-v-39eaae7b] {
    background: linear-gradient(0deg, #522b84, #b53cf5);
    border: 1px solid #ce00ff;
    border-radius: 26px;
    font-size: 12px;
    left: 50%;
    padding: 8px 13px;
    position: absolute;
    top: -28px;
    transform: translate(-50%);
    z-index: 5
}

.wheel_wrapper[data-v-39eaae7b] {
    margin-top: 10px
}

.wheel_point[data-v-39eaae7b] {
    padding-right: 3px
}

.text1[data-v-39eaae7b] {
    align-items: center;
    display: flex;
    font-weight: 700;
    height: 100%;
    justify-content: center
}

@media (max-width:1400px) {
    .wheel_num[data-v-39eaae7b] {
        margin-bottom: 25px
    }
}

@media (max-width:850px) {
    .wheel_wrapper_box[data-v-39eaae7b] {
        margin-top: 0
    }

    .product-name[data-v-39eaae7b] {
        font-size: 10px;
        width: 70px
    }

    .wheel_num[data-v-39eaae7b] {
        text-shadow: -1px -1px 0 #9a6621, 1px -1px 0 #9a6621, -1px 1px 0 #9a6621, 1px 1px 0 #9a6621
    }

    .wheel_wrapper[data-v-39eaae7b] {
        margin-top: 30px;
        width: 100%
    }

    .wheel_wrapper .wheel_wrapper_aspect_ratio[data-v-39eaae7b] {
        padding-top: 100%;
        width: 100%
    }

    .wheel_wrapper_box[data-v-39eaae7b] {
        left: 50%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100%
    }

    .wheel_wrapper_box .wheel_wrapper_box_aspect_ratio[data-v-39eaae7b] {
        padding-top: 100%;
        width: 100%
    }

    .coin_effect[data-v-39eaae7b] {
        left: 50%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%)
    }

    .wheel_point_box[data-v-39eaae7b] {
        font-size: 10px;
        margin-top: 9px;
        padding: 5px 10px
    }
}

@media (max-width:639px) {
    .wheel_wrapper[data-v-39eaae7b] {
        overflow: unset
    }

    .wheel_product[data-v-39eaae7b] {
        font-size: 2vw
    }

    .wheel_num[data-v-39eaae7b] {
        font-size: 5vw;
        margin-bottom: 20px
    }

    .wheel_count_frame[data-v-39eaae7b] {
        right: 10px;
        top: 10px;
        width: 30%
    }

    .wheel_count_frame .text[data-v-39eaae7b] {
        font-size: 14px
    }

    .outer-timer-wrap[data-v-39eaae7b] {
        height: 90px
    }

    .container-title[data-v-39eaae7b] {
        font-size: 16px;
        margin-bottom: 8px
    }

    .timer-text[data-v-39eaae7b] {
        font-size: 12px
    }

    .timer-text .icon-countdown[data-v-39eaae7b] {
        font-size: 14px
    }

    .cd-box[data-v-39eaae7b] {
        font-size: 12px;
        height: 30px;
        margin-left: 4px;
        margin-right: 4px;
        padding: 4px;
        width: 30px
    }

    .cd-desc[data-v-39eaae7b] {
        bottom: -16px;
        font-size: 9px
    }
}

@media (max-width:450px) {
    .winner_box_list[data-v-39eaae7b] {
        height: 90px
    }

    .ranking_box[data-v-39eaae7b] {
        font-size: 12px
    }

    .ranking_container[data-v-39eaae7b] {
        bottom: -30px
    }

    .ranking_container.move[data-v-39eaae7b] {
        transform: translateY(-30px)
    }

    .lucky_prize_img[data-v-39eaae7b] {
        top: 55px;
        width: 20%
    }

    .wheel_product.isImage[data-v-39eaae7b] {
        top: 30px
    }

    .lucky_spin_box_triangle[data-v-39eaae7b] {
        width: 110% !important
    }

    .wheel_point_box[data-v-39eaae7b] {
        font-size: 12px
    }
}

@media (max-width:375px) {
    .wheel_point_box[data-v-39eaae7b] {
        font-size: 8px
    }
}

[data-v-01c2b458]:root {
    --currentColor: 51, 50, 48;
    --bg-pageTitle: linear-gradient(180deg, #fff 19.11%, #8b857d 71.43%)
}

.text-shadow-custom[data-v-01c2b458] {
    text-shadow: 0 2px 0 rgba(0, 0, 0, .2), 0 1px 0 #333230
}

.bg-darkBrand-600[data-v-01c2b458] {
    --tw-bg-opacity: 1;
    --darkBrand-600: 51 50 48;
    background-color: rgb(var(--darkBrand-600)/var(--tw-bg-opacity))
}

.border-darkBrand-500[data-v-01c2b458] {
    --tw-border-opacity: 1;
    --darkBrand-500: 71 70 66;
    border-color: rgb(var(--darkBrand-500)/var(--tw-border-opacity))
}

.container-title[data-v-01c2b458] {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent;
    font-size: 24px;
    font-weight: 900;
    text-align: center;
    width: 100%
}

.container-timer[data-v-01c2b458] {
    display: flex;
    justify-content: center;
    margin-bottom: 24px;
    margin-top: 18px
}

.timer-text[data-v-01c2b458] {
    align-items: center;
    color: #fafafa;
    display: flex;
    font-size: 18px
}

.timer-text .icon-countdown[data-v-01c2b458] {
    font-size: 24px;
    margin-right: 6px
}

.timer-text .icon-countdown[data-v-01c2b458]:before {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent
}

.inner-timer[data-v-01c2b458] {
    align-items: center;
    display: flex
}

.cd-box-wrap[data-v-01c2b458] {
    position: relative
}

.cd-box[data-v-01c2b458],
.cd-box-wrap[data-v-01c2b458] {
    align-items: center;
    display: flex;
    justify-content: center
}

.cd-box[data-v-01c2b458] {
    border: 1px solid #5f5f5f;
    border-radius: 10px;
    color: #fafafa;
    font-size: 18px;
    height: 50px;
    margin-left: 6px;
    margin-right: 6px;
    padding: 6px;
    width: 50px
}

.cd-desc[data-v-01c2b458] {
    bottom: -18px;
    font-size: 12px;
    position: absolute
}

.cd-colon[data-v-01c2b458],
.cd-desc[data-v-01c2b458] {
    color: #fafafa
}

.bg-pageTitle[data-v-01c2b458] {
    background-image: linear-gradient(180deg, #fff 19.11%, #8b857d 71.43%)
}

.text-content-base[data-v-01c2b458] {
    --content-base: 255 255 255;
    --tw-text-opacity: 1;
    color: rgb(var(--content-base)/var(--tw-text-opacity))
}

.minigame-body[data-v-01c2b458] {
    margin-bottom: -50px
}

#bz-game-area[data-v-01c2b458] {
    align-items: center;
    background: transparent;
    color: #fff;
    display: flex;
    height: 380px;
    justify-content: center;
    margin: 0 auto;
    pointer-events: auto;
    position: relative;
    touch-action: pan-y pinch-zoom;
    transform: translateY(-100px);
    width: 100%
}

#bz-game-area.scratcher-mode[data-v-01c2b458] {
    margin-top: 80px
}

.game-container[data-v-01c2b458] {
    height: 65vh;
    padding-top: 20px;
    position: relative;
    touch-action: pan-y
}

.section01[data-v-01c2b458] {
    margin-top: 20px
}

.section02[data-v-01c2b458] {
    background-color: #222121;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
    padding-bottom: 50px;
    padding-top: 100px
}

.terms-and-conditions-header[data-v-01c2b458] {
    background: #302d28;
    border: 1pt solid hsla(43, 36%, 65%, .3);
    border-radius: 5pt;
    box-sizing: border-box;
    height: 40px;
    margin: -50px auto 0;
    width: 70%
}

.mini_games_label[data-v-01c2b458] {
    color: #fff;
    font-size: 20px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: -moz-max-content;
    width: max-content
}

.mini_games_label[data-v-01c2b458],
.question-mark[data-v-01c2b458] {
    align-items: center;
    display: flex;
    font-weight: 700
}

.question-mark[data-v-01c2b458] {
    background: #b8a576;
    border-radius: 50%;
    color: #000;
    font-size: 12px;
    height: 16px;
    justify-content: center;
    margin-right: 10px;
    text-align: center;
    width: 16px
}

.mini_games_desc_box[data-v-01c2b458] {
    background: #302d28;
    border: 1pt solid hsla(43, 36%, 65%, .3);
    border-radius: 10px;
    color: #fff;
    margin: 10px auto 0;
    padding: 30px;
    width: 70%
}

.mini_games_desc_box[data-v-01c2b458] menu,
.mini_games_desc_box[data-v-01c2b458] ol,
.mini_games_desc_box[data-v-01c2b458] ul {
    list-style: revert;
    margin: revert;
    padding: revert
}

.mini_games_container[data-v-01c2b458] {
    margin: 0 auto;
    max-width: 1920px;
    padding: 0 10px;
    width: 100%
}

@media (min-width:400px) and (max-width:767px) {
    #bz-game-area[data-v-01c2b458] {
        height: 400px;
        transform: translateY(-80px)
    }
}

@media (min-width:768px) {
    .mini_games_container[data-v-01c2b458] {
        padding: 0 50px
    }

    #bz-game-area[data-v-01c2b458] {
        height: 100%;
        transform: translateY(-80px)
    }

    .game-container[data-v-01c2b458] {
        padding: 0;
        position: relative;
        touch-action: pan-y
    }

    .info-modal-content[data-v-01c2b458] {
        min-height: 650px
    }
}

@media (max-width:639px) {
    .outer-timer-wrap[data-v-01c2b458] {
        height: 90px
    }

    .container-title[data-v-01c2b458] {
        font-size: 16px;
        margin-bottom: 8px
    }

    .timer-text[data-v-01c2b458] {
        font-size: 12px
    }

    .timer-text .icon-countdown[data-v-01c2b458] {
        font-size: 14px
    }

    .cd-box[data-v-01c2b458] {
        font-size: 12px;
        height: 30px;
        margin-left: 4px;
        margin-right: 4px;
        padding: 4px;
        width: 30px
    }

    .cd-desc[data-v-01c2b458] {
        bottom: -16px;
        font-size: 9px
    }
}

.mini-games-header[data-v-01c2b458] {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    position: relative;
    z-index: 2
}

.mini-games-header-content[data-v-01c2b458] {
    align-items: center;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    width: -moz-min-content;
    width: min-content
}

.mini-games-img[data-v-01c2b458] {
    width: 2.5rem
}

.skeleton-loader[data-v-01c2b458] {
    border-radius: .5rem;
    min-height: 2.5rem;
    min-width: 2.5rem
}

.skeleton-loader[data-v-01c2b458],
.skeleton-loader-text[data-v-01c2b458] {
    animation: skeleton-loading-01c2b458 1.2s linear infinite;
    background: linear-gradient(90deg, #333 25%, #444 50%, #333 75%);
    background-size: 200% 100%;
    display: inline-block
}

.skeleton-loader-text[data-v-01c2b458] {
    border-radius: .25em;
    height: 1em;
    width: 80px
}

@keyframes skeleton-loading-01c2b458 {
    0% {
        background-position: 200% 0
    }

    to {
        background-position: -200% 0
    }
}

.mini-games-span[data-v-01c2b458] {
    white-space: nowrap
}

.mini-games-btn[data-v-01c2b458] {
    background: radial-gradient(circle, #b8a576 60%, #756041 100%);
    border: none;
    border-radius: 3pt;
    font-weight: 600;
    opacity: 1;
    outline: none;
    transition: box-shadow .2s;
    width: -moz-fit-content;
    width: fit-content
}

.mini-games-btn[data-v-01c2b458]:active {
    box-shadow: 0 0 0 2px #b8a576
}

.info-modal-content[data-v-01c2b458] {
    background-color: #222121;
    min-height: 600px;
    padding: 2rem
}

.info-modal-content h3[data-v-01c2b458] {
    color: var(--primary, #3b82f6)
}

.info-modal-content p[data-v-01c2b458] {
    line-height: 1.6
}

.info-modal-content button[data-v-01c2b458] {
    transition: all .3s ease
}

.info-modal-content-title[data-v-01c2b458] {
    color: #fff;
    font-weight: 700;
    margin-bottom: 1rem;
    text-align: center
}

.mini-games-modal .fmodal-content[data-v-01c2b458] {
    -ms-overflow-style: none;
    scrollbar-width: none
}

.mini-games-modal .fmodal-content[data-v-01c2b458]::-webkit-scrollbar {
    display: none
}

.tab-navigation[data-v-01c2b458] {
    align-items: center;
    border-bottom: 1px solid grey;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-left: 20px;
    padding-right: 20px;
    position: relative
}

.tab-button[data-v-01c2b458] {
    background-color: transparent;
    border-bottom: none;
    display: inline-block;
    padding-bottom: .5rem;
    position: relative
}

.tab-center[data-v-01c2b458] {
    left: 50%;
    position: absolute;
    text-align: center;
    transform: translate(-50%);
    width: auto
}

.tab-button.active[data-v-01c2b458]:after {
    background-color: #b8a576;
    bottom: -1px;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 1
}

.tab-content[data-v-01c2b458] {
    -ms-overflow-style: none;
    height: auto;
    max-height: 550px;
    overflow-y: auto;
    scrollbar-width: none
}

.tab-panel[data-v-01c2b458] {
    height: 100%;
    padding: 1rem 0
}

.animate-event[data-v-01c2b458] {
    animation: bounce-deposit-01c2b458 .5s ease-in-out infinite
}

@keyframes bounce-deposit-01c2b458 {

    0%,
    to {
        transform: translateY(0)
    }

    60% {
        transform: translateY(-4px)
    }
}

body:has(.mini-games-container) .bg-modal {
    background-color: #222121 !important
}

body:has(.mini-games-modal) .fmodal-content {
    -ms-overflow-style: none;
    scrollbar-width: none
}

.mini-games-modal .fmodal-content::-webkit-scrollbar {
    display: none
}

@media (max-width:767px) {
    body:has(.mini-games-modal) .info-modal {
        padding: unset !important
    }
}

.angpow-rain-layout[data-v-5f7e6401] {
    height: var(--window-height)
}

.congratulations-text[data-v-5f7e6401] {
    text-shadow: 0 3px 4px #f4f413d3
}

.grap-text[data-v-5f7e6401],
.seconds-text[data-v-5f7e6401] {
    color: #fffacc
}

.seconds-text[data-v-5f7e6401] {
    word-spacing: 3px
}

.try-your-luck-text[data-v-5f7e6401] {
    color: #fffcf2;
    text-shadow: 0 3px 3px #964b0780
}

.sunset-image[data-v-5f7e6401] {
    animation: sunset-5f7e6401 15s linear infinite
}

@keyframes sunset-5f7e6401 {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(1turn)
    }
}

.angpow-image[data-v-5f7e6401] {
    animation: zoomShake-5f7e6401 2s linear infinite
}

@keyframes zoomShake-5f7e6401 {
    0% {
        transform: scale(1)
    }

    12.5% {
        transform: scale(1.2)
    }

    25% {
        transform: scale(1)
    }

    37.5% {
        transform: scale(1.2)
    }

    50% {
        transform: scale(1)
    }

    55% {
        transform: rotate(3deg)
    }

    60% {
        transform: rotate(-3deg)
    }

    65% {
        transform: rotate(3deg)
    }

    70% {
        transform: rotate(-3deg)
    }

    75% {
        transform: rotate(1deg)
    }

    80% {
        transform: rotate(-1deg)
    }

    to {
        transform: rotate(0)
    }
}

.timer-title-view[data-v-5f7e6401]:after,
.timer-title-view[data-v-5f7e6401]:before {
    background: linear-gradient(90deg, #ffdc9f00, #ffdc9f);
    content: "";
    height: 1px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 17.5%
}

.timer-title-view[data-v-5f7e6401]:before {
    left: 19%
}

.timer-title-view[data-v-5f7e6401]:after {
    background: linear-gradient(270deg, #ffdc9f00, #ffdc9f);
    right: 19%
}

.timer-title[data-v-5f7e6401]:after,
.timer-title[data-v-5f7e6401]:before {
    background: url(../img/rewards/angpow/flower.webp) no-repeat;
    background-size: 12px;
    content: "";
    height: 12px;
    position: absolute;
    top: 3px;
    width: 12px
}

.timer-title[data-v-5f7e6401]:before {
    left: -20px
}

.timer-title[data-v-5f7e6401]:after {
    right: -20px
}

.angpow-timer .timer-count[data-v-5f7e6401] {
    background: #fcecde;
    border: 1px solid #e5bb93;
    color: #d4200d
}

.angpow-timer .timer-text[data-v-5f7e6401],
.angpow-timer .timer-title[data-v-5f7e6401] {
    color: #fffacc
}

.winner_box.layer-1[data-v-5f7e6401] {
    background: linear-gradient(180deg, #f0af0c, #a50);
    border: 1px solid #ffb700
}

.winner_box .layer-2[data-v-5f7e6401] {
    border: 5px dotted #ffefad;
    color: #ffefe6
}

.winner_box .layer-3[data-v-5f7e6401] {
    background: linear-gradient(180deg, #373123, #251f15)
}

.winner_box_list[data-v-5f7e6401] {
    height: 108px
}

.ranking_container[data-v-5f7e6401] {
    bottom: -36px;
    left: 0;
    position: absolute;
    transform: translateY(0);
    width: 100%
}

.ranking_container.below[data-v-5f7e6401] {
    bottom: unset;
    top: 0
}

.ranking_container.move[data-v-5f7e6401] {
    transform: translateY(-36px);
    transition: all .5s
}

.ranking_box[data-v-5f7e6401] {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    width: 100%
}

.ranking_box[data-v-5f7e6401]:nth-child(odd) {
    background-color: #382204
}

.ranking_box[data-v-5f7e6401]:nth-child(2n) {
    background-color: #443313
}

.angpow-congratulations .received-text[data-v-5f7e6401] {
    color: #93001f
}

.angpow-congratulations .claimed-text[data-v-5f7e6401] {
    color: #d4200d
}

.angpow-congratulations button[data-v-5f7e6401] {
    border-color: #fff
}

.angpow-congratulations .icon-close[data-v-5f7e6401]:before {
    color: #fff
}

.outer-timer-wrap[data-v-5f7e6401] {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 120px;
    justify-content: center
}

.container-title[data-v-5f7e6401] {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent;
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 10px;
    text-align: center;
    width: 100%
}

.container-timer[data-v-5f7e6401] {
    display: flex;
    justify-content: center;
    margin-bottom: 24px
}

.timer-text[data-v-5f7e6401] {
    align-items: center;
    color: #fafafa;
    display: flex;
    font-size: 18px
}

.timer-text .icon-countdown[data-v-5f7e6401] {
    font-size: 24px;
    margin-right: 6px
}

.timer-text .icon-countdown[data-v-5f7e6401]:before {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent
}

.inner-timer[data-v-5f7e6401] {
    align-items: center;
    display: flex
}

.cd-box-wrap[data-v-5f7e6401] {
    position: relative
}

.cd-box[data-v-5f7e6401],
.cd-box-wrap[data-v-5f7e6401] {
    align-items: center;
    display: flex;
    justify-content: center
}

.cd-box[data-v-5f7e6401] {
    border: 1px solid #5f5f5f;
    border-radius: 10px;
    color: #fafafa;
    font-size: 18px;
    height: 50px;
    margin-left: 6px;
    margin-right: 6px;
    padding: 6px;
    width: 50px
}

.cd-desc[data-v-5f7e6401] {
    bottom: -18px;
    font-size: 12px;
    position: absolute
}

.cd-colon[data-v-5f7e6401],
.cd-desc[data-v-5f7e6401] {
    color: #fafafa
}

@media (max-width:639px) {
    .outer-timer-wrap[data-v-5f7e6401] {
        height: 90px
    }

    .container-title[data-v-5f7e6401] {
        font-size: 16px;
        margin-bottom: 8px
    }

    .timer-text[data-v-5f7e6401] {
        font-size: 12px
    }

    .timer-text .icon-countdown[data-v-5f7e6401] {
        font-size: 14px
    }

    .cd-box[data-v-5f7e6401] {
        font-size: 12px;
        height: 30px;
        margin-left: 4px;
        margin-right: 4px;
        padding: 4px;
        width: 30px
    }

    .cd-desc[data-v-5f7e6401] {
        bottom: -16px;
        font-size: 9px
    }
}

@media (max-width:475px) {
    .winner_box_list[data-v-5f7e6401] {
        height: 90px
    }

    .ranking_box[data-v-5f7e6401] {
        font-size: 12px
    }

    .ranking_container[data-v-5f7e6401] {
        bottom: -30px
    }

    .ranking_container.move[data-v-5f7e6401] {
        transform: translateY(-30px)
    }
}

@media (max-width:375px) {
    .timer-title-view[data-v-5f7e6401]:before {
        left: 15%
    }

    .timer-title-view[data-v-5f7e6401]:after {
        right: 15%
    }
}

.cashback-button .text[data-v-530ace69] {
    color: #fff;
    text-shadow: 0 3px 3px #964b0780
}

.coin-wrapper.one[data-v-530ace69] {
    animation: moveCoin1-530ace69 1s linear infinite
}

.coin[data-v-530ace69] {
    animation: spinCoin-530ace69 1s linear infinite
}

@keyframes spinCoin-530ace69 {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(90deg)
    }
}

@keyframes moveCoin1-530ace69 {
    0% {
        opacity: .9;
        transform: translateY(-50px)
    }

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

    80% {
        opacity: .9;
        transform: translateY(0)
    }

    to {
        opacity: 0;
        transform: translateY(0)
    }
}

.coin-wrapper.two[data-v-530ace69] {
    animation: moveCoin2-530ace69 1s linear infinite
}

@keyframes moveCoin2-530ace69 {
    0% {
        opacity: .9;
        transform: translateY(-15px)
    }

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

    80% {
        opacity: .9;
        transform: translateY(0)
    }

    to {
        opacity: 0;
        transform: translateY(0)
    }
}

.coin-wrapper.three[data-v-530ace69] {
    animation: moveCoin3-530ace69 1s linear infinite
}

@keyframes moveCoin3-530ace69 {
    0% {
        opacity: .9;
        transform: translateY(-100px)
    }

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

    80% {
        opacity: .9;
        transform: translateY(0)
    }

    to {
        opacity: 0;
        transform: translateY(0)
    }
}

.cashback-prize h2[data-v-530ace69] {
    -webkit-text-fill-color: #fff;
    -webkit-text-stroke-color: #ff7f00;
    -webkit-text-stroke-width: .025em;
    animation: zoomPause-530ace69 .6s ease-in-out infinite;
    text-shadow: 0 3px 10px #000000cc;
    transform-origin: center
}

@keyframes zoomPause-530ace69 {
    0% {
        transform: scale(.95)
    }

    41.66% {
        transform: scale(1)
    }

    83.33% {
        transform: scale(.95)
    }

    to {
        transform: scale(.95)
    }
}

.cashback-bag .cashback-close-bag[data-v-530ace69] {
    animation: wobble-530ace69 1.1s ease-in-out infinite;
    transform-origin: center
}

@keyframes wobble-530ace69 {
    0% {
        transform: rotate(0)
    }

    12.5% {
        transform: rotate(5deg)
    }

    25% {
        transform: rotate(-5deg)
    }

    37.5% {
        transform: rotate(0)
    }

    50% {
        transform: rotate(5deg)
    }

    62.5% {
        transform: rotate(-5deg)
    }

    75% {
        transform: rotate(0)
    }

    to {
        transform: rotate(0)
    }
}

.cashback-bag .cashback-open-bag[data-v-530ace69] {
    animation: scalePulse-530ace69 .6s ease-in-out infinite;
    transform-origin: center
}

@keyframes scalePulse-530ace69 {
    0% {
        transform: scale(.95)
    }

    50% {
        transform: scale(1)
    }

    to {
        transform: scale(.95)
    }
}

.cashback-platform[data-v-530ace69] {
    bottom: -10%;
    left: 50%;
    position: absolute;
    transform: translate(-50%);
    width: 100%
}

.cashback-shine img[data-v-530ace69] {
    animation: shine-530ace69 1.25s ease-in-out infinite
}

@keyframes shine-530ace69 {
    0% {
        opacity: 1
    }

    20% {
        opacity: 0
    }

    40% {
        opacity: 1
    }

    60% {
        opacity: 0
    }

    80% {
        opacity: 1
    }

    88% {
        opacity: 0
    }

    to {
        opacity: 0
    }
}

.cashback_list[data-v-530ace69] {
    background: linear-gradient(180deg, #373123, #251f15);
    border: 1px solid #c7b587;
    color: #fafafa
}

.cashback_list .icon-down[data-v-530ace69]:before {
    color: #fafafa
}

.arrow-down-icon[data-v-530ace69] {
    transition: transform 1s ease
}

.cashback-list[data-v-530ace69] {
    max-height: 0;
    transition: max-height .5s ease
}

.cashback-list.opening[data-v-530ace69] {
    max-height: var(--max-height)
}

.cashback-list.closing[data-v-530ace69] {
    max-height: 0 !important
}

.outer-timer-wrap[data-v-530ace69] {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 120px;
    justify-content: center
}

.container-title[data-v-530ace69] {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent;
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 10px;
    text-align: center;
    width: 100%
}

.container-timer[data-v-530ace69] {
    display: flex;
    justify-content: center;
    margin-bottom: 24px
}

.timer-text[data-v-530ace69] {
    align-items: center;
    color: #fafafa;
    display: flex;
    font-size: 18px
}

.timer-text .icon-countdown[data-v-530ace69] {
    font-size: 24px;
    margin-right: 6px
}

.timer-text .icon-countdown[data-v-530ace69]:before {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent
}

.inner-timer[data-v-530ace69] {
    align-items: center;
    display: flex
}

.cd-box-wrap[data-v-530ace69] {
    position: relative
}

.cd-box[data-v-530ace69],
.cd-box-wrap[data-v-530ace69] {
    align-items: center;
    display: flex;
    justify-content: center
}

.cd-box[data-v-530ace69] {
    border: 1px solid #5f5f5f;
    border-radius: 10px;
    color: #fafafa;
    font-size: 18px;
    height: 50px;
    margin-left: 6px;
    margin-right: 6px;
    padding: 6px;
    width: 50px
}

.cd-desc[data-v-530ace69] {
    bottom: -18px;
    font-size: 12px;
    position: absolute
}

.cd-colon[data-v-530ace69],
.cd-desc[data-v-530ace69] {
    color: #fafafa
}

@media (max-width:639px) {
    .outer-timer-wrap[data-v-530ace69] {
        height: 90px
    }

    .container-title[data-v-530ace69] {
        font-size: 16px;
        margin-bottom: 8px
    }

    .timer-text[data-v-530ace69] {
        font-size: 12px
    }

    .timer-text .icon-countdown[data-v-530ace69] {
        font-size: 14px
    }

    .cd-box[data-v-530ace69] {
        font-size: 12px;
        height: 30px;
        margin-left: 4px;
        margin-right: 4px;
        padding: 4px;
        width: 30px
    }

    .cd-desc[data-v-530ace69] {
        bottom: -16px;
        font-size: 9px
    }
}

.mystery-box-card .mystery-box-img[data-v-fbcdc6dd] {
    animation: floating-fbcdc6dd 1s ease-in-out infinite
}

@keyframes floating-fbcdc6dd {
    0% {
        transform: translateZ(0)
    }

    45% {
        transform: translate3d(0, -10%, 0)
    }

    55% {
        transform: translate3d(0, -10%, 0)
    }

    to {
        transform: translateZ(0)
    }
}

.mystery-box-base[data-v-fbcdc6dd] {
    bottom: -26%;
    left: 50%;
    position: absolute;
    transform: translate(-50%);
    width: 100%
}

.mystery-box-anime img[data-v-fbcdc6dd] {
    animation: spin-fbcdc6dd 1s linear infinite
}

@keyframes spin-fbcdc6dd {
    0% {
        transform: rotateY(0)
    }

    to {
        transform: rotateY(1turn)
    }
}

.mystery-box-prize h2[data-v-fbcdc6dd] {
    -webkit-text-fill-color: #fff;
    -webkit-text-stroke-color: #ff7f00;
    -webkit-text-stroke-width: .025em;
    text-shadow: 0 3px 10px #000000cc;
    transform-origin: center
}

.mystery-box-prize .value[data-v-fbcdc6dd] {
    animation: zoomPause-fbcdc6dd .6s ease-in-out infinite
}

@keyframes zoomPause-fbcdc6dd {
    0% {
        transform: scale(.95)
    }

    41.66% {
        transform: scale(1)
    }

    83.33% {
        transform: scale(.95)
    }

    to {
        transform: scale(.95)
    }
}

.mystery-box-button .text[data-v-fbcdc6dd] {
    color: #fff;
    text-shadow: 0 3px 3px #964b0780
}

.mystery-box-collect-popup[data-v-fbcdc6dd] {
    backdrop-filter: blur(35px);
    -webkit-backdrop-filter: blur(35px);
    background: rgba(0, 0, 0, .74);
    color: #fff
}

.mystery-box-collect-popup[data-v-fbcdc6dd]:before {
    background: linear-gradient(180deg, #8737e3, #1082e3);
    border-radius: 20px;
    content: "";
    inset: 0;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
    position: absolute
}

.outer-timer-wrap[data-v-fbcdc6dd] {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 120px;
    justify-content: center
}

.container-title[data-v-fbcdc6dd] {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent;
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 10px;
    text-align: center;
    width: 100%
}

.container-timer[data-v-fbcdc6dd] {
    display: flex;
    justify-content: center;
    margin-bottom: 24px
}

.timer-text[data-v-fbcdc6dd] {
    align-items: center;
    color: #fafafa;
    display: flex;
    font-size: 18px
}

.timer-text .icon-countdown[data-v-fbcdc6dd] {
    font-size: 24px;
    margin-right: 6px
}

.timer-text .icon-countdown[data-v-fbcdc6dd]:before {
    -webkit-background-clip: text;
    background-clip: text;
    background-image: linear-gradient(180deg, #ff0, #ff7600);
    color: transparent
}

.inner-timer[data-v-fbcdc6dd] {
    align-items: center;
    display: flex
}

.cd-box-wrap[data-v-fbcdc6dd] {
    position: relative
}

.cd-box[data-v-fbcdc6dd],
.cd-box-wrap[data-v-fbcdc6dd] {
    align-items: center;
    display: flex;
    justify-content: center
}

.cd-box[data-v-fbcdc6dd] {
    border: 1px solid #5f5f5f;
    border-radius: 10px;
    color: #fafafa;
    font-size: 18px;
    height: 50px;
    margin-left: 6px;
    margin-right: 6px;
    padding: 6px;
    width: 50px
}

.cd-desc[data-v-fbcdc6dd] {
    bottom: -18px;
    font-size: 12px;
    position: absolute
}

.cd-colon[data-v-fbcdc6dd],
.cd-desc[data-v-fbcdc6dd] {
    color: #fafafa
}

@media (max-width:639px) {
    .outer-timer-wrap[data-v-fbcdc6dd] {
        height: 90px
    }

    .container-title[data-v-fbcdc6dd] {
        font-size: 16px;
        margin-bottom: 8px
    }

    .timer-text[data-v-fbcdc6dd] {
        font-size: 12px
    }

    .timer-text .icon-countdown[data-v-fbcdc6dd] {
        font-size: 14px
    }

    .cd-box[data-v-fbcdc6dd] {
        font-size: 12px;
        height: 30px;
        margin-left: 4px;
        margin-right: 4px;
        padding: 4px;
        width: 30px
    }

    .cd-desc[data-v-fbcdc6dd] {
        bottom: -16px;
        font-size: 9px
    }
}

@media (max-width:450px) {
    .mystery-box-popup[data-v-fbcdc6dd] {
        max-width: 35%
    }
}

.rewards-main-slider[data-v-4f791f9f] {
    height: calc(var(--window-height) - 215px)
}

.rewards-modal-container-open[data-v-4f791f9f] {
    animation: zoomIn-4f791f9f 1s cubic-bezier(.25, 1, .5, 1) forwards
}

@keyframes zoomIn-4f791f9f {
    0% {
        opacity: 0;
        transform: scale(0)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

.rewards-modal-container-close[data-v-4f791f9f] {
    animation: zoomOut-4f791f9f .5s cubic-bezier(.25, 1, .5, 1) forwards
}

@keyframes zoomOut-4f791f9f {
    0% {
        opacity: 1;
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(0)
    }
}

[data-v-4f791f9f] .swiper-slider .swiper-wrapper {
    justify-content: center
}

.rewards-list[data-v-4f791f9f] {
    border: 1px solid var(--line);
    color: #fff
}

.active-slide[data-v-4f791f9f] {
    background: radial-gradient(ellipse 75% 75% at 50% 10%, #b4b4b4 0, #757575 70%);
    border-color: transparent
}

[data-v-4f791f9f] .o-checkbox {
    border: 2px solid #707070;
    border-radius: 4px;
    height: 20px;
    width: 20px
}

[data-v-4f791f9f] .o-checkbox:after {
    top: calc(50% - .1em)
}

[data-v-4f791f9f] .o-checkbox-label {
    color: #fff;
    font-size: 16px
}

.rewards-modal .icon-close[data-v-4f791f9f]:before {
    color: #fafafa
}

.rewards-modal .icon-double-right-arrow[data-v-4f791f9f]:before {
    background: linear-gradient(#f5d976, #e27b13);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent
}

@media (max-width:639px) {
    .rewards-main-slider[data-v-4f791f9f] {
        height: calc(var(--window-height) - 137px)
    }

    [data-v-4f791f9f] .o-checkbox {
        height: 18px;
        width: 18px
    }

    [data-v-4f791f9f] .o-checkbox-label {
        font-size: 14px;
        margin-top: 2px
    }
}

.landscape_box[data-v-05285063] {
    background-color: #000;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2000
}

.landscape_container[data-v-05285063] {
    left: 50%;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%)
}

.landscape_img[data-v-05285063] {
    margin: 0 auto;
    width: 30%
}

.app-claim-mobile-overlay[data-v-81949d21] {
    align-items: center;
    background-color: #0009;
    display: flex;
    inset: 0;
    justify-content: center;
    position: fixed;
    z-index: 10000
}

.app-claim-mobile-container[data-v-81949d21] {
    background-color: #fff;
    border-radius: 16px;
    max-width: 282px;
    padding-top: 24px;
    text-align: center
}

.app-claim-mobile-title[data-v-81949d21] {
    color: #000;
    font-size: 20px
}

.app-claim-mobile-message[data-v-81949d21] {
    color: #505050;
    font-size: 14px;
    margin-top: 12px;
    padding-left: 24px;
    padding-right: 24px
}

.app-claim-mobile-footer[data-v-81949d21] {
    border-top: 1px solid #ddd;
    display: flex;
    height: 66px;
    margin-top: 16px
}

.app-claim-mobile-divider[data-v-81949d21] {
    background-color: #ddd;
    width: 1px
}

.app-claim-mobile-btn[data-v-81949d21] {
    align-items: center;
    cursor: pointer;
    display: flex;
    flex: 1;
    font-size: 20px;
    justify-content: center
}

.app-claim-mobile-cancel[data-v-81949d21] {
    color: #000
}

.app-claim-mobile-download[data-v-81949d21] {
    color: #206cd8
}

.app-claim-modal-container[data-v-81949d21] {
    align-items: center;
    display: flex;
    height: 513px;
    justify-content: center;
    left: 50%;
    margin: 0 auto;
    position: fixed;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%
}

.app-claim-modal-bg[data-v-81949d21] {
    background-image: linear-gradient(180deg, #ffc32e, #e8c05b 40%, #f0d694 75%, #fffefd);
    border-radius: 20px;
    height: 400px;
    width: 430px
}

.app-claim-modal-bg[data-v-81949d21],
.app_claim_bg[data-v-81949d21] {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%)
}

.app_claim_bg[data-v-81949d21] {
    width: 100%
}

.app-claim-modal-content[data-v-81949d21] {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    height: 400px;
    justify-content: space-between;
    left: 50%;
    padding: 45px;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 430px
}

.claim-app-message[data-v-81949d21] {
    color: #000;
    font-size: 18px;
    text-align: center
}

.qr_container[data-v-81949d21] {
    align-items: center;
    display: flex;
    gap: 20px;
    justify-content: center
}

.qr_box[data-v-81949d21] {
    background-color: #fff;
    padding: 16px
}

.qr_description[data-v-81949d21] {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    margin-top: 10px;
    width: 100%
}

.qr_description[data-v-81949d21]>:not(:last-child) {
    margin-right: 8px
}

.icon_android[data-v-81949d21],
.icon_ios[data-v-81949d21] {
    height: 26px;
    width: 26px
}

.icon_description[data-v-81949d21] {
    color: #000;
    font-size: 16px
}

.claim-close-btn[data-v-81949d21] {
    align-items: center;
    background: linear-gradient(180deg, #ffad7c, #d92d15);
    border: none;
    border-radius: 30px;
    color: #fff;
    display: flex;
    height: 32px;
    justify-content: center;
    width: 210px
}

@media (max-width:1024px) {
    .app-claim-modal-container[data-v-81949d21] {
        height: 350px;
        width: 500px
    }

    .app-claim-modal-bg[data-v-81949d21],
    .app-claim-modal-content[data-v-81949d21] {
        height: 300px;
        max-width: 500px;
        padding: 32px;
        width: 300px
    }

    .claim-app-message[data-v-81949d21] {
        font-size: 12px
    }

    .qr_box[data-v-81949d21] {
        padding: 13px
    }

    .icon_android[data-v-81949d21],
    .icon_ios[data-v-81949d21] {
        height: 23px;
        width: 23px
    }

    .icon_description[data-v-81949d21] {
        color: #000;
        font-size: 10px
    }

    .claim-close-btn[data-v-81949d21] {
        height: 25px;
        width: 157px
    }
}

@media (max-width:350px) {
    .app-claim-modal-container[data-v-81949d21] {
        height: unset;
        padding-top: 100%;
        width: 100%
    }

    .app-claim-modal-bg[data-v-81949d21],
    .app-claim-modal-content[data-v-81949d21] {
        height: 70%;
        padding: 15px;
        width: 70%
    }

    .claim-app-message[data-v-81949d21] {
        font-size: 12px
    }

    .qr_container[data-v-81949d21] {
        gap: 5px;
        margin-top: 5px;
        width: 160px
    }

    .qr_box[data-v-81949d21] {
        display: inline-flex;
        padding: 5px
    }

    .icon_android[data-v-81949d21],
    .icon_ios[data-v-81949d21] {
        height: 20px;
        width: 20px
    }

    .icon_description[data-v-81949d21] {
        color: #000;
        font-size: 12px
    }

    .claim-close-btn[data-v-81949d21] {
        font-size: 12px;
        height: 25px;
        width: 100%
    }
}

.fadeIn[data-v-30c917b4] {
    animation-delay: .3s;
    animation: fadeIn-30c917b4 .6s ease-in-out
}

.btn-cta-color[data-v-30c917b4] {
    background: #007aff;
    height: 50px;
    padding: 10px 0;
    width: 180px
}

@media (max-width:768px) {
    .btn-cta-color[data-v-30c917b4] {
        height: 50px;
        width: 150px
    }
}

@keyframes fadeIn-30c917b4 {
    0% {
        opacity: 0;
        transform: scale(.3)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

.o-phone-select[data-v-889a26f8] .o-select-container .o-icon.right {
    right: .25rem
}

.o-phone-select[data-v-889a26f8] .o-select-container .o-icon.right .o-select-arrow {
    width: 8px
}

.o-phone-select[data-v-889a26f8] .o-select-value-label .o-select-value-label-img-container {
    clip-path: circle(50% at 50% 50%);
    margin-right: .5em
}

@media screen and (max-width:767px) {
    .cta_modal.fmodal-wrapper {
        align-items: center;
        padding: 15px
    }
}

.reward-deposit-btn {
    background: linear-gradient(180deg, #fbb040, #f7941d);
    border: none;
    border-radius: .25rem;
    color: #fff;
    cursor: pointer;
    display: block;
    font-weight: 700;
    padding: .5rem 1rem;
    text-align: center;
    width: 100%
}

.cta_container[data-v-73d2edca] {
    background-color: var(--content)
}

.reward-deposit-btn[data-v-73d2edca] {
    background: radial-gradient(ellipse 75% 75% at 50% 10%, #f5d976 0, #e27b13 70%);
    border: none;
    border-radius: .25rem;
    color: #fff;
    cursor: pointer;
    display: block;
    font-weight: 700;
    padding: .5rem 1rem;
    text-align: center;
    width: 100%
}

.buttonStyle[data-v-73d2edca],
.buttonStyle .icon-close[data-v-73d2edca]:before {
    color: #fafafa
}

@media screen and (max-width:767px) {
    .cta_modal.fmodal-wrapper[data-v-73d2edca] {
        align-items: center;
        padding: 15px
    }
}

.game-maintenance-modal-title[data-v-fb9917f7] {
    color: gold;
    font-size: 14px;
    font-weight: 700;
    margin-top: 10px;
    text-align: center
}

.game-maintenance-modal-description[data-v-fb9917f7] {
    color: gold;
    font-size: 14px;
    font-weight: 400;
    margin-top: 10px;
    padding: 0 20px;
    text-align: center
}

.download_bg[data-v-431c87b6] {
    align-items: center;
    background-image: url(../img/download_bg.webp);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    height: 100%;
    justify-content: center;
    padding: 50px 0
}

.download_left[data-v-431c87b6] {
    margin-right: 20px;
    position: relative;
    width: 380px
}

.candy_bg_left[data-v-431c87b6] {
    left: 50%;
    max-width: unset;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 150%
}

.download_left_container[data-v-431c87b6] {
    background-color: #00000080;
    border-radius: 10px;
    padding: 20px 50px;
    position: relative;
    text-align: center;
    width: 100%
}

.text_1[data-v-431c87b6] {
    color: #fff;
    font-size: 18px;
    font-weight: 700
}

.text_2[data-v-431c87b6] {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    margin-top: 20px
}

.line_1[data-v-431c87b6] {
    background-color: #fff;
    height: 1px;
    margin: 20px 0;
    width: 100%
}

.text_3[data-v-431c87b6] {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    margin-top: 20px
}

.qr_box[data-v-431c87b6] {
    background-color: #fff;
    padding: 5px
}

.text_4[data-v-431c87b6] {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    margin-top: 5px
}

.download_right[data-v-431c87b6] {
    max-width: calc(100% - 500px);
    width: 600px
}

.phone_container[data-v-431c87b6] {
    margin: 0 auto;
    position: relative;
    width: 100%
}

.phone_container_aspect_ratio[data-v-431c87b6] {
    padding-top: 100%;
    width: 100%
}

.candy_bg_right[data-v-431c87b6] {
    left: 0;
    transform: translateY(-50%)
}

.candy_bg_right[data-v-431c87b6],
.sample_phone[data-v-431c87b6] {
    position: absolute;
    top: 50%;
    width: 100%
}

.sample_phone[data-v-431c87b6] {
    left: 50%;
    transform: translate(-50%, -50%)
}

.download_image[data-v-431c87b6] {
    border-radius: 20px;
    left: 50%;
    position: absolute;
    top: 8.8%;
    transform: translate(-50%);
    width: 35%
}

.download_logo[data-v-431c87b6] {
    align-items: center;
    border-radius: 10px;
    display: flex;
    height: 150px;
    justify-content: center;
    margin: 20px auto 0;
    position: relative;
    width: 150px
}

.download_icon[data-v-431c87b6] {
    margin-right: 10px;
    width: 25px
}

.download_btn_content[data-v-431c87b6] {
    width: calc(100% - 35px)
}

@media (max-width:1024px) {
    .download_left[data-v-431c87b6] {
        margin-right: 0;
        width: 100%
    }

    .candy_bg_left[data-v-431c87b6] {
        width: 100%
    }

    .download_left_container[data-v-431c87b6] {
        margin: 0 auto;
        width: 500px
    }

    .download_right[data-v-431c87b6] {
        max-width: 500px
    }
}

@media (max-width:767px) {
    .download_left_container[data-v-431c87b6] {
        padding: 20px;
        width: 280px
    }
}

.password_input_right[data-v-642d5921] {
    padding-right: 2.25em
}

.password_input_right.with_tooltip[data-v-642d5921] {
    padding-right: 70px
}

.password_icon[data-v-642d5921] {
    right: 10px
}

.withdraw_ok_btn {
    background: linear-gradient(to bottom, var(--primary), var(--secondary));
    color: #fff;
    opacity: 1;
    transition: all .3s
}

.withdraw_ok_btn:disabled {
    opacity: .5
}