@import url('https://fonts.googleapis.com/css2?family=Prompt:wght@300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800&display=swap');
body {
    background-image: url(../../images/bg/Chai2160.webp);
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #291c01;
    background-size: 100%;
    text-align: center;
    /* background-position: right, top; */
}
/* @media only screen and (max-width: 1000px) {
    body {
        background-size: 80% !important;
    }
}
@media only screen and (max-width: 370px) {
    body {
        font-size: 400px 400px !important;
    }
} */

.modal-body {
    padding: 2px !important;
}

.td,
.table thead th {
    vertical-align: middle;
}

.preloader {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999999;
    -webkit-transition: .6s;
    -o-transition: .6s;
    transition: 3s;
    margin: 0 auto;
    opacity: 0.9;
    background-color: #0000001f;
}

.box_img {
    width: 100%;
    justify-content: center;
    justify-items: center;
    display: flex;
}

.box_logo {
    position: absolute;
    width: 250px;
}

.nav-bottom-mobile {
    background-image: linear-gradient(0deg, #3502b1 1%, #5f0ad0 5%, #7a00ff 30%, #230264 94%, #330074 97%, #36066b 98%);
    color: #ffff;
    text-shadow: 1px 0 0 black;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 2;
}

.nav-top-mobile {
    background-image: linear-gradient(0deg, #930000 1%, #830000 5%, #c60202 30%, #5e0101 94%, #550101 97%, #900000 98%);
    color: #fffdfd;
    text-shadow: 1px 0 0 black;
    position: fixed;
    top: 0;
    width: 100%;
    display: flex;
    align-content: center;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-items: center;
    z-index: 5;
}

.nav-flex-space-between {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}

.nav-flex-center {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.menu-top {
    position: absolute;
    margin-top: 15px;
    display: flex;
    width: 100%;
    justify-content: center;
    left: 0;
    right: 0;
}

.menu-icon-top {
    border-radius: 50%;
    width: 75px;
    box-shadow: inset 0 0 4px 2px #000000, inset 0 0 6px 5px #8d0000, 0 0 0px 2px #780000, 0 0 2px 3px #750000;
    border-width: 2px;
    border-style: solid;
    border-color: #454545;
    background: #141216;
    cursor: pointer;
    position: absolute;
}

.menu-top-btn {
    font-family: 'Prompt', sans-serif !important;
    border: 2px solid #454545;
    padding: 5px 25px;
    border-radius: 2ex;
    box-shadow: inset 0 0 4px 1px black;
    z-index: 2;
    cursor: pointer;
    font-size: 18px;
    font-weight: 600;
}

.menu-top-btn-e {
    font-family: 'Prompt', sans-serif !important;
    z-index: 2;
    display: flex;
    cursor: pointer;
    justify-content: center;
}

.menu-icon {
    max-width: 75px
}

.head-top {
    margin-top: 4.5rem;
}

.head-top-logo {
    display: flex;
    justify-content: center;
    border-radius: 5px;
}

.box-body {
    display: flex;
    justify-content: center;
    border-radius: 12px;
    flex-direction: column;
    border-width: 2px;
    border-style: outset;
    border-color: #00d3c9;
    box-shadow: 0 0 4px 0px black;
}

.box-bodych {
    display: flex;
    justify-content: center;
    border-radius: 12px;
    flex-direction: column;
    border-width: 2px;
    border-style: outset;
    border-color: #a78000;
    box-shadow: 0 0 4px 0px black;
}

.card-web {
    padding: 0.15rem;
}

.nav-bg-mobile {
    background-image: linear-gradient(0deg, #b80909 8%, #ec3a3a 25%, #920a0a 90%, #ff3838 95%, #6b0606 5%);
    color: #ffff;
    text-shadow: 1px 0 0 black;
}

.container-fluid {
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
}

.logo-headset {
    max-width: auto;
    border-radius: 15px;
    border-color: rgb(141 1 1);
}

.head-top-jackpot {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.15rem;
}

.title-jackpot {
    border: 2px dotted #222;
    padding: 0 15px;
    border-radius: 2em;
    box-shadow: inset 0 0 5px 4px black, 0 0 0px 1px #272727;
    z-index: 1;
    background: linear-gradient(45deg, #20c396, #20c396, #20c387, #20c38e, #20c396, #20c38e, #20c38e, #20c39d, #02362a);
    background-size: 400%;
    color: #efdf1b;
    font-weight: 700;
    text-shadow: -1px -1px 3px black;
    animation: identifier 20s linear infinite;
}

.body-jackpot {
    border-width: 3px;
    border-style: outset;
    border-color: #014a22;
    padding: 3px;
    border-radius: 50px;
    margin-top: -12px;
    text-align: center;
    width: 100%;
    font-size: 1.5rem;
    margin-bottom: 5px;
    background: linear-gradient(45deg, #20c35a, #20c378, #20c35a, #20c378, #20c369, #20c370, #20c370, #20c378, #02362a);
    background-size: 400%;
    animation: identifier 20s linear infinite;
}

.jackpot-conttent {
    background-image: linear-gradient(0deg, #019767 1%, #003a2a 2%, #00623e 10%, #006e3b 55%, #003a25 94%, #016097 98%);
    border-radius: 25px;
    border: 1px solid #0f48c9;
    box-shadow: inset 0 0 2px 3px #16bf4a;
}

@keyframes identifier {
    0% {
        background-position: 0 0;
    }
    50% {
        background-position: 400% 0;
    }
    100% {
        background-position: 0 0;
    }
}

.tt-jackpot {
    font-family: 'Orbitron', 'sans-serif' !important;
    font-size: 30px !important;
    font-weight: bold;
    color: #e2c64a;
    letter-spacing: -1.5px;
    background: -webkit-linear-gradient(transparent, #f5690600), -webkit-linear-gradient(top, rgb(255 218 10 / 0%) 0%, #ba7219 26%, rgb(255 232 118) 35%, rgb(255 201 92) 45%, rgb(255 228 107) 61%, #ffda15 100%);
    background: -o-linear-gradient(transparent, transparent);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.bo-img {
    border-width: 6px;
    border-style: outset;
    border-color: #880606;
    padding: 4px;
    border-radius: 50px;
    margin-top: 1px;
    text-align: center;
    width: 100%;
    font-size: 1.5rem;
    margin-bottom: 5px;
    background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
    background-size: 400%;
    animation: identifier 20s linear infinite;
}

.menu-game:hover,
.menu-game:active,
.bo-img:hover,
.bo-img:active {
    box-shadow: 1px 1px 3px 0px black;
}

.nav-mobile {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-evenly;
    align-items: center;
}

.menu_box {
    width: 120%;
    display: flex;
    flex-direction: column;
    align-content: stretch;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-items: center;
    cursor: pointer;
}

.menu_box_item {
    display: flex;
    /* flex-direction: column; */
    align-items: center;
}

.menu_box:hover .menu_box_item {
    margin-top: -5px;
}

.icon-menu {
    width: 75px;
    margin-top: -2px;
}

.box-menu {
    display: flex;
    justify-content: center;
    cursor: pointer;
}

.box-menu:hover {
    margin-top: -15px;
}

.footer-swap {
    height: 5rem;
}

.card-box {
    background: url(data:image/png;base64,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);
    margin-top: 2rem;
    border-width: 3px 3px 3px 3px;
    border-style: ridge;
    border-color: #5d01b1;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
}

.box-head {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    line-height: 1.2;
    align-items: center;
    font-family: 'Prompt', sans-serif !important;
    padding: 0px 5px;
    box-shadow: 0 0 1px 0px #070707, inset 0 0 7px 8px #000000;
    border-radius: 25px;
    margin: 5px;
    min-width: 200px;
    max-width: 400px;
    border-width: 2px;
    border-style: outset;
    border-color: #7c00a5;
    background: linear-gradient(90deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
    background-size: 400%;
    color: #ffc107;
    font-size: 25px;
    font-weight: 600;
    text-shadow: 0 0 5px black;
    animation: identifier 8s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite;
}

.group-game {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0.15rem 0 !important;
}

.title-menu {
    font-family: 'Prompt', sans-serif;
    margin-top: -8px;
    user-select: none;
}

::-webkit-scrollbar {
    width: 8px;
}


/* Track */

::-webkit-scrollbar-track {
    background: #575656;
}


/* Handle */

::-webkit-scrollbar-thumb {
    background-image: linear-gradient(0deg, #b37003 1%, #af6504 2%, #6c3d00 10%, #6c3d00 55%, #af6504 94%, #b37003 98%);
    border-radius: 8px;
    box-shadow: 1px 2px 3px 2px black;
}


/* Handle on hover */

::-webkit-scrollbar-thumb:hover {
    background-image: linear-gradient(3deg, #ffb007, #ffb007, #ffb007, #ffb007, #ffb007);
}

audio {
    width: 150px !important;
    height: 25px !important;
}


/* vidio */

video::-webkit-media-controls-panel-container {
    display: none !important;
}

.menu-game {
    border-color: #7c00a6;
    border-style: outset;
    border-radius: 15px;
    border-width: 3px;
    width: 100px;
    background: #2b2b2a;
    margin: 0.1rem;
    cursor: pointer;
}

.box-head-lighting-bar {
    position: absolute;
    display: flex;
    line-height: 1.2;
    align-content: center;
    justify-content: center;
    align-items: center;
    font-family: 'Prompt', sans-serif !important;
    box-shadow: 0 0 0px 1px #000000, 0 0 0px 0px #2f2f2f, inset 0 0 1px 1px #000000, inset 0px 0px 8px 8px #252525;
    border-radius: 25px;
    margin-top: 15px;
    min-width: 200px;
    max-width: 400px;
    border-width: 2px;
    border-style: outset;
    border-color: #ffcc04;
    background: linear-gradient( 90deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
    background-size: 400%;
    animation: identifier 8s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite;
}

.lighting-bar {
    margin-top: 1rem;
    box-shadow: 0 0 1px 2px #373737, inset 0 0 0px 1px #000000;
    border-radius: 25px;
    height: 4px;
    width: 100%;
    background: linear-gradient(90deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);
    background-size: 400%;
    animation: identifier 8s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite;
}

.tt-lighting-red {
    width: 100%;
    text-align: center;
    border-radius: 25px;
    font-family: 'Prompt', sans-serif !important;
    font-size: 25px !important;
    font-weight: 700;
    color: #ff0000;
    background: -webkit-linear-gradient(transparent, #f5690600), -webkit-linear-gradient(top, rgb(255 218 10 / 0%) 0%, #c20c0c 16%, rgb(135 25 25) 25%, rgb(255 0 0) 45%, rgb(98 1 1) 61%, #ab1c1c 100%);
    background: -o-linear-gradient(transparent, transparent);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.tt-lighting-gold {
    width: 100%;
    text-align: center;
    border-radius: 25px;
    font-family: 'Prompt', sans-serif !important;
    font-size: 25px !important;
    font-weight: 700;
    color: #ffc107;
    background: -webkit-linear-gradient(transparent, #f5690600), -webkit-linear-gradient(top, rgb(255 218 10 / 0%) 0%, #ba7219 26%, rgb(255 232 118) 35%, rgb(255 201 92) 45%, rgb(255 228 107) 61%, #ffda15 100%);
    background: -o-linear-gradient(transparent, transparent);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.group-lighting {
    display: flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
}

.card-music {
    border-radius: 8px;
    margin-top: 2rem;
    border-width: 3px 3px 3px 3px;
    border-style: ridge;
    border-color: #ffcc04;
    padding: 0.15rem;
}

.box-music {
    display: flex;
    justify-content: center;
}

.ic_play {
    width: 0;
    height: 0;
    border-left: 13px solid transparent;
    border-right: 13px solid transparent;
    border-bottom: 24px solid #ff0000;
    transform: rotate(90deg);
    margin-left: 25%;
    margin-top: 15%;
}

.ic_pause {
    width: 0;
    height: 0;
    border-left: 13px solid transparent;
    border-right: 13px solid transparent;
    border-bottom: 24px solid #ff0000;
    transform: rotate(90deg);
    margin-left: 25%;
    margin-top: 15%;
}

.c-mm__play {
    display: flex;
    height: var(--size);
    position: absolute;
    bottom: var(--dist);
    right: var(--dist);
    user-select: none;
    width: var(--size);
    margin-left: -0.15rem;
    z-index: calc(var(--z) + var(--slides) + 1);
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

[data-css-icon] {
    --icon-size: 1.5rem;
    --size: 3.75rem;
    --bdrs: 50%;
    --c: currentcolor;
}

[data-css-icon] i::after {
    --cpa: none;
    --h: var(--icon-size);
    --w: var(--icon-size);
    background-color: #ff0000;
    clip-path: var(--cpa);
    content: "";
    display: inline-block;
    height: var(--h);
    margin: 0;
    width: var(--w);
}

[data-css-icon*="play"] i::after {
    --bgcl: var(--c);
    --cpa: polygon(16% 0%, 15% 100%, 100% 50%);
}

[data-css-icon*="pause"] i::after {
    /*   --cpa: polygon(40% 0%, 0% 0%, 0% 100%, 40% 100%, 40% 0%, 60% 0%, 100% 0%, 100% 100%, 60% 100%, 60% 0%); */
    --cpa: polygon(40% 0%, 15% 0%, 15% 100%, 40% 100%, 40% 0%, 20% 0%, 85% 0%, 85% 100%, 60% 100%, 60% 0%);
}

.player .soundarea {
    position: absolute;
    top: 60%;
    display: flex;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: 100%;
    color: #fff;
}

.sound-volume {
    cursor: pointer;
    margin: 2px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: inset 0 0 2px 1px #0f0f0f;
    font-size: 12px;
}

.sound-volume.active {
    background-color: #ff0000;
}

.bg-dark-s {
    background: url(data:image/png;base64,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);
    background-color: rgb(0 0 0);
}

.box-music-cover {
    display: flex;
    flex-direction: column;
    align-content: center;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-overflow: clip;
    padding: 0.5rem;
    text-align: center;
    box-shadow: inset 0 0 3px 1px #a78000;
    border-radius: 8px;
    background: #222121;
    font-family: 'Prompt', sans-serif !important;
    color: #e1e0e6;
    font-weight: 300;
}

.videoWrapper {
    position: relative;
    padding-bottom: 56.25%;
    /* 16:9 */
    height: 0;
}

.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video-box {
    margin-top: 0.5rem;
    background: url(data:image/png;base64,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);
    background-color: rgb(0 0 0);
    border-radius: 8px;
    border: 1px solid #8e0202;
    padding: 0 0.5rem;
    box-shadow: inset 0 0 2px 1px #000000;
}

video {
    border-radius: 5px;
    box-shadow: inset 0 0 2px 1px #fac705;
    padding: 2px;
}

iframe {
    border-radius: 8px !important;
}

iframe {
    /* override other styles to make responsive */
    width: 100% !important;
    height: auto !important;
}

.title-bar {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    font-family: 'Prompt', sans-serif !important;
    padding: 0px 5px;
    box-shadow: 0 0 1px 1px #070707, inset 0 0 4px 1px #000000;
    border-radius: 25px;
    margin: 0.5rem 0;
    border-width: 3px;
    border-style: outset;
    border-color: #ffc107;
    /* background: url(data:image/png;base64,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); */
    background-color: #291c01;
    color: #ededec;
    font-size: 20px;
    font-weight: 700;
    text-shadow: 1px 1px 3px black;
}

.modal {
    font-family: 'Prompt', sans-serif !important;
}

.bg-chaifood {
    background-image: linear-gradient(0deg, #b33e03 1%, #af4e04 2%, #763c05 10%, #763c05 55%, #af4e04 94%, #b33e03 98%);
}
.bg-red777 {
    background-image: linear-gradient(0deg, #03b38a 1%, #04af58 2%, #057623 10%, #04af58 55%, #226009 94%, #03b38a 98%);
}

.bg-footer {
    background-image: linear-gradient(0deg, #e9ecef99 1%, #e9ecef99 2%, #e9ecef99 10%, #e9ecef99 55%, #e9ecef99 94%, #e9ecef99 98%);
    padding: 5px;
    border-radius: 10px;
}

.promo-box {
    width: 100%;
    margin: 0.15rem;
    border: 2px solid #fb2116;
    border-radius: 8px;
}

.promo-box-e {
    width: 100%;
    margin: 0.15rem;
    border: 2px solid #ffc107;
    border-radius: 8px;
}

.promo-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.border-ra5 {
    border: 2px solid #058b34;
    border-radius: 8px;
}

@media only screen and (max-width: 360px) {
    .menu-icon {
        width: 95% !important;
    }
    .player {
        width: 300px !important;
        height: 300px !important;
    }
}

@media only screen and (max-width: 375px) {
    .player {
        width: 320px !important;
        height: 320px !important;
    }
}

@media only screen and (max-width: 540px) {
    iframe {
        height: 220px !important;
    }
    .video {
        height: 220px !important;
    }
}

@media only screen and (max-width: 575px) {
    .nav-flex-center {
        justify-content: space-around;
    }
    .menu-icon {
        width: 98% !important;
    }
    .menu-top-btn {
        padding: 5 20px;
        font-size: 95%;
    }
}

@media only screen and (min-width: 575px) {
    .box-menu {
        width: 150px;
    }
}

@media only screen and (max-width: 449px) {
    iframe {
        height: 220px !important;
    }
    .video {
        height: 220px !important;
    }
}

@media only screen and (min-width: 575px) and (max-width: 767px) {
    iframe {
        height: 325px !important;
    }
    .video {
        height: 325px !important;
    }
    .promo-box {
        width: 48.5%;
    }
    .promo-box-e {
        width: 48.5%;
    }
    .logo-headset {
        max-width: auto;
        height: 500px;
        border-radius: 15px;
        border-color: rgb(141 1 1);
    }
}

@media only screen and (min-width: 767px) {
    iframe {
        height: 325px !important;
    }
    .video {
        height: 325px !important;
    }
    .promo-box {
        width: 49%;
    }
    .promo-box-e {
        width: 32.5%;
    }
    .logo-headset {
        max-width: auto;
        height: 500px;
        border-radius: 15px;
        border-color: rgb(141 1 1);
    }
}