* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scroll-behavior: smooth;
}

body {
    background: #111 !important;
    color: #fff;
    width: 100%;
    height: 100%;
    overflow: auto;
    font-weight: 400;
    font-size: 1rem;
    font-family: sans-serif, Arial, system-ui, Roboto, "Work Sans", "Helvetica Neue", "Segoe UI", BlinkMacSystemFont;
    margin: 0;
    text-align: left;
}

a {
    color: #fff;
    text-decoration: none;
    background-color: transparent;
}

    a:hover {
        color: unset;
    }

img {
    object-fit: contain;
}

ul {
    list-style-type: none;
    padding: 0;
}

li {
    list-style-type: none;
}

p {
    margin: 0;
}

/* Home popup Content */
.modal-dialog.c {
    max-width: 860px;
}

.carousel-control-next.a, .carousel-control-prev.a {
    top: 152px;
    width: 24px;
    height: 27px;
}

.form-group.c {
    margin: 0;
}

.login-form-inner.b {
    padding: 0 0;
    padding-bottom: 0;
    height: 350px;
}

.btn-close.a {
    opacity: 1;
}

.carousel-item.a > a > img {
    position: relative;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 350px;
    padding: 0;
}

.popup-close.a {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    background: #14b17f73;
    margin-left: auto;
    height: 28px;
    width: 28px;
    cursor: pointer;
    transition: background 0.4s ease, box-shadow 0.3s ease;
    z-index: 10;
    border: unset;
}

    .popup-close.a:before {
        background: transparent url(../images2/cancel.png)no-repeat center/contain;
        width: 10px;
        height: 10px;
        margin-top: 10px;
        margin-right: 8px;
    }



/* Home popup Content */

/* index content */
.site-wrap {
    position: relative;
    margin: auto;
    padding-top: 50px;
    /*    padding-bottom: 50px;*/
    width: 100%;
    height: auto;
    z-index: 10;
}

.site-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #111;
    box-shadow: 0 1px 3px #0004;
    height: 50px;
    display: flex;
    z-index: 20;
}

.sheader-nav {
    width: 50px;
    height: 50px;
    cursor: pointer;
    left: 0;
    position: relative;
    top: 0;
    display: flex;
    z-index: 1;
}

.sheader-nav-bar {
    padding: 10px 15px;
    /*margin: auto;
    width: 18px;
    height: 2px;
    background: #259572;*/
    font-size: 20px;
    color: #259572;
    font-weight: 900;
}
/*
    .sheader-nav-bar:before {
        margin-top: -6px;
        width: 21px;
        content: '';
        position: absolute;
        height: 2px;
        background: #259572;
        border-radius: 10px;
    }

    .sheader-nav-bar:after {
        margin-top: 6px;
        width: 15px;
        content: '';
        position: absolute;
        height: 2px;
        background: #259572;
        border-radius: 10px;
    }*/

.sheader-logo {
    display: flex;
    margin: auto;
}

    .sheader-logo img {
        width: 100%;
        height: 32px;
    }

.carousel-item img {
    object-fit: cover;
    height: 130px;
}

.carousel-indicators [data-bs-target] {
    width: 18px;
    height: 2px;
}

.carousel-indicators {
    top: 129px;
}

.carousel-inner.fav-cont {
    width: auto;
    border-radius: 5px;
}

    .carousel-inner.fav-cont .carousel-item {
        border-radius: 5px;
    }

.carousel-item.favourite img {
    object-fit: cover;
    height: auto;
    padding: 0px;
}

.favtwo-cont {
    margin: 10px;
    width: auto;
}

    .favtwo-cont ul {
        display: flex;
    }

        .favtwo-cont ul li {
            display: flex;
            margin-right: 8px !important;
        }

            .favtwo-cont ul li img {
                border-radius: 5px;
            }

    .favtwo-cont .lSPager {
        display: none !important;
    }

    .favtwo-cont .lSAction > a {
        top: 40% !important;
    }

.side-nav {
    position: relative;
    transition: transform 0.35s ease-out;
    background: #111;
    height: 100%;
    width: 200px;
    max-width: 400px;
    box-shadow: 0 5px 6px 4px rgba(0, 0, 0, 0.2);
    transform: translateX(-102%);
    will-change: transform;
    display: flex;
    flex-direction: column;
}

.side-nav-container {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
}

    .side-nav-container:before {
        transition: opacity 0.3s cubic-bezier(0, 0, 0.3, 1);
        content: "";
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: rgba(0, 0, 0, 0.4);
        will-change: opacity;
        opacity: 0;
        pointer-events: none;
    }

.side-nav-animatable .side-nav {
    transition: transform 0.33s cubic-bexier(0, 0, 0.3, 0.1);
}

.side-nav-animatable.side-nav-visible .side-nav {
    transition: transform 0.33s cubic-bezier(0, 0, 0.3, 1);
}

.side-nav-visible {
    pointer-events: auto;
}

    .side-nav-visible .side-nav {
        transform: none;
    }

    .side-nav-visible:before {
        opacity: 1;
    }

.leftnav-menu {
    overflow-x: auto;
    z-index: 55;
    position: relative;
    background: #252525;
}

.leftnav-group {
    background: #252525;
    border-top: 1px solid #222;
    border-bottom: 1px solid #505050;
}

    .leftnav-group ul {
        display: grid;
        padding: 0;
        list-style-type: none;
        margin: 0;
    }

        .leftnav-group ul:after {
            content: "";
            display: block;
            width: 100%;
            height: 10px;
            margin-top: 0px;
            background: #111111;
        }

        .leftnav-group ul li a {
            position: relative;
            display: flex;
            width: 100%;
            min-height: 48px;
            padding: 5px 10px;
            cursor: pointer;
            border-bottom: 1px solid #494646;
        }

            .leftnav-group ul li a img {
                width: 30px;
                height: 30px;
                margin: auto 0;
                margin-right: 10px;
            }

            .leftnav-group ul li a p {
                display: grid;
                font-size: 12px;
                margin: auto 0;
            }

    .leftnav-group:last-child {
        padding-bottom: 30px;
        margin-bottom: 0;
        border-bottom: unset;
    }

.leftnav-affiliate {
    padding: 5px 0 !important;
}

.leftnav-language {
    display: flex;
    flex-wrap: wrap;
    padding: 0 5px;
}

    .leftnav-language a.active {
        border-color: #158743;
    }

    .leftnav-language a {
        display: grid;
        width: calc(50% - 10px);
        border: 1px solid #555;
        border-radius: 5px;
        padding: 5px;
        max-width: 120px;
        margin: 5px;
    }

        .leftnav-language a.active img {
            opacity: 1;
        }

        .leftnav-language a img {
            width: 28px;
            height: 28px;
            border-radius: 50%;
            margin: auto;
        }

        .leftnav-language a.active span {
            color: #199f4f;
        }

        .leftnav-language a span {
            color: #888;
            margin: auto;
            margin-top: 10px;
            font-size: 11px;
            line-height: 100%;
            transition: color 0.4s;
            text-align: center;
        }

.nav-icon i {
    font-size: 14px;
    border-radius: 50%;
    padding: 12px;
    display: flex;
    height: 30px;
    width: 30px;
    margin: 3px -1px;
    background: #434343;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin-right: 10px;
}

.nav-icon-green i {
    font-size: 14px;
    border-radius: 50%;
    padding: 12px;
    display: flex;
    height: 30px;
    width: 30px;
    margin: 3px -1px;
    background: #434343;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin-right: 10px;
}

.nav-icon::after {
    content: '';
    position: absolute;
    width: 4%;
    height: 17%;
    border-radius: 50%;
    background-color: #ff0033a6;
    margin-top: 20px;
    margin-left: 14px;
}

.nav-icon-green::after {
    content: '';
    position: absolute;
    width: 4%;
    height: 12%;
    border-radius: 50%;
    background-color: #008000e0;
    margin-top: -15px;
    margin-left: 16px;
}

.site-nav-marquee {
    position: relative;
    display: flex;
    width: 100%;
    box-shadow: 0 0 1px #0007;
    background: #111;
    border-bottom: 1px solid #000;
    margin-top: 17px;
}

.smarquee-center {
    display: flex;
    width: 100%;
}

.site-nav-marquee .icon2-announcement {
    font-weight: 900;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto 8px;
    margin-right: 12px;
    color: #14805e;
    width: 30px;
    height: 30px;
}

.smarquee-main {
    position: relative;
    display: flex;
    width: 100%;
    z-index: 1;
    margin-right: 5px;
}

.site-nav-marquee marquee {
    font-size: 12px;
    white-space: nowrap;
    margin: auto;
    padding-left: 40px;
    width: -webkit-fill-available;
}

    .site-nav-marquee marquee span {
        color: #eee;
    }

.site-gamemenu {
    width: 100%;
    overflow: auto;
}

    .site-gamemenu ul {
        display: flex;
        flex-wrap: nowrap;
        width: 100%;
        overflow: auto;
        overflow-y: hidden;
        padding: 0;
        border: none;
    }

    .site-gamemenu .nav-link {
        display: block;
        padding: 10px 3px;
    }

        .site-gamemenu .nav-link.active {
            background: #1f2721;
            border-bottom: 1px solid #3a403caa;
            border-top: 1px solid #259572;
            color: #fff;
            border-color: #259572 #121212 #080808;
        }

    .site-gamemenu .nav-link {
        color: #fff;
    }

    .site-gamemenu ul li {
        position: relative;
        display: grid;
        min-width: 70px;
        border-top: 1px solid #000;
        transition: background 0.6s ease;
    }

    .site-gamemenu a.active:before {
        content: '';
        position: absolute;
        background: #111;
        left: calc(50% - 7px);
        bottom: -2px;
        width: 14px;
        height: 10px;
        border-radius: 50%;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .site-gamemenu ul li img {
        height: auto;
        width: auto;
        margin: 6px -3px;
    }

    .site-gamemenu ul li p {
        font-size: 12px;
        text-shadow: 0 0 2px #fff;
        margin: auto;
        width: 100%;
        margin-top: 7px;
        margin-bottom: 5px;
        display: flex;
        text-align: center;
        justify-content: center;
    }

.main-icon i {
    font-size: 18px;
    border-radius: 50%;
    padding: 11px;
    display: flex;
    height: 42px;
    width: 43px;
    margin: 0 auto;
    background: #434343;
    align-items: center;
    text-align: center;
    justify-content: center;
}

    .main-icon i:after {
        content: '';
        position: absolute;
        top: 25px;
        bottom: 60%;
        right: 40%;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #ff0033a6;
    }



.gamelist-group.active {
    display: grid;
}

.gamelist-group {
    padding: 15px 10px;
}

    .gamelist-group h5 {
        font-size: 14px;
        font-weight: bold;
        padding-left: 8px;
        line-height: 15px;
        border-left: 3px solid #14805e;
        margin-bottom: 12px;
    }

.gamelist-content {
    display: grid;
    animation: fadeIn 0.5s;
    grid-template-columns: repeat(4,1fr);
    grid-auto-flow: dense;
}

    .gamelist-content button {
        border: none;
    }

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.gamelist-item {
    display: grid;
    background: #333;
    width: auto;
    padding: 8px 5px;
    border-radius: 2px;
    margin: 1px;
    min-height: 80px;
    animation: scaleUp 0.4s;
}


@keyframes scaleUp {
    0% {
        transform: scale(0.3);
        border-radius: 50%;
        filter: blur(3px);
    }

    100% {
        transform: scale(1);
        border-radius: 2px;
        filter: blur(0px);
    }
}

.gamelist-item img {
    width: 40px;
    height: 40px;
    margin: auto;
    margin-bottom: 0;
}

.gamelist-item span {
    font-size: 11px;
    color: #eee;
    margin: auto;
    margin-top: 5px;
    display: flex;
    text-align: center;
    justify-content: center;
}

.cslist-group {
    display: grid;
    padding: 15px 10px;
}

.cslist-group2 {
    display: block;
    padding: 10px 8px;
}

    .cslist-group2 .cslist-title {
        margin-bottom: 1px;
    }

.cslist-title {
    font-size: 14px;
    font-weight: bold;
    padding-left: 8px;
    line-height: 15px;
    border-left: 3px solid #14805e;
    margin-bottom: 12px;
}

.cslist-content {
    display: flex;
    position: relative;
    animation: fadeIn 0.5s;
    border-radius: 5px;
    overflow: auto;
}

.cslist-favourite:not(:last-child) {
    margin-right: 10px;
}

.cslist-favourite {
    position: relative;
    width: max-content;
    box-shadow: 0 0 5px #000c;
    border-radius: 5px;
}

    .cslist-favourite img {
        width: 100%;
        height: 100%;
        border-radius: 5px;
        box-shadow: inset 0 0 15px #ffffffb3;
        border: 1px solid #fff5;
    }

    .cslist-favourite:not(:last-child), .cslist-feature:not(:last-child) {
        margin-right: 10px;
    }

.cslist-feature {
    position: relative;
    width: max-content;
    box-shadow: 0 0 5px #000c;
    border-radius: 5px;
}

    .cslist-feature img {
        height: 132px;
        width: max-content;
        border-radius: 5px;
        box-shadow: inset 0 0 15px #ffffffb3;
        border: 1px solid #fff5;
    }

.slick-slider {
    margin: 0;
}

.mfooter-center {
    display: flex;
}

.mfooter-lang {
    display: flex;
    background: #d7e3f0;
    padding: 0 6px;
    border-right: 1px solid #aabacb;
    width: auto;
}

    .mfooter-lang img {
        width: 25px;
        height: 25px;
        border-radius: 50%;
        margin: auto 5px;
    }

    .mfooter-lang span {
        font-size: 13px;
        font-weight: bold;
        color: #222;
        margin: auto;
        padding: 0 5px;
        white-space: nowrap;
    }

.mfooter-signup {
    color: #000;
    background: #ffdf1a;
    width: 100%;
    height: 55px;
    line-height: 50px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

.mfooter-login {
    color: #fff;
    background: #14805e;
    width: 100%;
    height: 55px;
    line-height: 50px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

.bot-icon i {
    font-size: 17px;
    border-radius: 50%;
    padding: 12px;
    display: flex;
    height: 30px;
    width: 30px;
    background: #434343;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin: auto;
}

    .bot-icon i::after {
        content: '';
        position: absolute;
        width: 8%;
        height: 17%;
        border-radius: 50%;
        background-color: #ff0033a6;
        margin-top: 10px;
        margin-left: 8px;
    }

.site-footer {
    display: flex;
    background: #040404;
    padding: 10px;
    padding-bottom: 80px;
}

.sfooter-center {
    margin: auto;
}

.footer-partner-wrap {
    display: flex;
    padding-top: 5px;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

    .footer-partner-wrap li {
        position: relative;
        width: 100%;
    }

        .footer-partner-wrap li h5 {
            display: block;
            width: 100%;
            font-size: 12px;
            padding-bottom: 4px;
            color: #14805e;
            font-weight: 600;
        }

        .footer-partner-wrap li.payment img, .footer-partner-wrap li.payment > a, .footer-partner-wrap li.payment > a > i {
            filter: grayscale(1) brightness(0.7);
        }

        .footer-partner-wrap li.payment a > i {
            font-size: 25px !important;
        }

        .footer-partner-wrap li a > i {
            filter: grayscale(1) brightness(0.7);
        }

        .footer-partner-wrap li > a img {
            height: 25px;
            max-width: 45px;
            margin-bottom: 10px;
        }

        .footer-partner-wrap li > a.light {
            filter: grayscale(1) brightness(1.8);
        }

    .footer-partner-wrap:last-child {
        border-bottom: 1px solid #333;
    }

.social-media:first-child {
    width: calc(100%);
}

.social-media.download img {
    height: 30px;
    max-width: 95px;
}

.sfooter-link {
    display: flex;
    padding-top: 20px;
}

.sfooter-logo {
    padding-right: 10px;
    margin: auto 0;
}

    .sfooter-logo img {
        height: 30px;
        width: 107px;
    }

.sfooter-group {
    margin-left: auto;
    display: grid;
    text-align: right;
    left: 0;
    position: relative;
}

    .sfooter-group h5 {
        font-size: 13px;
        color: #14805e;
        margin-bottom: 3px;
        font-weight: 600;
    }

    .sfooter-group p {
        font-size: 11px;
        line-height: 20px;
        color: rgba(255,255,255,.5);
        text-align: right;
        margin: 0;
    }

.footer-license {
    padding: 7px 0;
    border-bottom: 1px solid #333333;
}

    .footer-license .license-title {
        color: #ffffff80;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.5;
    }

    .footer-license p {
        color: #ffffff80;
        font-size: 11px;
        line-height: 1.2;
    }

/*.session-form-box {
    position: relative;
    width: 100%;
    max-width: 400px;
    margin: auto;
    background: #fff;
    border-radius: 2px;
    overflow: hidden;
    transition: all 0.5s ease;
    border: unset;
}*/

.session-form-box {
    position: relative;
    width: 100%;
    max-width: 400px;
    margin: auto;
    border: unset;
}

.session-form-top {
    display: flex;
    height: 60px;
    background: #14805e;
}

    .session-form-top h5 {
        font-size: 18px;
        margin: auto 15px;
    }

.popup-close {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    background: #14b17f36;
    margin-left: auto;
    height: 60px;
    width: 55px;
    cursor: pointer;
    transition: background 0.4s ease, box-shadow 0.3s ease;
    z-index: 10;
    border: unset;
}

    .popup-close:before {
        content: "";
        transition: .3s;
        margin: auto;
    }

.session-loader2.popup-close {
    position: fixed;
    border-bottom-left-radius: 40px;
    height: 45px;
    width: 55px;
    background: #000;
    opacity: 1;
}

.popup-close:before {
    background: transparent url(../images2/cancel.png)no-repeat center/contain;
    width: 15px;
    height: 15px;
    margin-top: 21px;
    margin-right: 19px;
}

.session-loader2.popup-close:before {
    background: transparent url(../images2/cancel.png)no-repeat center/contain;
    width: 18px;
    height: 18px;
    margin-top: 12px !important;
    margin-right: 13px !important;
}

.langchg-main {
    display: grid;
    background: #333;
    padding: 20px 10px;
    height: 100%;
    width: 100%;
}

.langchg-row {
    display: flex;
    padding: 5px 10px;
    min-height: 60px;
}

.langchg-rightnav {
    display: flex;
    width: 100%;
}

    .langchg-rightnav a.active, .langchg-rightnav a:hover {
        color: #ffdf1a;
        border-color: #c9ae10;
    }

    .langchg-rightnav a {
        padding: 0 10px;
        font-size: 13px;
        display: inline-block;
        height: 40px;
        line-height: 40px;
        color: #fff;
        border: 1px solid #ccc;
        margin: auto;
        width: 100%;
        text-align: center;
        transition: all 0.3s ease;
        margin: auto 3px;
    }

.leftnav-menu .service {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 179px;
    height: auto;
    margin: 10px auto;
    padding: 10px;
    overflow-x: hidden;
    overflow-y: auto;
    border: 1px solid #464646;
    border-radius: 3px;
    background-color: #333;
    position: relative;
}

    .leftnav-menu .service .item-icon img {
        display: block;
        width: 30px;
        height: 32px;
        margin-right: 10px;
        border-radius: 3px;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
    }

    .leftnav-menu .service p {
        width: 75%;
        color: #fff;
        font-size: 12px;
        line-height: 1px;
    }

        .leftnav-menu .service p span {
            display: block;
            padding-top: 18px;
            color: #d9d9d9;
            font-size: 9px;
        }

.float-banner {
    position: fixed;
    left: 7px;
    bottom: 55px;
    z-index: 7999;
    filter: drop-shadow(0 0 0.375rem rgba(3,25,73,.7));
    opacity: 1;
}

    .float-banner .btn-close-star {
        position: absolute;
        z-index: 2;
        top: 0;
        right: -0.3125rem;
        width: 1.5625rem;
        height: 1.5625rem;
        border-radius: 100%;
        background-color: #000000;
        opacity: 1;
        cursor: pointer;
    }

        .float-banner .btn-close-star::before {
            transform: rotate(45deg);
        }

        .float-banner .btn-close-star::after {
            transform: rotate(-45deg);
        }

        .float-banner .btn-close-star::after, .float-banner .btn-close-star::before {
            content: "";
            display: block;
            position: absolute;
            top: 0.6875rem;
            left: 0.3125rem;
            width: 0.9375rem;
            height: 0.125rem;
            border-radius: 0.125rem;
            background-color: #fff;
        }

    .float-banner a {
        display: inline-flex;
        width: 7.0625rem;
        height: 7.0625rem;
        opacity: 1;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        cursor: pointer;
    }

.pop-language .pop-inner {
    padding: 15px;
    background: #3e3e3e;
    text-align: left;
}

.language-list {
    display: block;
    margin: 0 auto;
}

    .language-list li {
        display: flex;
        flex-flow: row nowrap;
        align-items: center;
        margin-bottom: 3px;
        padding: 11px;
        border-bottom: 1px solid #eeeeee;
    }

    .language-list .left-language-area {
        width: 40%;
        display: flex;
        text-align: left;
        align-items: center;
    }

        .language-list .left-language-area img {
            display: inline-block;
            width: 35px;
            height: 35px;
            margin-right: 10px;
            border-radius: 100%;
            box-shadow: 0 0 2px #0006;
            vertical-align: middle;
            max-width: 100%;
            margin: 0 auto;
        }

        .language-list .left-language-area p {
            display: inline-block;
            color: #eee;
            font-size: 12px;
            line-height: 1.5;
            vertical-align: middle;
            margin-right: 30px;
            margin-left: 5px;
        }

        .language-list .left-language-area p, .language-list .right-language-area p {
            padding-bottom: 0;
        }

    .language-list .right-language-area {
        display: flex;
        width: 70%;
        text-align: center;
    }

.radio-box {
    display: inline-block;
    margin: 0 0 1.3333333333vw 2%;
    vertical-align: top;
    width: 100%;
}

    .radio-box [type=radio] {
        display: none;
    }

    .radio-box span {
        padding: 3px 10px;
        display: inline-block;
        width: 100%;
        font-size: 11px;
        transition: border-color 0.2s ease, color 0.3s ease, box-shadow 0.2s ease;
        border: 1px solid #eeeeee;
        text-align: center;
        line-height: 2.2;
    }

    .radio-box input:checked ~ span {
        border: 1px solid #FFDF1A;
        color: #ffdf1a;
    }

    .radio-box [type=radio] + label {
        display: block;
        padding: 0 1.3333333333vw;
        transition: .3s;
        border: 1px solid #eeeeee;
        color: #fff;
        line-height: 2.5;
        text-align: center;
    }

.sheader-menu {
    right: 0;
    position: relative;
    top: 0;
    height: 100%;
    display: flex;
    z-index: 0;
}

    .sheader-menu a {
        display: grid;
        min-width: 45px;
        padding: 5px;
        padding-bottom: 0;
    }

    .sheader-menu .right-logo {
        width: 18px;
        height: 18px;
        margin: auto;
        margin-bottom: 0;
        color: #14805e;
    }

    .sheader-menu a span {
        font-size: 12px;
        color: #259572;
        margin: auto;
        margin-top: 0;
        line-height: 150%;
    }

.btn:hover {
    color: unset;
}
/* index content */

/* Off Canvas Content */

.common-offcanvas {
    background: #111;
    overflow: auto;
    padding: 0;
}


.common-offcanvas-a {
    color: #fff;
    font-size: 14px;
    margin: 0 auto;
    border: 1px solid 1px solid rgba(0, 0, 0, 0.2);
    padding: 0px;
    display: flex;
    border-radius: 12px 12px 0 0;
    background: #333333;
}

/* Off Canvas Content Closed */

/* login content */

.slideout .site-wrap {
    animation: righttoleft 0.4s;
}

.slidein .site-wrap {
    left: -120%;
    animation: lefttoright 0.3s;
}

@keyframes righttoleft {
    0% {
        left: -100%;
        position: fixed;
    }

    100% {
        left: 0;
        position: fixed;
    }
}

@keyframes lefttoright {
    0% {
        left: 0;
        position: fixed;
    }

    100% {
        left: -120%;
        position: fixed;
    }
}

.slideout.slide2 .site-wrap {
    animation: righttoleft2 0.4s;
}

.slidein.slide2 .site-wrap {
    left: unset;
    right: -120%;
    animation: lefttoright2 0.3s;
}

@keyframes righttoleft2 {
    0% {
        right: -100%;
        position: fixed;
    }

    100% {
        right: 0;
        position: fixed;
    }
}

@keyframes lefttoright2 {
    0% {
        right: 0;
        position: fixed;
    }

    100% {
        right: -120%;
        position: fixed;
    }
}

.site-header3 {
    position: fixed;
    display: flex;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background: #333;
    border-bottom: 1px solid #666;
    z-index: 20;
}

.sheader-back {
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    width: 60px;
    height: 50px;
    padding-right: 10px;
    transition: color 0.3s ease;
    color: #999;
    z-index: 1;
}

.dheader-back.add-bank {
    display: flex;
    top: 0;
    right: 0;
    width: auto;
    height: 50px;
    padding-right: 10px;
    transition: color 0.3s ease;
    color: #999;
    z-index: 1;
    position: absolute;
}

    .dheader-back.add-bank i {
        color: white;
        display: flex;
        align-items: center;
        font-size: 23px;
        color: #e1e1e1;
    }

.sheader-back:before {
    content: "\f104";
    font: var(--fa-font-solid);
    font-size: 25px;
    font-weight: 900;
    color: #e1e1e1;
    margin: auto;
    line-height: 100%;
}

.sheader3-center {
    margin: auto;
}

.add-bank-t {
    margin-left: 5px;
}

.sheader3-center h4 {
    font-size: 16px;
    margin: auto;
    padding: 0 10px;
}

.site-section {
    width: 100%;
    padding: 0;
    margin: 0 auto;
}

.login-main-icon {
    display: flex;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 20px;
}

    .login-main-icon img {
        width: 100%;
        height: 50px;
        margin: auto;
    }

.signup-form {
    margin-top: 10px;
}

.signup-center {
    display: flex;
    width: 100%;
    padding: 0 15px;
    max-width: 600px;
    margin: auto;
}

.signup-group {
    width: 100%;
}

.signup-form-box {
    position: relative;
    background: #333;
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 12px;
}

.signup-group .form-group:not(:last-child) {
    border-bottom: 1px solid #505050;
}

.signup-group .form-group {
    display: flex;
    padding: 0 10px;
    margin: 0;
    min-height: 50px;
}

    .signup-group .form-group label {
        font-size: 13px;
        display: block;
        width: 200px;
        color: #fff;
        padding: 5px;
        margin: auto 0;
        font-weight: 600;
    }

    .signup-group .form-group input {
        font-size: 14px;
        line-height: 20px;
        width: 100%;
        min-height: 40px;
        padding: 0 10px;
        border: none;
        background: #333333;
        transition: border-color 0.3s ease;
        outline: none;
        color: #14805e;
        margin: auto 0;
    }

    /*.signup-group .form-group.a input {
        width: 57%;
        margin-left: 65px;
    }*/

    /*.signup-group .form-group .input-group {
        display: inline-block;
    }*/

.login-forgetpass {
    transition: all 0.3s ease;
    position: relative;
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
    justify-content: flex-end;
}

    .login-forgetpass a {
        display: block;
        font-size: 13px;
        padding: 1px 5px;
        color: #14805e;
        border: 1px solid #14805e;
        border-radius: 3px;
        transition: all 0.3s ease;
    }

.btn-register-next {
    float: right;
    width: 100%;
    height: 42px;
    line-height: 42px;
    font-size: 15px;
    text-shadow: 0 0 1px #fff5;
    color: #fff;
    border-radius: 3px;
    padding: 0 15px;
    border: none;
    outline: none !important;
    cursor: pointer;
    margin-top: 10px;
    background: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    background-position: 50%0;
    background-size: 200%;
    transition: box-shadow .5s ease-out .1s,background-position .3s ease-in,text-shadow .3s ease-in .1s;
    text-align: center;
}

.login-account-create {
    width: 100%;
    font-size: 12px;
    margin: auto;
    text-align: center;
    position: relative;
    top: 10px;
    display: inline-block;
}

    .login-account-create > a {
        text-decoration: underline;
        color: #ffa500;
        margin-left: 4px;
    }

.login-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    padding: 0 15px;
}

.login-grid2 {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    padding: 0 15px;
}


.inner-main-1 {
    text-align: center;
    justify-content: center;
    grid-gap: 20px;
    margin: 20px auto 0 auto;
    border: unset;
}

.nav-item-1 a.active {
    background-color: #14805e !important;
    color: #ffffff !important;
    border-radius: 5px;
    letter-spacing: 1px;
    transition: all 0.5s ease;
    border-color: #00af41 #00cf4b #0cd557 !important;
    box-shadow: 0 0 8px #0aa577;
    height: 100%;
}

.nav-item-1 {
    background: #0b956a;
    color: white !important;
    font-size: 13px;
    border-radius: 5px;
    letter-spacing: 1px;
    transition: 0.3s;
    width: 100%;
    font-weight: 500;
    margin-bottom: 5px;
}

    .nav-item-1 a {
        color: #ffffff !important;
        display: flex;
        justify-content: center;
        /* text-align: center; */
        align-items: center;
        height: 100%;
    }

        .nav-item-1 a i {
            margin-right: 3px;
        }

.phone-area-code {
    /*position: absolute;*/
    z-index: 1;
    /*top: 5px;
    left: 140px;
    width: 18%;
    margin-right: 10px;*/
}

.btn-select {
    background-color: #292929;
    color: #1ec28f;
    position: relative;
    width: 100%;
    height: 41px;
    padding: 0 10px;
    border: 0;
    border-radius: 3px;
    background: #292929;
    font-size: 12px;
    font-weight: 300;
}
/* login content */

/* register content */

.signup-group .alert-notes {
    position: relative;
    color: #e75d5d;
    background: #0004;
    border-bottom: 1px solid #505050;
    width: 100%;
    padding: 0 10px;
    font-size: 12px;
    line-height: 1.3;
    text-align: left;
    padding: 8px 5px;
    padding-left: 15px;
    margin: 0;
    overflow: hidden;
}

    .signup-group .alert-notes::before {
        content: "!";
        display: inline-block;
        width: 0.875rem;
        height: 0.875rem;
        margin-right: 0.3125rem;
        border-radius: 50%;
        background-color: #f35e5e;
        color: #fff;
        font-size: .75rem;
        font-weight: 700;
        line-height: .875rem;
        text-align: center;
        vertical-align: middle;
    }

.inner-main-2 {
    text-align: center;
    justify-content: center;
    grid-gap: 10px;
    margin: 20px auto 0 auto;
    border: unset;
}

.nav-item-2 {
    background: #0b956a;
    color: white !important;
    font-size: 12px;
    border-radius: 5px;
    letter-spacing: 1px;
    transition: 0.3s;
    width: 100%;
    font-weight: 500;
    margin-bottom: 5px;
}

    .nav-item-2 .nav-link {
        padding: 0.5rem 10px !important;
        display: flex;
        justify-content: center;
        /* text-align: center; */
        align-items: center;
        height: 100%;
    }

        .nav-item-2 .nav-link i {
            margin-right: 3px;
        }

    .nav-item-2 a.active {
        background-color: #14805e !important;
        color: #ffffff !important;
        border-radius: 5px;
        letter-spacing: 1px;
        transition: all 0.5s ease;
        border-color: #00af41 #00cf4b #0cd557 !important;
        box-shadow: 0 0 8px #0aa577;
    }

    .nav-item-2 a {
        color: #ffffff !important;
    }

/* register content */

/* forgot password content */

/* forgot password content */

/* live content */

.scontent-search-bar {
    position: relative;
    width: 100%;
    display: flex;
    background: #fff;
}

.scontent-search-center {
    display: flex;
    width: 100%;
    height: 50px;
    margin: auto;
}

.scontent-search {
    display: flex;
    width: 100%;
}

    .scontent-search i {
        color: #444;
        font-size: 16px;
        margin: auto 5px;
    }

    .scontent-search input {
        font-size: 13px;
        line-height: 20px;
        width: 150px;
        display: inline-block;
        padding: 0.4375rem 0.625rem;
        border: 1px solid #ddd;
        transition: background .3s ease-in-out .1s,box-shadow .5s ease-in-out,border .3s ease-in-out .1s;
        border-radius: 5px;
        outline: 0;
        background: #f2f2f2;
        box-shadow: 0 0.125rem 0.3125rem #e6e6e6 inset;
        color: #14805e;
        letter-spacing: 1px;
        vertical-align: middle;
        margin: auto 5px;
    }

.scontent-sort {
    width: 100%;
    margin-left: auto;
    background: #222;
}

    .scontent-sort ul {
        display: flex;
    }

        .scontent-sort ul li {
            height: 50px;
            line-height: 50px;
            color: #fff;
            font-size: 13px;
            letter-spacing: -0.2px;
            width: 100%;
            text-align: center;
        }

            .scontent-sort ul li a.active {
                color: #1fd59c !important;
            }

                .scontent-sort ul li a.active:before {
                    content: '';
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    width: 100%;
                    height: 2px;
                    background: #1fd59c;
                    animation: fadeIn 0.5s;
                }

        .scontent-sort ul li {
            height: 50px;
            line-height: 50px;
            color: #fff;
            font-size: 13px;
            letter-spacing: -0.2px;
            width: 100%;
            text-align: center;
        }

            .scontent-sort ul li a {
                position: relative;
                display: block;
                padding: 0 10px;
                cursor: pointer;
            }

.scontent-filter {
    background: linear-gradient(0deg,#14805e,#116a4e 100%);
}

.scontent-filter-center {
    display: flex;
    width: 100%;
    margin: auto;
}

.scontent-filter-group {
    display: none;
}

.scontent-filter-title {
    display: none;
    background: #3e7865;
    font-size: 13px;
    padding: 0 15px;
    color: #ffdf18;
    line-height: 30px;
}

.scontent-filter-bar {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    transition: all 0.4s ease;
    margin: auto;
}

.ck_filter {
    position: relative;
    display: inline-flex;
    cursor: pointer;
    margin: 0;
    height: 44px;
    width: 120px;
    transition: background 0.4s ease;
    overflow: hidden;
    padding: 0 5px;
}

    .ck_filter input {
        height: 30px;
        display: none;
    }

    .ck_filter .checkmark {
        position: relative;
        display: flex;
        height: 15px;
        min-width: 15px;
        width: 15px;
        background: #ffffff;
        border: 1px solid #aaa;
        box-shadow: 0 1px 2px 0 rgba(0,0,0,.05), 0 2px 3px 0 rgba(0,0,0,.05), 0 3px 4px 0 rgba(0,0,0,.05);
        transition: border-color 0.3s ease, background 0.6s ease;
        border-radius: 4px;
        margin: auto 5px;
        overflow: hidden;
    }

    .ck_filter span {
        color: #eee;
        font-size: 12px;
        padding-top: 2px;
    }

    .ck_filter img {
        position: absolute;
        width: 90px;
        height: 44px;
        opacity: 0;
        transition: all 0.5s ease;
        transform: translateX(150px);
        right: 0;
        top: 0;
    }

    .ck_filter span:last-child {
        transition: all 0.4s ease;
    }

    .ck_filter span {
        color: #eee;
        margin: auto;
        font-size: 12px;
        margin-left: 0;
        padding-top: 2px;
    }

    .ck_filter input:checked ~ .checkmark {
        background: #ffe332;
        border-color: #ffcd16;
    }

    .ck_filter input:checked ~ span {
        color: #feda00;
    }

.sfilter-more {
    width: 100%;
    padding: 0 35px;
    line-height: 40px;
    height: 40px;
    transition: background-position .3s ease-in,text-shadow .3s ease-in-out .1s;
    background-image: linear-gradient(180deg,#17966e 0,#06281d 100%);
    background-position: 0 0;
    background-size: 100% 200%;
    border-top: 1px solid #127a5a;
    text-align: center;
    font-size: 14px;
    color: #ffdf18;
    cursor: pointer;
    margin-left: auto;
}

/*.sfilter-more:before {
        content: 'More Filter';
    }*/

.scontent-filter.active .scontent-filter-center {
    display: grid;
}

.scontent-filter.active .scontent-filter-group {
    display: grid;
}

.scontent-filter.active .scontent-filter-title {
    display: flex;
}

.scontent-filter-title:after {
    content: "\f0dd";
    font: var(--fa-font-solid);
    font-size: 25px;
    font-weight: 900;
    font-size: 12px;
    color: #fff;
    line-height: 100%;
    margin-left: auto;
    margin-top: 5px;
}

.scontent-filter.active .scontent-filter-bar {
    background: #0e5a42;
}

.ck_filter .checkmark:before {
    content: "✓";
    color: #fff;
    font-size: 10px;
    line-height: 12px;
    text-shadow: 0 1px 1px #ed9c06;
    margin: auto;
    margin-top: -1px;
    transform: translateY(20px);
    transition: all 0.4s ease;
    opacity: 0;
}

.ck_filter input:checked ~ .checkmark:before {
    transform: translateY(0);
    opacity: 1;
}

.ck_filter.animated:hover img {
    opacity: 1;
    transform: translateX(0);
}

.ck_filter.animated:hover span:last-child {
    transform: translateY(-50px);
}

.ck_filter:hover {
    background: #feda00;
}

.site-games {
    display: grid;
}

.sgames-content {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 20px 3px;
    margin: auto;
    justify-content: center;
}

.sgames-item {
    position: relative;
    min-width: 170px;
    max-width: 170px;
    width: 100%;
    height: 150px;
    /* max-height: 186px; */
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid transparent;
    box-shadow: 0 2px 2px 0 rgba(45,45,45,.1), 0 4px 4px 0 rgba(49,49,49,.1), 0 8px 8px 0 rgba(42,42,42,.1), 0 16px 16px 0 rgba(32,32,32,.1);
    transition: all 0.4s ease;
    margin: 5px 6px;
    padding: 0;
}

    .sgames-item img {
        width: 100%;
        height: 100%;
        object-fit: fill;
        background: linear-gradient(0deg,#052c1c -10%,transparent 55%);
        box-shadow: inset 0 0 1px 1px rgba(27,172,126,.4), inset 0 0 10px 0 rgba(255,255,255,.2);
    }

    .sgames-item h5 {
        position: absolute;
        text-shadow: 0 0 4px #000;
        bottom: 0;
        font-size: 14px;
        padding: 0 10px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        z-index: 1;
        width: 100%;
    }

    .sgames-item:hover,
    .sgames-item:active {
        border-color: #006847;
    }

        .sgames-item:hover .sgames-hidden,
        .sgames-item:active .sgames-hidden {
            opacity: 1;
        }

.sgames-hidden {
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000a;
    box-shadow: inset 0 0 1px 1px rgba(27,172,126,.4), inset 0 0 10px 0 rgba(255,255,255,.2);
    opacity: 0;
    transition: all 0.5s ease;
    z-index: 2;
}

    .sgames-hidden a, .sgames-hidden button {
        margin: auto;
        width: unset;
        min-width: 120px;
        min-height: 35px;
        transition: transform 0.3s ease-in-out;
        transform: translateY(100px);
    }

.sgames-item:hover .sgames-hidden a,
.sgames-item:active .sgames-hidden a,
.sgames-item:hover .sgames-hidden button,
.sgames-item:active .sgames-hidden button {
    transform: translateY(0);
}

.btn-css2 {
    display: flex;
    font-size: 13px;
    height: 30px;
    font-weight: 700;
    align-items: center;
    text-align: center;
    justify-content: center;
    border: none;
    outline: none !important;
    padding: 0 15px;
    cursor: pointer;
    color: #fff;
    border-radius: 3px;
    background: linear-gradient(to top,#0f664b,#1b8966 45%, #27ad83 100%);
    background-position: 50%0;
    background-size: 200%;
    box-shadow: 0 5px 10px 0 #14805e22, inset 0 0 3px 0#fff3;
    text-shadow: 0 0 2px #14ba86;
}

    .btn-css2 span {
        margin: auto;
    }

    /* live content */

    /* promotion content */

    .btn-css2.b {
        background: #10BF00;
    }

.promo-search-bar {
    display: flex;
    background: #505050;
    position: relative;
    overflow: auto;
}

    .promo-search-bar ul {
        display: flex;
        margin: auto;
        padding: 10px 5px;
    }

        .promo-search-bar ul li {
            padding: 0 3px;
            min-width: max-content;
        }

    .promo-search-bar .active .btn-css1 {
        background-color: #14805e;
    }

    .promo-search-bar ul li a {
        font-size: 12px;
        display: inline-block;
        height: 30px;
        line-height: 30px;
        text-align: center;
        padding: 0 20px;
        border: none !important;
        background: #333;
        width: 100%;
        border-radius: 3px;
        margin: auto;
        cursor: pointer;
    }

.btn-css1 {
    min-width: 100px;
    border: 1px solid #fff0;
    transition: border-color 0.3s ease;
}

.promo-content {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: 20px auto;
}

.promo-item {
    position: relative;
    width: calc(100% - 20px);
    margin: 0 10px;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 15px;
    box-shadow: 0 0 5px 1px #0003;
    animation: transTopnav 0.5s;
}

.promo-wrap {
    position: relative;
    background: #000;
    overflow: hidden;
}

    .promo-wrap img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: opacity 0.5s ease, transform 1s ease;
    }

.promo-detail {
    background: #fff;
    padding: 10px;
}

    .promo-detail:before {
        content: '';
        position: absolute;
        left: 0;
        height: 6px;
        width: 100%;
        background: url(../images2/promotion/line.png) repeat;
        filter: brightness(3);
        background-size: contain;
        margin-top: -14px;
        z-index: 1;
    }

    .promo-detail h5 {
        font-size: 16px;
        color: #000;
        font-weight: bold;
    }

.promo-button {
    font-size: 13px;
    line-height: 30px;
    display: flex;
    margin-top: 12px;
    grid-gap: 10px;
}

    .promo-button a {
        height: 32px;
        line-height: 32px;
        text-align: center;
        display: inline-block;
        background: linear-gradient(180deg, #27ad83, #14805e);
        text-shadow: none !important;
        box-shadow: unset !important;
        width: 100%;
    }

.promo-detail .text {
    margin: 1px 1px;
    font-size: 13px;
    line-height: 1.5;
    color: #111;
}

.promo-detail .time {
    position: relative;
    margin-bottom: 11px;
    color: #111;
    font-size: 13px;
}

    .promo-detail .time::before {
        content: "";
        font-size: 12px;
        letter-spacing: .5px;
        line-height: .9375rem;
        display: inline-block;
        position: relative;
        width: 0.9375rem;
        height: 0.9375rem;
        margin-right: 0.3125rem;
        vertical-align: middle;
        background: url(../images2/icon-time.png) no-repeat center/cover;
    }

.btn-css2.a {
    background: #027AFF;
}

.detail-banner img {
    width: 100%;
    height: auto;
}

.modal-header.a {
    padding: 0;
    border: unset;
}

.pop-title {
    padding: 0px 16px;
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: auto;
    min-height: 52px;
    background: #14805e;
}

    .pop-title h3 {
        display: -webkit-box;
        overflow: hidden;
        line-height: 1.5;
        text-overflow: ellipsis;
        white-space: normal;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        width: 100%;
        height: auto;
        color: #fff;
        font-size: 15px;
        font-weight: 700;
        margin-bottom: 0;
    }

.modal-body.a {
    padding: 0;
}

.pop-inner {
    position: relative;
    padding: 14px;
    overflow-x: hidden;
    overflow-y: auto;
    text-align: left;
}

    .pop-inner p {
        line-height: 1.38;
        margin-top: 0px;
        margin-bottom: 0px;
        margin: 1px 0;
        font-size: 13px;
        color: #111;
    }
/* promotion content */

/* vip content */

.site-vip {
    min-height: 1100px;
    background: url(../images/vip/vipbg.jpg), #000;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: top center;
    padding: 0 5px;
}

.vip-top {
    display: grid;
}

.vip-top-row {
    display: flex;
    width: 85%;
    max-width: 1100px;
    padding-top: 30%;
    margin: auto;
    margin-bottom: 40px;
}

.vip-row-item {
    display: grid;
    margin: auto;
    padding: 0 5px;
}

    .vip-row-item img {
        width: 100%;
        max-width: 120px;
        margin: auto;
        margin-bottom: 5px;
    }

    .vip-row-item span {
        text-align: center;
        margin: auto;
        font-size: 8px;
        text-transform: uppercase;
        letter-spacing: -0.4px;
        font-weight: 700;
    }

.cssrank0, .cssrank1, .cssrank2, .cssrank3, .cssrank4, .cssrank5, .cssrank6, .cssrank7, .cssrank8 {
    color: #fff;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.cssrank0 {
    background: linear-gradient(to bottom, #f3eeea, #b0a695);
}

.cssrank1 {
    background: linear-gradient(to bottom, #fde5e3, #e48586);
}

.cssrank2 {
    background: linear-gradient(to bottom, #ffec68, #ff9d19);
}

.cssrank3 {
    background: linear-gradient(to bottom, #adaded, #383870);
}

.cssrank4 {
    background: linear-gradient(to bottom, #3fc4ff, #044185);
}

.cssrank5 {
    background: linear-gradient(to bottom, #ffc771, #76531c);
}

.cssrank6 {
    background: linear-gradient(to bottom, #ff4747, #640000);
}

.cssrank7 {
    background: linear-gradient(to bottom, #97feed, #0b666a);
}

.cssrank8 {
    background: linear-gradient(to bottom, #d27685, #66347f);
}

.vip-group {
    display: grid;
}

.vip-title {
    display: block;
    text-align: center;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 10px;
    width: 100%;
    max-width: 1100px;
}

    .vip-title h4 {
        margin-bottom: 10px;
        line-height: 1.5;
        font-size: 19px;
        font-weight: 900;
        background: -webkit-linear-gradient(#ffffbe,#d1a129);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .vip-title p {
        font-size: 12px;
        font-weight: 400;
        margin-bottom: 10px;
    }

.vip-table {
    position: relative;
    padding: 3px;
    margin: 15px auto 40px auto;
    border-radius: 10px;
    background: linear-gradient(to bottom,#eed6a8 0,#bca463 34%,#fff1cc 60%,#bca463 81%,#c5a971 100%);
    box-shadow: inset 0 0 3px #0003;
}

    .vip-table.benefit {
        overflow: auto;
        border-radius: 6px;
        background: black;
        padding: 0px;
        margin: 0px;
    }

    .vip-table.qualify {
        width: 100%;
    }

    .vip-table table.table-head {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .vip-table table {
        width: 100%;
        border-radius: 8px;
        overflow: auto;
    }

        .vip-table table thead th {
            color: #4a3d1b;
            font-size: 13px;
            height: 50px;
            background: linear-gradient(to bottom,#bca463 0,#eed6a8 100%);
            text-align: center;
            line-height: 150%;
            padding: 0 10px;
        }

        .vip-table table.table-seperator {
            border-collapse: separate;
            border-spacing: 0 10px;
            background: #000;
            margin: 3px;
            border-radius: 10px;
            white-space: nowrap;
            z-index: 3;
            position: relative;
            padding: 0px;
            padding-right: 10px;
            margin: 0px;
        }

.table-seperator.details tr > th:first-child, .table-seperator.details tr > td:first-child {
    position: sticky;
    width: 137px;
    top: 0;
    background: black;
    overflow: hidden;
    padding-right: 7px !important;
    /*z-index: 99999;*/
    left: 0;
    text-align: center;
}

.ts-cs-check tr th .cssrank0, .ts-cs-check tr th .cssrank1, .ts-cs-check tr th .cssrank2, .ts-cs-check tr th .cssrank3, .ts-cs-check tr th .cssrank4, .ts-cs-check tr th .cssrank5,
.ts-cs-check tr th .cssrank6, .ts-cs-check tr th .cssrank7, .ts-cs-check tr th .cssrank8 {
    padding-left: 20px;
}


.vip-table table tbody {
    background: #000;
}

    .vip-table table tbody tr td.td-vs {
        display: flex;
        background: #141414;
        align-items: center;
        text-align: center;
    }

        .vip-table table tbody tr td.td-vs img {
            max-height: 24px;
        }


    .vip-table table tbody tr td:first-child {
        border-radius: 10px 0 0 10px;
    }

    .vip-table table tbody tr td {
        text-align: center;
        color: #f8d072;
        font-size: 13px;
        padding-left: 20px;
        vertical-align: middle;
        min-height: 50px;
        background: #0b0b0b;
    }

        .vip-table table tbody tr td .vip-icon {
            width: 24px;
            height: 24px;
            margin: auto;
            margin-top: 5px;
        }

        .vip-table table tbody tr td span {
            font-weight: 700;
            font-size: 13px;
            padding: 0 4px;
        }

        .vip-table table tbody tr td.td-center {
            vertical-align: middle;
        }

        .vip-table table tbody tr td:last-child {
            border-radius: 0 10px 10px 0;
        }

        .vip-table table tbody tr td .coin-icon {
            width: 18px;
            height: 18px;
        }

        .vip-table table tbody tr td.italic {
            font-style: italic;
        }

.vip-outer {
    width: 100%;
    max-width: 1100px;
    margin: auto;
    margin-top: 40px;
    display: grid;
}

    .vip-outer.cont2 {
        margin-top: 38px;
        padding: 3px;
        border-radius: 5px;
        background: linear-gradient(to bottom,#eed6a8 0,#bca463 34%,#fff1cc 60%,#bca463 81%,#c5a971 100%);
        box-shadow: inset 0 0 3px #0003;
        display: grid;
    }

.vip-table table.table-seperator.brfull {
    border-radius: 8px;
}

.table-vshide td {
    background: unset !important;
    height: 40px;
}

    .table-vshide td .th-rank {
        width: 100%;
        height: 100%;
        padding: 0 18%;
    }

.vip-table table tbody tr td h2.bold {
    font-size: 13px;
}

.vip-table table tbody tr td h2 {
    color: #fff;
    font-size: 12px;
    margin: 0;
    padding: 0px;
}

.vip-table table tbody tr td .td-click {
    display: flex;
    width: 90%;
    min-width: 30px;
    min-height: 40px;
    background: #141414;
    margin: auto;
    border-radius: 10px;
}

.vip-table table tbody.ts-cs-check tr td:nth-child(2) .td-click:before {
    color: #efc941;
}

.vip-table table tbody.ts-cs-check tr td:nth-child(3) .td-click:before {
    color: #8b8ac3;
}

.vip-table table tbody tr td .td-click:before {
    content: '\f00c';
    font: var(--fa-font-solid);
    font-weight: 900;
    margin: auto;
}

.vip-table table tbody.ts-cs-check tr td:nth-child(4) .td-click:before {
    color: #11aef4;
}

.vip-table table tbody.ts-cs-check tr td:nth-child(5) .td-click:before {
    color: #e2ad5c;
}

.vip-table table tbody.ts-cs-check tr td:nth-child(6) .td-click:before {
    color: #e30630;
}

.vip-table table tbody tr td .td-none:before {
    content: '';
    display: block;
    background: #444;
    width: 30%;
    height: 4px;
    max-width: 12px;
    border-radius: 3px;
    margin: auto;
}

.vip-table table tbody tr td .td-none {
    display: flex;
    width: 90%;
    min-width: 30px;
    min-height: 40px;
    background: #141414;
    margin: auto;
    border-radius: 10px;
}

.vip-coin-detail {
    display: flex;
    width: 100%;
    max-width: 1100px;
    margin: auto;
    padding-right: 20px;
}

.vip-coin-item:first-child {
    margin-left: auto;
}

.vip-coin-item img {
    width: 20px;
    height: 20px;
    margin-right: 3px;
}

.site-vip .silver {
    color: #ccc;
}

.vip-coin-item span {
    font-size: 13px;
}

.vip-coin-item {
    margin-left: 15px;
}

.site-vip .gold {
    color: #ffde5b;
}

.vip-table .td-custom span {
    font-weight: 400;
    font-size: 13px;
}

.vip-table .td-custom .exchange {
    margin: auto 10px;
    font-size: 12px;
    color: #777;
}

.vip-table .td-custom img {
    width: 16px !important;
    height: 16px !important;
}

.vip-table .td-custom .exchange:before {
    content: "\f0da";
    font: var(--fa-font-solid);
    font-size: 12px;
    font-weight: 900;
}

.text-left {
    text-align: left !important;
}

.site-wrap.a {
    background: #000;
}

/* vip content */

/* dailyreward content */

.promo-sec {
    background: #111;
}

.coin_title_wrap {
    align-items: center;
    color: white;
    padding: 20px;
    margin: 5px;
    margin-bottom: 10px;
}


.dailycheckin_section {
    display: flex;
    width: 100%;
    font-weight: 400;
    font-size: 10px;
    cursor: default;
}

.dailycheckin_background {
    width: 100%;
    height: 100%;
    border-radius: .0rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.dailycheckin_coinstyle {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    color: #fff;
}

    .dailycheckin_coinstyle p {
        font-size: 19px;
        font-weight: 500;
        line-height: 1.875rem;
        margin-top: 10px;
    }

    .dailycheckin_coinstyle span {
        padding-top: 5px;
    }

.dailycheckin_position {
    position: relative;
}

.dailycheckin_dailyspacing {
    width: 500px;
}

.dailycheckin_dailyspacing_mobile {
    width: 280px;
}

.dailycheckin_dailylist {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
}

    .dailycheckin_dailylist li {
        list-style: none;
    }

.dailycheckin_todaytext:not(.dailycheckin_dailytext) {
    color: #dc0000;
}

.dailycheckin_notdailytext:not(.dailycheckin_dailytext) .dailycheckin_dailytextstyle {
    color: #ffe7b1;
}

.dailycheckin_dailytext {
    color: #dc0000;
}

    .dailycheckin_dailytext .dailycheckin_dailytextstyle {
        color: #d3aa4a;
    }

.dailycheckin_dailytextdata {
    position: relative;
    z-index: 1;
    margin: 1px 0px 0px -10px;
    margin-bottom: .125rem;
    width: 1.875rem;
    height: 1.875rem;
}

.dailycheckin_notdailytext:not(.dailycheckin_dailytext) {
    color: #dc0000;
}

    .dailycheckin_notdailytext:not(.dailycheckin_dailytext) .dailycheckin_dailytextstyle_mobile {
        color: #ffe7b1;
    }

.dailycheckin_dailytext {
    color: #dc0000;
}

    .dailycheckin_dailytext .dailycheckin_dailytextstyle_mobile {
        color: #F9CA5E;
    }

.dailycheckin_dailytextstyle_mobile {
    display: inline-block;
    margin-top: .125rem;
    margin-left: -10px;
    height: .875rem;
    font-size: 11px;
    line-height: .875rem;
    color: #c43700;
    font-weight: 600;
    width: 3.0625rem;
    text-align: center;
}

.dailycheckin_linestyle {
    position: absolute;
    top: .875rem;
    left: 2.5%;
    height: 2px;
    width: 95%;
}

.dailycheckin_linestyle_mobile {
    position: absolute;
    top: 15px;
    left: 5%;
    height: 2px;
    width: 90%;
}

.dailycheckin_unclaim_linecolor {
    background-color: #c43700;
}

.dailycheckin_claimed_linecolor {
    background-color: black;
    transform-origin: left;
    transition: transform .3s;
}

.dailycheckin_claimed_linecolor {
    background-color: white;
}

.dailycheckin_buttonstyle {
    display: block;
    margin: auto;
    margin-top: 40px;
    margin-bottom: 30px;
    padding: .625rem 2.0625rem;
    border-radius: 3.375rem;
    border: none;
    color: #d0011b;
    background: none;
    background-color: #fff;
    outline: none;
    line-height: 1rem;
}

    .dailycheckin_buttonstyle .dailycheckin_bold {
        font-weight: bold;
    }

.dailycheckin_buttonstyle_white {
    display: block;
    margin: auto;
    margin-top: 1.25rem;
    margin-bottom: 1rem;
    padding: 0.625rem 2.0625rem;
    border-radius: 3.375rem;
    border: none;
    color: #d0011b;
    background: none;
    background-color: #fff;
    outline: none;
    line-height: 1rem;
}

.dailycheckin_buttontext {
    color: #fff;
    background-color: #e26b01;
}

.fa-rotate-45 {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.fa-stack-2x {
    font-size: 30px !important;
}

.fa-xxxs {
    font-size: 20px !important;
    margin-top: 6px;
}

.fa-xxxs2 {
    font-size: 10px !important;
    margin-top: -1px;
}

.fa-xxxs-master {
    font-size: 10px !important;
}

.white-coin {
    color: #EDCF94;
    text-shadow: 2px 2px 5px rgba(0,0,0, 0.2);
}

.orange-coin {
    color: #f0a304;
    text-shadow: 2px 2px 5px rgba(0,0,0, 0.2);
}

.red-angpau {
    color: #f44336;
    text-shadow: 2px 2px 5px rgba(0,0,0, 0.2);
}

.red-angpau-outline {
    color: #f9bc3b;
}

.orange-coin-ring {
    color: #f9bc3b;
}

.red-text {
    color: #c43700;
}

.fa-fuuuu {
    font-family: -apple-system,"Helvetica Neue",Helvetica,"Roboto","Droid Sans",Arial,sans-serif;
    font-size: 14px;
    display: block;
    align-items: center;
    text-align: center;
    margin-top: -13px !important;
    color: #f9bc3b;
}

.number-on-fa {
    font-family: -apple-system,"Helvetica Neue",Helvetica,"Roboto","Droid Sans",Arial,sans-serif;
    font-size: 14px;
    margin-top: -5px;
    display: block;
}

.coins_btn {
    color: white;
    font-weight: 600;
}

.coins_btn {
    color: white;
    display: inline-block;
    font-weight: 600;
    line-height: 2.0;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border: 2px solid #fff6de;
    border: 1px solid #cba98c;
    padding: 0.375rem 0.75rem;
    background-image: linear-gradient(to bottom,#f1d6bf 5%,#d2b7a0 100%);
    text-shadow: 0px 1px 0px #9a9a9a;
    font-size: 12px;
    border-radius: 20px;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.coin_title {
    font-size: 16px;
    font-weight: 700;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    letter-spacing: 0.3px;
}


.checkin-ul {
    margin-top: 20px;
    justify-content: space-between;
    scrollbar-width: none;
    display: flex;
    width: 88%;
    padding-bottom: 20px;
    overflow-x: scroll;
    overflow-y: hidden;
    column-gap: 32px;
    row-gap: 32px;
}

.checkin-wrap {
    position: relative;
    color: #261858;
    cursor: pointer;
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    transition: transform .2s;
    cursor: grab;
}

.checkin-ul .checkin-wrap {
    width: 14.25em;
    height: 28em;
    min-width: 131px;
}

.checkin1 {
    position: absolute;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
    height: 89%;
}

    .checkin1 .checkin1-bg {
        clip-path: polygon(15% 0%, 100% 0, 100% 100%, 0 100%, 0 15%);
        border-radius: 0.375em;
        align-items: center;
        justify-content: center;
        background: #bebebe;
        opacity: 50%;
        width: 100%;
        height: 100%;
        transition: .2s;
    }

.checkin2 {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.checkin-img {
    width: 100%;
    position: absolute;
    transition: all .3s;
    top: 0px;
}

.checkin-btm {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    z-index: 1;
    box-sizing: border-box;
}

    .checkin-btm .checkin-btm1 {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        width: 100%;
        box-sizing: border-box;
        margin-bottom: -1px;
        padding: 1em 1em;
    }

        .checkin-btm .checkin-btm1.btm1 {
            background: linear-gradient(180deg, rgb(255 249 228 / 46%) 0%, #1d534e 66.15%);
        }

        .checkin-btm .checkin-btm1 .checkin-btm1-title {
            position: relative;
            padding-left: 1em;
        }

            .checkin-btm .checkin-btm1 .checkin-btm1-title .checkin-line {
                left: 0;
                height: 100%;
                width: 5px;
                position: absolute;
            }

.checkin-line.line1 {
    background: #4f8580;
}

.checkin-t2 {
    display: flex;
    font-weight: bold;
    font-size: 12px;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.44;
}

.checkin-btm2 {
    box-sizing: border-box;
    width: 100%;
    background: #009688;
    box-shadow: 0px 0px 6px 0px rgb(0 153 139);
    border-radius: 0 0 0.5em 0.5em;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 16px;
}

.btn-login2 {
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    color: #ffffff;
    width: 75%;
    height: 28px;
    border: 1px solid #009688;
    border-radius: 3px;
    letter-spacing: 1px;
    font-size: 14px;
    font-weight: 700;
    cursor: grab !important;
}

    .btn-login2:focus {
        color: rgba(255,255,255,1);
        box-shadow: 0 0 10px #d69b41;
        font-weight: 600;
        transition: all 0.5s ease;
    }

.coins-btn {
    display: inline-block;
    color: #fff;
    font-weight: 600;
    line-height: 2;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border: 10px;
    padding: 0.45rem 0.75rem;
    background: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    font-size: 14px;
    border-radius: 3px;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    box-shadow: 0 5px 10px 0 rgba(6,8,15,.1),inset 0 0 3px 0#ffdd8f;
}

.mission-main, .mission-calendar-holder {
    width: 100%;
    height: initial;
    display: flex;
    flex-direction: column;
}

.mission-daily-calendar-holder {
    background: #000000;
    border-radius: 15px;
    margin-top: 20px;
}

.calendar-header-tab {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    background: linear-gradient(to bottom,#1bac7e,#14805e);
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    padding: 10px;
}

.mission-month-login {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    color: #fff;
    justify-content: center;
}

.month-year-text {
    color: #fff;
    font-weight: bold;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: 0.5px;
}

.mission-continuous-login {
    font-size: 13px;
    letter-spacing: 0.2px;
}


.mission-daily-calendar-holder .missionCalendar {
    font-size: 12px;
    margin-bottom: 15px;
    width: 100%;
}

.missionCalendar .day-content {
    padding: 8px 4px;
    text-align: center;
    border: none;
}

.day-content span {
    font-size: 12px;
    font-weight: 600;
}

.day-content span {
    font-size: 12px;
    font-weight: 600;
}

.daily-image-container {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    background: grey;
    justify-content: center;
    background: #1C1C1C;
    border-radius: 10px;
    margin-top: 5px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.check-in-indicator {
    position: absolute;
    height: 100%;
    width: 100%;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .check-in-indicator img {
        width: 75%;
    }

    .check-in-indicator.mission-checked {
        background: rgba(19, 163, 0, .1);
        border: 1px solid #254B20;
        box-shadow: 0px 0px 8px 2px #51ffa1;
    }

.day-type-mission {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 8px;
    border-top: 1px solid #413E3B;
}


.checkin-box {
    background: transparent;
}

.checkin-session {
    display: block;
    height: 70%;
    justify-content: center;
}

    .checkin-session .cc-title {
        font-size: 22px;
        font-weight: 700;
        font-weight: bold;
        text-align: center;
        margin-bottom: 30px;
    }

.cc-image-cont {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-bottom: 20px;
}

    .cc-image-cont img {
        width: 60%;
    }

.cc-desc {
    display: flex;
    justify-content: center;
    text-align: center;
}

    .cc-desc h5 {
        font-size: 16px;
        color: white;
        font-weight: 600;
    }

    .cc-desc.points h5 {
        color: #feed09;
    }

.coins-btn.check-dl {
    width: 50%;
    height: 100%;
}

.modal-backdrop.show {
    opacity: 0.8 !important;
}

.mission-cont .nav-tabs {
    background: linear-gradient(to bottom,#095d42,#06573d);
    align-items: center;
    border-radius: 10px;
    margin: 20px 0;
    width: 100%;
    display: flex;
    border-bottom: 1px solid transparent;
}

    .mission-cont .nav-tabs li {
        width: 50%;
    }

    .mission-cont .nav-tabs .nav-link {
        text-decoration: none;
        color: white;
        border-color: transparent;
        padding: 6px 2px;
        border-radius: 10px;
        font-size: 13px;
        justify-content: center;
        text-align: center;
        display: flex;
        transition: 0.3s ease-in-out;
        border-bottom: 1px solid transparent;
        width: 100%;
    }

        .mission-cont .nav-tabs .nav-link.active {
            background: linear-gradient(to bottom,#1bac7e,#14805e);
            align-items: center;
            border-radius: 10px;
        }

.mission-detail-container {
    padding: 8px;
    background: #0d2510;
    border-radius: 15px;
    margin: 10px 0;
    position: relative;
    contain: content;
}

.mission-detail-holder {
    display: flex;
    justify-content: space-between;
    padding: 12px;
    gap: 15px;
}

.mission-detail-title {
    display: flex;
    flex-direction: column;
    flex: 1;
}

    .mission-detail-title h4 {
        font-size: 14px;
        font-weight: 600;
        margin-bottom: 10px;
        letter-spacing: 0.5px;
        line-height: 1;
    }

    .mission-detail-title span {
        font-size: 12px;
        font-weight: 400;
        color: #919191;
    }

.mission-detail-status {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    justify-content: center;
    color: #e3e3e3;
    font-size: 13px;
    letter-spacing: 0.3px;
    text-transform: capitalize;
}

.mission-progress-container {
    width: 80px;
    height: 8px;
    background: #534F4A;
    overflow: hidden;
    border-radius: 10px;
}

.mission-progress {
    height: inherit;
    float: left;
    border-radius: 10px;
    background: #26ffbc;
}

.mission-reward {
    padding: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
}

.mission-reward-container span:first-child {
    color: #eaeaea;
}

.mission-reward-amount {
    color: #ffe43c;
}

.page-navigation,
.pagination-game {
    margin-bottom: 15px;
    display: flex;
    justify-content: center;
    text-align: center;
}

    .page-navigation .previous_link,
    .pagination-game .prev-page {
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        position: relative;
        transition: 0.4s;
        font-size: 11px;
    }

    .page-navigation .next_link,
    .pagination-game .next-page {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        transition: 0.4s;
        font-size: 11px;
    }

    .page-navigation .previous_link,
    .page-navigation .next_link,
    .page-navigation .go_to_page,
    .pagination-game .prev-page,
    .pagination-game .next-page,
    .pagination-game .page-number.active,
    .pagination-game .page-number.active2 {
        text-decoration: none;
        color: white;
        border-color: transparent;
        padding: 7px 13px;
        justify-content: center;
        text-align: center;
        display: inline-flex;
        transition: 0.4s;
        background: #0b5b42;
        align-items: center;
        font-size: 11px;
    }

    .pagination-game .page-number {
        display: none;
    }

        .page-navigation .previous_link:hover,
        .page-navigation .previous_link:active,
        .page-navigation .next_link:hover,
        .page-navigation .next_link:active,
        .page-navigation .go_to_page:hover,
        .page-navigation .go_to_page:active,
        .page-navigation .go_to_page.active_page,
        .pagination-game .prev-page:hover,
        .pagination-game .prev-page.active,
        .pagination-game .next-page:hover,
        .pagination-game .next-page:active,
        .pagination-game .page-number:hover,
        .pagination-game .page-number.active {
            background: #169d73;
            align-items: center;
            transition: 0.4s;
        }


/** DAILY REWARDS CONTENT**/

.box {
    margin-top: 20px;
    width: 273px;
    border-radius: 10px;
    overflow: hidden;
    text-align: center;
    justify-content: center;
    height: auto;
    border: 1px solid #167154;
}

.reward-img {
    height: auto;
    position: relative;
}

    .reward-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        box-sizing: border-box;
    }

.point2 {
    font-weight: 700;
    font-size: 18px;
    letter-spacing: 0.3px;
    color: black;
    padding-left: 10px;
    position: absolute;
    top: 8px;
    right: 16px;
}


.reward_coin {
    color: #ffe500;
    margin-left: -10px;
    font-size: 16px;
    font-style: normal;
}

.reward_coin2 {
    color: #ffe500;
    margin-left: -10px;
    font-size: 16px;
    font-style: normal;
}

.overlay {
    visibility: hidden;
}

.overlay {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    height: 100%;
    background-color: rgba(138, 140, 255, 0.6);
    display: flex;
    justify-content: center;
    align-items: center;
}

.buy-btn {
    width: 160px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FFFFFF;
    color: #252525;
    font-weight: 700;
    letter-spacing: 1px;
    border-radius: 20px;
    box-shadow: 2px 2px 30px rgb(0 0 0 / 20%);
}

.reward-img:hover .overlay {
    visibility: visible;
    animation: fade 0.5s;
}

@keyframes fade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.detail-box {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    box-sizing: border-box;
    height: auto;
    background-color: #03131d;
}

.detail-box {
    color: white;
    background-color: #03131d;
}

.type span {
    color: white !important;
}

.type {
    display: flex;
    flex-direction: column;
    text-align: left;
}

    .type a {
        color: #1a976f;
        margin: 3px 0px;
        font-weight: 700;
        letter-spacing: 0.5px;
    }

    .type span {
        font-size: 11px;
    }

.lSAction > a {
    background-image: url(../images2/dailyreward/controls.png) !important;
    z-index: 1 !important;
}


/* dailyreward content */

/** ENTERTAINMENT CONTENT **/

.entertain_bigh1 {
    font-size: 15px;
    color: white;
    font-weight: 700;
    padding-bottom: 10px;
    padding-top: 25px;
}

.entertain_bigh2 {
    font-size: 15px;
    color: white;
    font-weight: 700;
    padding-bottom: 10px;
    padding-top: 15px;
}

.blog_content {
    font-size: 11px;
    margin-top: 10px;
    letter-spacing: 0.5px;
    line-height: 1.7;
}


.entertain_grid img {
    border: 1px solid #cba98c;
    width: 100%;
    height: 120%;
    border-radius: 8px;
    cursor: pointer;
    object-fit: cover;
}

.entertain_grid2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 10px;
    justify-content: center;
    max-height: 150%;
}


.slide-img2 {
    height: auto;
    position: relative;
    text-align: center;
    cursor: pointer;
    transition: all .2s;
    transform: scale(1);
}


a.plant1:before {
    z-index: 99;
}

.entertain_text {
    position: absolute;
    left: 50%;
    top: 38%;
    transform: translate(-50%,-50%);
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    visibility: visible;
    color: white;
    font-size: 18px;
    font-weight: 600;
}

.entertain_text2 {
    position: absolute;
    left: 50%;
    top: 58%;
    transform: translate(-50%,-50%);
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    visibility: visible;
    color: white;
    font-size: 12px;
}

.entertain_grid2 img {
    border: 1px solid #cba98c;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    cursor: pointer;
    overflow: hidden;
    object-fit: contain;
    transition: all .2s;
    transform: scale(1);
}

.entertain_grid3 {
    display: inline-block;
    height: 80%;
}

    .entertain_grid3 img {
        border: 1px solid #cba98c;
        width: 90%;
        height: 150px;
        border-radius: 8px;
        cursor: pointer;
        transition: all .3s;
        margin-bottom: 15px;
        object-fit: cover;
    }

        .entertain_grid3 img:hover {
            -ms-transform: scale(1.1);
            -webkit-transform: scale(1.1);
            transform: scale(1.1);
            opacity: 1.5;
        }

/** ENTERTAINMENT CONTENT CLOSED **/

/** REWARDS CONTENT OPEN **/

.back-promo {
    background: #505050;
    position: relative;
    padding: 10px 5px;
    overflow: auto;
}

.promo_menu {
    display: flex;
    position: relative;
    gap: 8px;
}

.promo_box {
    padding: 10px;
}

.reward_menu {
    display: flex;
    position: relative;
    overflow: auto;
    width: 100%;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

    .reward_menu::-webkit-scrollbar {
        display: none;
    }

.rmbox {
    display: flex;
    color: #ffffff;
    border: none;
    font-size: 11px;
    min-width: 130px;
    font-weight: 500;
    text-align: center;
    align-items: center;
    justify-content: center;
    height: 34px;
    background-color: #ffffff;
    text-transform: uppercase;
    background: #333;
    border-radius: 5px;
    cursor: pointer;
}

    .rmbox.filter.active {
        background-color: #14805e;
        color: white;
        font-weight: 600;
    }

.reward_box {
    padding: 15px;
}

.box2 {
    display: grid;
    grid-template-columns: 140px auto;
    box-shadow: 2px 2px 30px rgb(0 0 0 / 20%);
    width: auto;
    overflow: hidden;
    height: auto;
    margin-bottom: 25px;
    border-radius: 19px;
    border: 1px solid #9E9E9E;
}

.slide-img {
    height: auto;
    position: relative;
    align-self: center;
    align-content: center;
    justify-content: center;
}

    .slide-img img {
        height: auto;
        width: auto;
        object-fit: cover;
        box-sizing: border-box;
        max-width: 100%;
    }

.bottom-box {
    width: 100%;
    justify-content: space-between;
    text-align: left;
    padding: 10px 10px;
    box-sizing: border-box;
    height: 100%;
    background-color: rgb(86 84 84);
}

.bottom-text {
    display: flex;
    flex-direction: column;
}

.reward_title {
    color: #ffffff;
    font-weight: 700;
    letter-spacing: 0.1px;
    height: 15px;
    padding-bottom: 40px;
    font-size: 13px;
}

.reward_content {
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 11px;
    color: rgb(255 255 255);
    line-height: 18px;
    height: 100%;
    text-align: left;
}

.point {
    min-width: 120px;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.3px;
    color: black;
    margin-left: -5px;
}

.reward-btn {
    background-image: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    min-width: 65px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    cursor: pointer;
    border-radius: 3px;
    font-size: 12px;
}

.time-box {
    padding-top: 10px;
    font-size: 12px;
}

.time-time-box {
    color: black;
}
/** REWARD CONTENT CLOSED **/

/** TOURNAMENT CONTENT OPEN **/

/** TOURNAMENT CONTENT **/

.promo_menu.tour {
    flex-wrap: nowrap;
    padding: 0;
}

.hall-swinner {
    display: flex;
    top: 0;
    width: 100%;
}

.hfbox .nav-link {
    text-transform: uppercase;
    background: #333;
    border-radius: 5px;
    cursor: pointer;
    font-size: 11px;
    min-width: 109px;
    font-weight: 500;
    text-align: center;
    align-items: center;
    justify-content: center;
    height: 34px;
    color: #ffffff;
}

    .hfbox .nav-link.active {
        transition: 0.2s;
        background-color: #14805e;
        color: white;
        font-size: 11px;
        border: unset;
    }

.banner_image {
    z-index: 1;
    display: block;
    width: auto;
    bottom: 0;
}

.hof-page-left {
    right: calc(70% - 97px);
    width: 205px;
    top: 60px;
}


.hof-page-right {
    right: calc(70% - 287px);
    width: 216px;
    top: 71px;
}

.hof-padd {
    margin: 5px;
}

.hof-t {
    display: flex;
    justify-content: center;
    align-items: center;
}

.hof-title {
    font-size: 19px;
    font-weight: 700;
    font-style: italic;
    color: white;
    padding: 5px;
}

.hof-page {
    display: flex;
    justify-content: center;
}

.hof-pedestal {
    font-size: 10px;
    width: 31.875em;
    height: 21.0625em;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
    background-size: 100%;
    background-image: url(../images2/tournament/hof-pedestal.png);
    background-repeat: no-repeat;
    object-fit: cover;
}

.hof-pedestal-place {
    position: absolute;
    bottom: 0px;
    width: 9.375em;
    padding: 0.75em 0.75em 0.625em;
    cursor: pointer;
}

.hof-pedestal-place--first {
    width: 11.875em;
    left: 10em;
    padding: 2.0625em 1em 0.625em;
}

.hof-pedestal-place-info {
    font-size: .875em;
    padding: 0 0.357em 0.571em 0;
}

.hof-pedestal-place--first .hof-pedestal-place-info {
    padding: 0 0 0.571em 0;
}

    .hof-pedestal-place--first .hof-pedestal-place-info img {
        height: 77px;
        width: 63px;
    }

.hof-pedestal-place-info img {
    display: block;
    margin: 0 auto 0px;
    height: 100px;
    width: 82px;
    border-radius: 5px;
    cursor: pointer;
}

.hof-pedestal-user {
    width: 9.571em;
    margin: 0 auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    color: white;
    font-size: 10px;
    font-weight: 600;
}

.hof-pedestal-place-stats-win {
    color: white;
    font-size: 13px;
    font-weight: 600;
}

.hof-pedestal-place-stats > div {
    display: flex;
    justify-content: center;
    gap: 13px;
}

.hof-pedestal-place--second {
    left: 0;
}

    .hof-pedestal-place--second .hof-pedestal-place-info img {
        height: 60px;
        width: 50px;
    }

    .hof-pedestal-place--second .hof-pedestal-user {
        width: 80px;
    }

    .hof-pedestal-place--second .hof-pedestal-place-stats > div {
        font-size: 11px;
    }

.hof-pedestal-place--third {
    right: 0;
}

    .hof-pedestal-place--third .hof-pedestal-place-info img {
        height: 60px;
        width: 50px;
    }

    .hof-pedestal-place--third .hof-pedestal-user {
        width: 80px;
    }

    .hof-pedestal-place--third .hof-pedestal-place-stats > div {
        font-size: 11px;
    }

.top-winners-filter-wrapper {
    padding: 0px 0px 2px 1px;
    border-radius: 10px 10px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-winners-table-wrapper {
    margin: 10px;
}

.top-winners__col-place {
    width: 15%;
}

.top-winners__col-turnover {
    width: 35%;
}

.top-winners__col-prize {
    width: 15%;
}

.t-table thead th {
    min-height: 46px;
    color: white;
    font-weight: 700;
    background-color: #292828;
    padding: 10px;
    font-size: 13px;
}

.t-table thead tr:first-of-type th:first-of-type {
    border-top-left-radius: 8px;
}

.t-table thead tr:last-of-type th:last-of-type {
    border-top-right-radius: 8px;
}

.top-winner-cell {
    display: flex;
    align-items: center;
    justify-content: center;
}

.t-table tbody tr {
    border-bottom: 2px solid #9E9E9E;
    transition: transform .5s;
}

.t-table tbody td {
    color: white;
    cursor: pointer;
    padding: 15px;
    font-size: 12px;
    font-weight: 500;
}

.tournament-flex {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.tournament-img {
    width: 185px;
}

.tournament-desc {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: white;
    font-size: 14px;
    font-weight: 600;
}

.svg-inline--fa {
    display: inline-block;
    font-size: inherit;
    height: 1em;
    overflow: visible;
    vertical-align: -0.125em;
}

.modal-header.b {
    background: #14805e;
    color: #fff;
    position: relative;
    height: 55px;
    border: none;
}

.modal-body.b {
    background: linear-gradient(to bottom,#211f1f 5%,#857f7f 100%);
}

.btn-close {
    background: transparent url(../images2/modalcancel.png) no-repeat center/contain;
    height: 0;
}

/** TOURNAMENT CONTENT CLOSED **/

/** SUGGESTION CONTENT CLOSED **/

.form-body {
    position: relative;
    width: 100%;
    padding-right: 30px;
    padding-left: 30px;
}

.sgt-title {
    text-align: center;
    margin-top: 30px;
    font-weight: 700;
    font-size: 20px;
    margin-bottom: 20px;
}

.suggestInput.long {
    width: 100%;
}

.textArea {
    min-height: 187px;
}

.suggestInput {
    padding: 8px;
    color: #515050;
    width: 320px;
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 8px;
    border-radius: 3px;
    background: #fff;
}

.btn_login_page {
    background: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    color: #ffffff;
    min-width: 110px;
    height: 30px;
    border-radius: 3px;
    text-decoration: none;
    font-weight: 500;
    letter-spacing: 0.8px;
}

.form-control {
    font-size: 13px;
    line-height: 20px;
    width: 100%;
    min-height: 30px;
    padding: 0 10px;
    border: none;
    background: #333333 !important;
    transition: border-color 0.3s ease;
    outline: none !important;
    color: #fff;
    margin: auto 0;
}

    .form-control:focus {
        color: white;
        /*border: 0;*/
        box-shadow: unset;
    }

.suggestInput {
    background: #333333 !important;
    color: white;
    outline: none;
}
/** SUGGESTION CONTENT CLOSED **/

/** INDEX(Login) CONTENT OPENED **/

.site-mfooter {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 55px;
    z-index: 5;
    border-top: 1px solid #333333;
    background: #111;
    box-shadow: 0 0 5px #0005;
}

.mfooter-menu {
    display: flex;
}

    .mfooter-menu a {
        position: relative;
        display: grid;
        width: 100%;
        height: 55px;
        padding: 0 5px;
        overflow: hidden;
    }

        .mfooter-menu a.active:before {
            content: '';
            position: absolute;
            top: 5px;
            left: calc(50% - 20px);
            background: #8888;
            border-radius: 50%;
            width: 40px;
            height: 40px;
            animation: mfglow 3s infinite;
            z-index: -1;
        }

@keyframes mfglow {
    0% {
        transform: scale(0.2);
        opacity: 1;
    }

    70% {
        transform: scale(3);
        opacity: 0;
    }

    100% {
        transform: scale(0);
        opacity: 0;
    }
}

.mfooter-menu a img {
    margin: auto;
    margin-bottom: 0;
    width: 25px;
    height: 25px;
}

.mfooter-menu a span {
    margin: auto;
    font-size: 11px;
    color: #eee;
    /* line-height: 100%; */
    margin-top: 0px;
}

/** INDEX(Login) CONTENT CLOSED **/

/** DEPOSIT CONTENT OPEN **/
.site-header3.type2 {
    background: #14805e;
    border-color: #1b8b67;
}

.sprofile-topnav {
    display: flex;
    width: 100%;
    min-height: 50px;
    background: #14805e;
}

.sprofile-main-menu {
    display: flex;
    margin: auto;
}

    .sprofile-main-menu a.btn-css2 {
        font-size: 12px;
        height: 32px;
        line-height: 32px;
        margin: auto;
        background: #34af83;
        box-shadow: 0 0 4px #0004;
        text-shadow: unset;
        z-index: 1;
    }

    .sprofile-main-menu a {
        min-width: 130px;
        text-align: center;
        display: block;
        font-weight: 700;
        padding: 0 25px;
    }

        .sprofile-main-menu a.btn-none {
            background: #0d543e;
            height: 28px;
            line-height: 28px;
            margin: auto;
            border-radius: 3px;
            font-size: 12px;
        }

.player-top {
    position: relative;
    flex-direction: column;
    height: auto;
    background: #14805E;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.main-wallet-info {
    width: 100%;
    padding: 0 10px 10px;
    color: #fff;
    zoom: 1;
}

.renew-main-wallet {
    display: inline-block;
    line-height: 2;
}

    .renew-main-wallet span {
        margin-right: 5px;
        font-size: 12px;
    }

.main-wallet-info h4 {
    font-size: 37px;
    text-align: right;
}

.renew-main-wallet.active img {
    animation: reneWallet 1s linear;
}

@keyframes reneWallet {
    0% {
        transform: rotate(0);
    }

    to {
        transform: rotate(1turn);
    }
}

.menu-box {
    position: relative;
    width: 100%;
    height: auto;
    margin: 9px 0;
    padding: 6px 16px;
    padding-bottom: 20px;
    background-color: #333;
}

.menu-box-a {
    margin: 9px 0;
    background-color: #333;
}

.menu-box .title {
    width: 100%;
    margin-top: 10px;
}

    .menu-box .title h2 {
        display: flex;
        position: relative;
        align-items: center;
        justify-content: space-between;
        padding-left: 9px;
        border-bottom: 1px solid #5e5e5b;
        color: #fff;
        font-size: 16px;
        padding-bottom: 8px;
    }

        .menu-box .title h2:before {
            content: "";
            display: inline-block;
            position: absolute;
            left: 0;
            width: 5px;
            height: 21px;
            margin-right: 5px;
            border-radius: 10px;
            background-color: #14805e;
            vertical-align: middle;
        }

        .menu-box .title h2 span {
            font-size: 15px;
            display: inline-block;
            width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            vertical-align: middle;
            white-space: nowrap;
        }

.select-group {
    position: relative;
    background-color: #333;
}

    .select-group .col3 {
        grid-gap: 10px;
        grid-template-columns: repeat(auto-fill,calc((100% - 20px) / 3));
        border: 0;
        display: grid;
        width: 100%;
    }

    .select-group button {
        display: grid;
        width: 100%;
    }

    .select-group button {
        display: inline-block;
        position: relative;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .select-group [type=radio] + label {
        display: flex;
        position: relative;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-width: 100%;
        border: 1px solid #5e5e5b;
        border-radius: 3px;
        background-color: #333;
        color: #fff;
        font-size: 12px;
        line-height: 2.7;
        text-align: center;
        padding: 5px;
    }

    .select-group .bank {
        margin-bottom: 6px;
    }

        .select-group .bank i {
            font-size: 23px;
        }

        .select-group .bank img {
            display: block;
            width: auto;
            height: 26px;
        }

    /*.select-group span {
        line-height: 1.5;
        width: 85px;
        font-size: 11px;
    }*/

    .select-group span {
        line-height: 1.5;
        width: 85px;
        /*white-space: nowrap;*/
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 11px;
    }

    .select-group [type=radio] {
        display: none;
    }

.nav-link.content-bank {
    padding: 0;
    color: white;
}

    .nav-link.content-bank.active {
        transition: all .3s;
        border: 1px solid #FFDF1A;
        background-color: #333;
        color: #ffdf1a;
        border-radius: 3px;
    }

.col3 .active label::before {
    content: '\f00c';
    font: var(--fa-font-solid);
    font-weight: 800;
    margin: auto;
    position: absolute;
    transition: .3s;
    z-index: 2;
    right: -1px;
    bottom: -2px;
    font-size: 13px;
    width: 13px;
    height: 13px;
    color: #101935;
}

.col3 .active label::after {
    content: "";
    border-width: 0 0 20px 20px;
    border-style: solid;
    border-color: transparent transparent #ffe43c;
    position: absolute;
    display: block;
    right: -1px;
    bottom: -1px;
}

.menu-box .title h2 p {
    display: flex;
    color: #eee;
    font-size: 10px;
    white-space: nowrap;
}

.form-control[readonly] {
    background-color: #454545 !important;
    opacity: 1;
}

.col-form-label b {
    font-size: 13px;
    color: #26ffbc;
}

.input-group > .custom-file {
    position: relative;
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
    margin-bottom: 0;
}

.form-control-file {
    width: 100%;
    min-height: 33.19px;
    padding: 6px 15px;
    background: white;
    color: grey;
    transition: .3s;
    font-size: 13px;
    border-radius: 20px !important;
    border: 1px solid #cbb698 !important;
}

.custom-file-label {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1;
    height: calc(1.5em + 0.75rem + 1px);
    padding: 0.375rem 0.75rem;
    font-weight: 400;
    line-height: 1.5;
    color: #fff;
    background-color: #454545 !important;
    border: 0.125rem solid transparent !important;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    -moz-appearance: auto !important;
    appearance: auto !important;
    font-size: 13px;
}

.input-group-append {
    display: flex;
}

.input-group.a {
    width: 71%;
}

.deposit-btn {
    font-size: 12px;
    min-height: 30px;
    min-width: 100px;
}

.crazy_btn {
    min-width: 140%;
    color: #ffffff;
    font-size: 11px;
    font-weight: 500;
    border: none;
    height: 33px;
    background: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.hidden {
    display: none;
}

@keyframes moneyBtn-Animation {
    0% {
        -webkit-filter: drop-shadow(0 0 0#ffe43c);
        filter: drop-shadow(0 0 0#ffe43c);
    }

    to {
        -webkit-filter: drop-shadow(0-20px 0 transparent);
        filter: drop-shadow(0-20px 0 transparent);
    }
}

.style-add-amount input:checked ~ span, .style-add-amount input[type=radio]:focus ~ span {
    color: #ffe43c;
    border-color: #ffe43c !important;
    box-shadow: 0 0 2px #ffe43c8a;
    animation: moneyBtn-Animation .5s ease-in-out;
}

.style-add-amount {
    overflow: visible;
    display: inline-block;
    position: relative;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .style-add-amount span {
        position: relative;
        font-size: 13px;
        color: #bbb;
        border: 1px solid #aaa;
        transition: border-color 0.2s ease, color 0.3s ease, box-shadow 0.2s ease;
        border-radius: 3px;
        text-align: center;
        padding: 8px 12px;
        min-width: 85px;
        display: flex;
    }

    .style-add-amount input[type=radio]:checked ~ span:before {
        opacity: 1;
    }

    .style-add-amount input[type=radio] ~ span:before {
        opacity: 0;
    }

    .style-add-amount input[type=radio]:checked ~ span:after {
        opacity: 1;
    }

    .style-add-amount input[type=radio] ~ span:after {
        border-color: transparent transparent #ffe43c;
        opacity: 0;
    }

    .style-add-amount span:after {
        content: '';
        font-weight: 600;
        position: absolute;
        right: 0;
        bottom: 0;
        border-width: 0 0 15px 15px;
        border-style: solid;
        border-color: transparent transparent #aaa;
        transition: all 0.4s ease;
    }

    .style-add-amount span:before {
        content: '\f00c';
        font: var(--fa-font-solid);
        font-weight: 600;
        font-size: 10px;
        position: absolute;
        bottom: -2px;
        right: 0px;
        color: #272727;
        text-shadow: 0 0 1px #272727;
        line-height: 13px;
        z-index: 1;
    }

.select-group .col4 {
    grid-gap: 10px;
    grid-template-columns: repeat(auto-fill,calc((100% - 30px)/4));
    display: grid;
    grid-template-columns: 100;
    width: 100%;
}

.input-group.money {
    padding: 0 0 10px;
    display: flex;
    position: relative;
    flex-direction: column;
    font-size: 14px;
    background-color: #333;
    line-height: 1.5;
}

    .input-group.money label {
        position: absolute;
        z-index: 2;
        top: 22px;
        left: 6px;
        font-size: 18px;
        transform: translateY(-50%);
        color: #ffdf1a;
        justify-content: start;
        flex-direction: unset;
    }

    .input-group.money label {
        padding-left: 2px;
        overflow: hidden;
        line-height: 2;
        border: 1px solid transparent;
        top: 22px;
        background: transparent !important;
        left: 0px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .input-group.money .input-wrap {
        z-index: 1;
    }

        .input-group.money .input-wrap input {
            color: #ffdf1a;
            text-align: right;
            margin-top: 5px;
        }

            .input-group.money .input-wrap input:focus {
                outline: none;
            }

    .input-group.money input {
        box-sizing: border-box;
        width: 100%;
        height: 36px;
        padding: 0 5px;
        font-size: 18px;
        transition: background .3s;
        border: 0;
        font-weight: 300;
        background-color: #333;
        border-bottom: 1px solid #5e5e5b;
    }

.tips-info.note {
    margin: 0;
    margin-top: 10px;
}

.tips-info {
    position: relative;
    flex: 1;
    padding: 12px;
    border: 1px solid #0a3e2d;
    border-radius: 5px;
    background-color: #03120d;
    text-align: left;
    letter-spacing: 0.5px;
    white-space: normal;
}

    .tips-info.note h5 {
        display: flex;
        flex-flow: row nowrap;
        justify-content: flex-start;
        color: #fff;
        width: 100%;
        margin-bottom: 0;
        align-items: flex-start;
    }

    .tips-info.note span {
        color: #fff;
        font-size: 12px;
        line-height: 1.3;
    }

    .tips-info h5 span {
        display: inline-block;
        flex: 1;
        width: calc(100% - 50px);
        vertical-align: text-top;
    }



    .tips-info.note-history h5 p {
        width: auto;
        margin-right: 10px;
        padding-right: 10px;
        border-right: 1px solid #fff;
        display: inline-block;
        color: #fff;
        font-size: 13px;
        text-align: left;
    }

        .tips-info.note-history h5 p span {
            padding: 0 0.3125rem;
            color: #76bd6a;
            font-size: 1rem;
            letter-spacing: 1px;
            display: initial;
        }

    .tips-info i {
        font-size: 15px;
        width: 16px;
        height: 16px;
        margin: 0 10px 0 0;
        padding: 0 1px;
        color: #fff;
        font-weight: 700;
    }

.member-content {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
}

    .member-content .btn-submit {
        width: 100%;
        height: 41px;
        font-size: 14px;
        line-height: 41px;
        margin: 10px auto;
        position: relative;
        border-radius: 3px;
        color: #fff;
        background: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
        text-align: center;
    }

.qrpay-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: 70%;
    margin-bottom: 5px;
    align-items: flex-start;
    background: linear-gradient(to bottom,#14805e 0,#0a3e2d 100%);
    box-shadow: 0 1px 4px rgba(0,0,0,.5);
    padding: 6px;
    border-radius: 10px;
}

    .qrpay-container img {
        border-radius: 10px;
        width: 100%;
    }

.bankqr {
    width: 200px !important;
    height: auto;
    display: block;
    text-align: center;
    -webkit-box-shadow: 0 0 5px 0 #c7c7c7;
}

.submit_btn.qr {
    min-width: 42%;
    color: #ffffff;
    font-size: 11px;
    font-weight: 500;
    border: none;
    height: 30px;
    border-radius: 3px;
    background-image: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    margin: 1px 0;
    letter-spacing: 0.6px;
    transition: 0.3s;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

/** DEPOSIT CONTENT CLOSED **/

/** WITHDRAWAL CONTENT OPEN **/
.form-select {
    background-image: url(../images2/chevron-bottom.png) !important;
    background-size: 20px !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
}

/** WITHDRAWAL CONTENT CLOSED **/

/** PROFILE CONTENT CLOSED **/
.session-loader2.active {
    display: flex;
    animation: transTopnav 0.4s;
}

.session-loader2 {
    background: #111;
    overflow: auto;
    padding: 0;
}

.session-loader2 {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99;
}

@keyframes transTopnav {
    0% {
        transform: translateY(100%);
        opacity: 0;
    }

    100% {
        transform: translateY(0px);
        opacity: 1;
    }
}

@keyframes transTopnav2 {
    0% {
        transform: translateY(0px);
        opacity: 1;
    }

    100% {
        transform: translateY(100%);
        opacity: 0;
    }
}

.site-profile.pcustom-bg {
    padding: 10px;
    padding-top: 20px;
    background: linear-gradient(0deg, #111111 70%, transparent 90%);
}

.site-profile {
    display: flex;
    width: 100%;
    margin: auto;
}

    .site-profile.pcustom-bg:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 176px;
        background: url(../images2/member-header-bg.png) no-repeat;
        background-size: 100%;
        background-position: bottom center;
        z-index: -1;
    }

.sprofile-content {
    width: 100%;
    overflow: hidden;
}

.pheader-member {
    display: flex;
    padding: 10px 5px;
    margin-bottom: 20px;
}

    .pheader-member > img {
        width: 65px;
        height: 65px;
    }

.pheader-member-row {
    display: grid;
    margin: auto 0;
    padding: 0 10px;
}

    .pheader-member-row h5 {
        font-size: 15px;
    }

.pheader-vip-point {
    position: relative;
    display: flex;
    font-size: 12px;
    padding: 0 8px;
    background: #222;
    border-radius: 50px;
    line-height: 25px;
}

    .pheader-vip-point span {
        font-size: 13px;
        font-weight: 700;
        color: #39d89f;
        padding: 0 10px;
    }

    .pheader-vip-point a {
        display: inline-flex;
        color: #ffd77e;
        border-left: 1px solid #000;
    }

        .pheader-vip-point a:before {
            content: '';
            width: 1px;
            height: 100%;
            background: #333;
            margin-right: 10px;
        }

        .pheader-vip-point a:after {
            content: "\f101";
            font: var(--fa-font-solid);
            margin-left: 6px;
            font-size: 14px;
            line-height: 130%;
            color: #bbb;
            font-weight: 900;
            margin-top: 3px;
        }

.pheader-leftnav {
    width: 100%;
}

.pheader-content {
    display: grid;
    width: 100%;
}

.pheader-group {
    position: relative;
    background: #333;
    border-radius: 3px;
    margin-bottom: 10px;
}

.pheader-balance {
    display: flex;
    padding: 5px 10px;
    min-height: 30px;
    width: 100%;
}

.pheader-wallet {
    font-size: 13px;
    display: flex;
    color: #26ffbc;
    line-height: 20px;
    margin: auto 0;
}

.wallet-amount {
    letter-spacing: 0.2px;
    font-size: 15px;
}

    .wallet-amount.lastply {
        font-size: 14px;
    }

.icon2-refresh {
    font-size: 12px;
    margin: auto;
    margin-left: 5px;
    /*width: 20px;*/
    /*height: 20px;*/
    transition: all 0.3s ease;
    cursor: pointer;
    background-repeat: no-repeat;
    line-height: 0;
}

    .icon2-refresh img {
        animation: reneWallet 1s linear;
    }

    .icon2-refresh.active {
        -webkit-animation: rotate 0.8s normal linear infinite;
        animation: rotate 0.8s normal linear infinite;
    }

@keyframes rotate {
    0% {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 0deg);
    }

    100% {
        -webkit-transform: rotate3d(0, 0, 1, 360deg);
        transform: rotate3d(0, 0, 1, 360deg);
    }
}

.pheader-total {
    position: relative;
    overflow: hidden;
    height: 30px;
    margin: auto;
    margin-right: 0;
}

    .pheader-total ul {
        height: 30px;
        transition: all 0.3s ease;
    }

        .pheader-total ul li {
            color: #ffdf1a;
            font-size: 14px;
            font-family: Helvetica,Tahoma,sans-serif;
            min-width: max-content;
            height: 30px;
            line-height: 30px;
            padding: 0 10px;
            text-align: right;
        }

@keyframes rotate360 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.pheader-nav {
    display: grid;
}

.pheader-nav-title {
    padding: 8px 10px;
    border-bottom: 1px solid #505050;
}

    .pheader-nav-title h4 {
        font-size: 14px;
        padding-left: 8px;
        margin: 0;
        line-height: 120%;
        border-left: 4px solid #14805e;
    }

.pheader-nav-list ul {
    display: flex;
}

.pheader-nav-list.a ul {
    flex-wrap: wrap;
}

    .pheader-nav-list.a ul li {
        width: 123px;
    }

.pheader-nav-list ul li {
    width: 100%;
}

.sidenav-button {
    position: relative;
    display: grid;
    width: 100%;
    padding: 5px;
}

.red {
    color: #ff5c5c !important;
}

.sidenav-icon {
    position: relative;
    border-radius: 50%;
    background: #4a4a4a;
    transition: background-color 0.3s ease;
    margin: 5px auto;
    width: 35px;
    height: 35px;
}

    .sidenav-icon.ic-deposit:before {
        background: url(../images2/deposit.png);
    }

    .sidenav-icon.ic-withdraw:before {
        background: url(../images2/withdrawal.png);
    }

    .sidenav-icon.ic-wallet:before {
        background: url(../images2/wallet.png);
    }

    .sidenav-icon.ic-friend:before {
        background: url(../images2/friend.png);
    }

    .sidenav-icon.ic-transaction:before {
        background: url(../images2/transaction-record.png);
    }

    .sidenav-icon.ic-member:before {
        background: url(../images2/member.png);
    }

    .sidenav-icon.ic-password:before {
        background: url(../images2/password.png);
    }

    .sidenav-icon.ic-friend:before {
        background: url(../images2/friend.png);
    }

    .sidenav-icon.ic-whatsapp:before {
        background: url(../images2/whatsapp1.png);
    }

    .sidenav-icon.ic-email:before {
        background: url(../images2/email.png);
    }

    .sidenav-icon.ic-facebook:before {
        background: url(../images2/facebook1.png);
    }

    .sidenav-icon.ic-telegram:before {
        background: url(../images2/telegram-channel1.png);
    }

    .sidenav-icon.ic-twitter:before {
        background: url(../images2/twitter.png);
    }

    .sidenav-icon.ic-youtube:before {
        background: url(../images2/youtube1.png);
    }

    .sidenav-icon.ic-pinterest:before {
        background: url(../images2/pinterest1.png);
    }

    .sidenav-icon.ic-vip:before {
        background: url(../images2/vip.png);
    }

    .sidenav-icon.ic-betting:before {
        background: url(../images2/bet-record.png);
    }

    .sidenav-icon:before {
        content: '';
        position: relative;
        display: block;
        background-repeat: no-repeat !important;
        background-size: contain !important;
        background-position: center !important;
        transition: filter 0.4s ease;
        width: 100%;
        height: 100%;
        margin: auto;
        z-index: 1;
    }

    .sidenav-icon:after {
        content: '';
        position: absolute;
        bottom: 20%;
        right: 12%;
        width: 36%;
        height: 36%;
        background: #5dadff;
        border-radius: 50%;
    }

.sidenav-button.red .sidenav-icon:after {
    background-color: #ff3c3c;
}

.sidenav-button span {
    color: #fff;
    font-size: 11px;
    margin: auto 5px;
    text-align: center;
    transition: color 0.4s ease;
    margin-bottom: 3px;
    line-height: 120%;
}

.sidenav-button.orange .sidenav-icon:after {
    background-color: #ff9f5d;
}

.invert > ul li a .sidenav-icon:before {
    filter: invert(1);
}

.sidenav-button.purple .sidenav-icon:after {
    background-color: #898afd;
}

.account-nav {
    position: relative;
    display: grid;
    width: 100%;
    padding: 5px;
}

    .account-nav i {
        font-size: 16px;
        border-radius: 50%;
        padding: 12px;
        display: flex;
        align-items: center;
        text-align: center;
        justify-content: center;
        position: relative;
        background: #4a4a4a;
        transition: background-color 0.3s ease;
        margin: 5px auto;
        width: 40px;
        height: 40px;
    }

    .account-nav span {
        color: #fff;
        font-size: 11px;
        margin: auto 5px;
        text-align: center;
        transition: color 0.4s ease;
        margin-bottom: 3px;
        line-height: 120%;
        letter-spacing: 0.5px;
    }

    .account-nav i:after {
        content: '';
        position: absolute;
        bottom: 20%;
        right: 12%;
        width: 36%;
        height: 36%;
        background: #5dadffa8;
        border-radius: 50%;
    }

    .account-nav.rd i:after {
        background: #ff020273;
    }

    .account-nav.yl i:after {
        background: #ff9800a8;
    }

    .account-nav.purple i:after {
        background: #898afd9c;
    }

.pheader-logout {
    display: inline-block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 13px;
    text-align: center;
}

    .pheader-logout img {
        width: 20px;
        height: 20px;
        margin-top: -2px;
        margin-right: 5px;
    }

/** PROFILE CONTENT CLOSED **/

/** PAYMENT ACCOUNT CONTENT OPEN **/
.badge-success {
    background-color: #28d094;
    padding: 8px;
}

.badge-failed {
    background-color: #dc3545;
    padding: 8px;
}

.badge-processing {
    background-color: #2799ff;
}

.badge-pending {
    background-color: #6c757d;
    padding: 8px;
}

.badge-submit {
    background-color: #ffac07;
    padding: 8px;
}

.dataTables_wrapper .dataTables_filter input, .dataTables_wrapper .dataTables_length select {
    border: 1px solid #aaa;
    border-radius: 3px;
    padding: 5px;
    background-color: #2a2828;
    margin-left: 3px;
}

.dataTables_length {
    font-size: 13px;
}

/*table.dataTable thead > tr > th.sorting {
    font-size: 12px;
    color: white;
}*/

.dataTables_filter {
    font-size: 13px;
}

    .dataTables_filter label {
        color: #26ffbc;
    }

.dataTables_length select {
    color: turquoise;
}

.dataTables_filter input {
    color: turquoise;
}

.dataTables_wrapper .dataTables_filter input:focus-visible {
    outline: 2px solid rgba(20,128,94,.4);
}

.vip_benefits {
    padding-left: 15px;
    padding-right: 15px;
}

    /*table.dataTable.no-footer {
    border-bottom: 1px solid #12805d !important;
    margin-top: 10px;
}*/

    .vip_benefits table thead {
        background-color: #12805d;
    }

    .vip_benefits table tbody tr td {
        padding: 10px;
        font-size: 11px;
        letter-spacing: 0.4px;
        text-align: center;
    }

    .vip_benefits table thead tr th {
        text-align: center;
    }

    .vip_benefits table tfoot {
        font-size: 12px;
    }

    .vip_benefits table {
        border: 2px solid #12805d;
        color: #fff;
    }

.dataTables_wrapper .dataTables_info {
    font-size: 12px;
    color: #fff !important;
}

.vipdetails_btn {
    min-width: 87px;
    color: #fff;
    min-height: 32px;
    border-radius: 3px;
    font-size: 12px;
    background: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    font-weight: 700;
    display: inline-flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    border: none;
    position: relative;
    left: 29px;
    bottom: 4px;
}

.downlinetable {
    padding: 5px;
    text-align: center;
    width: 100%;
    margin-top: 20px;
    border-collapse: collapse;
    color: black;
}

.dataTables_wrapper .dataTables_paginate, .dataTables_wrapper .dataTables_paginate {
    font-size: 13px !important;
    color: white !important;
}

#gamelogtable_previous {
    color: white !important;
}

#gamelogtable_paginate .paginate_button.current {
    color: black !important;
    background: white;
    background-position: 50%0;
    background-size: 200%;
    font-size: 10px;
    width: 40px;
}

#gamelogtable_next {
    color: white !important;
}

.dataTables_length td {
    color: #fff;
}

.col-form-label.c b {
    color: black;
}

.form-control.a {
    color: black;
    border: 1px solid #544f4f;
    background-color: white !important;
}

.afterloginform .title {
    color: #26ffbc;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.vipdetails_btn.btn_transfer.rewards {
    left: 0px;
    padding: 5px 10px;
}

button.btn-redeem {
    width: 100%;
    color: #fff;
    border-radius: 3px;
    font-size: 12px;
    background: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    font-weight: 700;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    border: none;
    position: relative;
    padding: 5px;
}

.redeem-flex {
    display: flex;
    justify-content: left;
    position: relative;
}

/** PAYMENT ACCOUNT CONTENT CLOSED **/

/** TRANSACTION CONTENT OPEN **/

.afterlogin_deposit.rr.nav .nav-item .nav-link {
    min-width: 150px;
}

.afterlogin_deposit.nav .nav-item .nav-link.active {
    background: linear-gradient(to right,#fbc103 0,#f79604 15%,#f79604 30%,#fbc103 55%,#fbc103 100%);
    color: #ffffff;
    height: 29px;
    border: none;
}

.afterlogin_deposit.nav .nav-item .nav-link {
    border-radius: 3px;
    text-align: center;
    background: #494949;
    color: white;
    height: 29px;
    border: 1px solid transparent;
    font-size: 10px;
    text-transform: uppercase;
    padding: 0 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: 12px;
}

.afterlogin_deposit.nav.nav-tabs .nav-item {
    display: flex;
    justify-content: center;
    align-items: center;
}

.afterlogin_deposit.nav.nav-tabs {
    justify-content: center;
    border: none;
}

#dataTable2_previous {
    color: white !important;
}

#dataTable2_next {
    color: white !important;
}

#dataTable_next {
    color: white !important;
}

#dataTable_previous {
    color: white !important;
}

#dataTable2_paginate .paginate_button.current {
    color: black !important;
    background: white;
    background-position: 50%0;
    background-size: 200%;
    font-size: 10px;
    width: 40px;
}

#dataTable_paginate .paginate_button.current {
    color: black !important;
    background: white;
    background-position: 50%0;
    background-size: 200%;
    font-size: 10px;
    width: 40px;
}

.vip_benefits.a {
    overflow: auto;
    display: inline-grid;
}

/** TRANSACTION CONTENT CLOSED **/

/** MYREWARDS CONTENT OPEN **/
.text-right {
    text-align: right;
}
/** MYREWARDS CONTENT CLOSED **/

/** PROFILE CONTENT OPEN **/
.player-vip-1v1 {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    height: auto;
    padding: 15px 15px 1px;
}

    .player-vip-1v1 .player-info-vip {
        display: flex;
        position: relative;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        width: 100%;
        height: 126px;
        border-radius: 11px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }

        .player-vip-1v1 .player-info-vip .member-pic {
            background: none;
            box-shadow: none;
            position: absolute;
            display: block;
            border-radius: 100%;
            top: 64px;
            width: 91px;
            height: 84px;
            z-index: 1;
        }

            .player-vip-1v1 .player-info-vip .member-pic .item-icon {
                position: absolute;
                width: 100%;
                height: 100%;
                top: 0;
                left: 0;
                border-radius: 100%;
                background-repeat: no-repeat;
                background-size: contain;
            }

        .player-vip-1v1 .player-info-vip .item-icon {
            box-shadow: none;
        }

        .player-vip-1v1 .player-info-vip .member-label {
            display: block;
            position: absolute;
            top: 0;
            right: 0;
            width: 59px;
            height: 60px;
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
        }

    .player-vip-1v1 .membername-wrap {
        display: flex;
        position: relative;
        align-items: center;
        justify-content: center;
        padding: 29px 0 0;
    }

        .player-vip-1v1 .membername-wrap .membername {
            width: fit-content;
            font-size: 16px;
            color: #bdbdbd;
            margin-right: 4px;
            word-break: break-all;
        }

        .player-vip-1v1 .membername-wrap .level {
            width: fit-content;
            text-align: center;
            font-size: 12px;
            padding: 3px;
            margin-left: 3px;
            background: linear-gradient(105deg,#C8C3B2 2%,#80795A 100%);
            border-radius: 4px;
            color: #fff;
        }

.vip-area-group {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 31px;
}

    .vip-area-group .left-box {
        position: relative;
        width: 50%;
        height: 29px;
        border-right: 1px dotted #bdbdbd;
    }

    .vip-area-group .item {
        display: flex;
        position: relative;
        align-items: center;
        width: 100%;
    }

    .vip-area-group .item {
        display: flex;
        position: relative;
        align-items: center;
        width: 100%;
    }

        .vip-area-group .item h3 {
            color: #fff;
            font-size: 14px;
            margin: 0;
        }

        .vip-area-group .item .points-number {
            flex: 1;
            color: #39d89f;
            font-size: 24px;
            text-align: center;
        }

    .vip-area-group .right-box {
        display: flex;
        position: relative;
        align-items: center;
        justify-content: flex-end;
        width: 50%;
        height: 100%;
    }

        .vip-area-group .right-box .goto-myvip {
            display: flex;
            position: relative;
            align-items: center;
            justify-content: center;
            width: 155px;
            height: 55px;
            right: -15px;
            /*margin-right: -85px;*/
            background-image: linear-gradient(270deg,#2FB19E 0%,#19916b 100%);
        }

            .vip-area-group .right-box .goto-myvip:before {
                content: "";
                display: block;
                position: absolute;
                left: 0;
                width: 0;
                height: 0;
                border-width: 10px 0 10px 10px;
                border-style: solid;
                border-color: transparent transparent transparent #333333;
            }

.myvip-text {
    color: #fff;
    font-size: 15px;
    z-index: 1;
    position: relative;
    right: 17px;
}

    .myvip-text:after {
        content: "\f101";
        font: var(--fa-font-solid);
        margin-left: 6px;
        font-size: 17px;
        line-height: 130%;
        color: white;
        font-weight: 900;
        margin-top: 3px;
    }

.tips-info .title-box {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 2px;
}

.verify-tips ol {
    padding-top: 10px;
    border-top: 1px dotted #0a3e2d;
    padding-left: 0;
    list-style: none;
    margin-bottom: -5px;
}

.tips-info ol {
    display: block;
    width: 100%;
    color: #fff;
    line-height: 1.5;
    text-align: left;
}

.personal-info {
    position: relative;
    padding: 4px;
}

.verify-tips a {
    display: block;
    width: 100%;
}

.tips-info a {
    text-decoration: none;
}

.personal-info label {
    color: #70b267;
}

.verify-tips label {
    display: block;
    margin-bottom: 3px;
    font-size: 13px;
    font-weight: 700;
}

.personal-info label:before {
    background: #70B267;
}

.verify-tips label:before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 16px;
    margin-right: 7px;
    border-radius: 3px;
    vertical-align: sub;
}

.personal-info ul {
    padding-left: 7px;
}

.tips-info ul {
    display: block;
    width: 100%;
    color: #fff;
    font-size: 12px;
    line-height: 1.5;
    text-align: left;
}

.title-box.a h5 span {
    font-size: 12px;
}

.tips-info.a {
    margin: 14px;
}

.personal-info li, .contact-info li {
    background: #70B267;
    display: inline-block;
    margin: 0 10px 8px 0;
    padding: 0 8px;
    border-radius: 10px;
    color: #212b44;
    vertical-align: middle;
}

.verify-tips ol > li:last-child {
    margin-bottom: 0;
}

.contact-info label {
    color: #409fff;
}

    .contact-info label:before {
        background: #409FFF;
    }

.contact-info li {
    background: #409FFF;
}

.contact-info {
    position: relative;
    padding: 3px;
}

    .contact-info ul {
        padding-left: 7px;
    }

.area-group {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    height: auto;
    padding: 10px 0;
    background-color: #333;
    font-size: 12px;
    line-height: 2;
}

    .area-group .item {
        display: flex;
        position: relative;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
    }

        .area-group .item h3 {
            flex: 1;
            overflow: hidden;
            color: #fff;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 12px;
        }

        .area-group .item .tip {
            display: flex;
            flex: 1;
            justify-content: flex-end;
            color: #999;
            font-size: 10px;
        }

    .area-group .text {
        color: #ff7e00;
        word-break: break-all;
    }

.input-group.personal-phone-group {
    display: flex;
    position: relative;
    flex-direction: column;
    padding-bottom: 10px;
    font-size: 13px;
    background-color: #333;
    line-height: 1.5;
}

    .input-group.personal-phone-group label {
        position: relative;
        padding-left: 1px;
        overflow: hidden;
        color: #fff;
        line-height: 2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.personal-phone-group .add-btn {
    /*position: static;*/
    margin-left: 3px;
    vertical-align: sub;
}

.add-btn {
    display: inline-flex;
    align-items: center;
    position: absolute;
    padding: 0 3px;
    background: #28B849;
    font-size: 12px;
    color: #fff;
    border-radius: 3px;
    line-height: 1.2;
}

.add-btn-icon {
    position: relative;
    width: 18px;
    height: 21px;
}

    .add-btn-icon:after {
        transform: translate(-50%,-50%) rotate(90deg);
    }

    .add-btn-icon:before, .add-btn-icon:after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        width: 3px;
        height: 11px;
        border-radius: 3px;
        background: #ffffff;
    }

    .add-btn-icon:after {
        transform: translate(-50%,-50%) rotate(90deg) !important;
    }

.add-btn span {
    padding-right: 6px;
}

.input-group .input-wrap {
    position: relative;
}

.input-group.personal-phone-group .default:disabled {
    border-bottom: 0;
    border-radius: 3px;
    background-color: #027aff1a;
}

.input-group.personal-phone-group input {
    width: 100%;
    height: 41px;
    padding: 0 10px;
    transition: background .3s;
    border: 0;
    color: #fff;
    font-weight: 300;
}

.input-group.personal-phone-group .default {
    border-left: 1px solid #027AFF;
}

.input-group .input-wrap .status.unconfirm-btn {
    color: #ffae12;
    text-decoration: underline;
}

.input-group.personal-phone-group .input-wrap .status {
    position: absolute;
    top: 0;
    right: 0;
    padding: 14px 10px;
    font-size: 12px;
}

.input-group .input-wrap .status.unconfirm-btn:before {
    content: "";
    display: inline-block;
    width: 13px;
    height: 13px;
    margin-right: 4px;
    background-image: url(../images2/icon-unconfirm.png);
    background-repeat: no-repeat;
    background-position: 100% 100%;
    background-size: contain;
    bottom: -2px;
    position: relative;
}

.cancel-right {
    position: fixed;
    font-size: 21px;
    padding: 1rem 1rem;
    display: flex !important;
    right: 0;
    z-index: 1;
}

.pop-get-vcode .menu-box {
    padding: 11px;
    background: transparent;
    box-shadow: none;
    margin-bottom: -15px;
}

.pop-get-vcode .input-group {
    background: #333333;
    display: flex;
    position: relative;
    flex-direction: column;
    padding-bottom: 15px;
    font-size: 14px;
    line-height: 1.5;
}

    .pop-get-vcode .input-group label {
        position: relative;
        padding-left: 2px;
        overflow: hidden;
        color: #fff;
        line-height: 2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.pop-get-vcode .phone-area-code1 {
    flex: 0 0 20%;
    margin-right: 5px;
}

.lang-select {
    position: relative;
    font-size: 12px;
}

.pop-get-vcode .btn-select li {
    padding-bottom: 0;
    float: left;
    list-style: none;
}

.pop-get-vcode .phone-area-code1 .btn-select span {
    margin: 0;
}

.phone-wrap {
    display: flex;
    flex-flow: row nowrap;
}

.pop-get-vcode .input-group input, .pop-get-vcode .input-group textarea {
    box-sizing: border-box;
    width: 100%;
    height: 44px;
    padding: 0 11px;
    transition: background .3s;
    border: 0;
    border-radius: 3px;
    background-color: #292929;
    color: #14805e;
    font-weight: 300;
    outline: none;
}

.pop-get-vcode .input-group textarea {
    padding-top: 10px;
}

.pop-get-vcode .input-group .input-wrap .status {
    position: absolute;
    top: 0;
    right: 0;
    padding: 14px 10px;
    color: #28b849;
    font-size: 12px;
    text-decoration: none;
}

    .pop-get-vcode .input-group .input-wrap .status.get-vcode-btn span {
        padding: 3px 6px;
        border-radius: 10px;
        background: #FFAE12;
        color: #fff;
    }

.input-group.personal-phone-group .input-wrap .status1 {
    position: absolute;
    top: 0;
    right: 0;
    padding: 14px 10px;
    color: #28b849;
    font-size: 12px;
    text-decoration: none;
}

.input-group.personal-phone-group input {
    border-bottom: 1px solid rgba(153,153,153,.3);
    border-radius: 0;
    background: none;
}

.input-group.personal-phone-group .input-wrap .status.save-btn {
    color: #ffae12;
    text-decoration: underline;
}

.member-menu-point {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    margin: 0 auto 10px;
    padding: 8px 25px;
    text-align: center;
    padding-bottom: 80px;
}

    .member-menu-point i {
        position: relative;
        display: flex;
        flex-shrink: 0;
        width: 34px;
        height: 35px;
        margin-right: 10px;
    }

    .member-menu-point p {
        display: block;
        max-width: 75%;
        color: #fff;
        font-size: 12px;
        line-height: 1.5;
        text-align: start;
    }

        .member-menu-point p .cont-cust {
            color: #ff7e00;
        }

    .member-menu-point i .item-icon {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        width: 100%;
        height: 100%;
        background-repeat: no-repeat;
        background-position: 60%;
        background-size: 100%;
        z-index: 2;
    }

.group-item .title {
    color: #26ffbc;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.group-item .required {
    color: #ff4242;
}

.date-pick {
    display: flex;
}

    .date-pick button {
        flex-basis: 25%;
        min-height: 30px;
        background: #292929;
        align-items: center;
        justify-content: center;
        display: flex;
        font-size: 13px;
        border-radius: 3px;
        color: #ffffff;
        word-break: break-word;
        padding: 0.1rem;
        width: 100%;
    }

        .date-pick button:focus {
            color: white;
            background: #14805e;
            box-shadow: 0 0 5px 3px rgb(21 255 101 / 25%);
        }


.date-select .input-box {
    width: 100%;
    position: relative;
}

    .date-select .input-box label {
        width: 100%;
    }

.input-group-text.middle {
    color: #ffffff;
    background-color: transparent;
    border: 1px solid transparent;
    font-size: 12px;
}

.react-datepicker-wrapper {
    display: inline-block;
    padding: 0;
    border: 0;
    width: 100%;
}

.date-select .input-box .react-datepicker__input-container {
    position: relative;
    display: inline-block;
    width: 100%;
}

.date-select .group {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.date-select .input-box i {
    position: absolute;
    top: 54%;
    right: 10%;
    transform: translateY(-50%);
    cursor: pointer;
    width: 0.6rem;
    height: 0.6rem;
}

.date-select input {
    font-size: 13px;
    width: 100%;
    color: white;
    height: 100%;
    border: none;
    transition: border .3s,background .3s;
    padding: 0.26rem 0.26rem 0.26rem 0.5rem;
    border-radius: 0.2rem;
    background: #292929;
    color-scheme: dark;
}

    .date-select input:focus {
        outline: 1px solid #ffe43c;
    }

.date-select .group span {
    text-align: center;
}

.icon-date {
    background-image: url(../images2/date.png);
    display: inline-block;
    background-size: 100% 100%;
}

.transaction_history .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgb(53 63 62);
    border-radius: 0.25rem;
}

.card-header:first-child {
    border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
}

.banking-card-header {
    background-image: linear-gradient(to bottom, #14805e 0%, #12644a 100%);
    color: #ffffff;
    font-weight: 700;
    border-left: 2px solid #618784;
    font-size: 13px;
    height: 33px;
    text-align: center;
}

.accordion-flush .accordion-item .accordion-button {
    background: #353434;
    color: white;
    outline: none;
}

.accordion-button {
    background: #494949;
    color: white;
    font-size: 12px;
}

    .accordion-button:focus {
        border-color: #485251;
        box-shadow: 0 0 2px 2px #00971d;
    }

    .accordion-button:not(.collapsed)::after {
        background-image: white;
    }

.accordion-body {
    color: white;
    font-size: 12px;
    display: grid;
    row-gap: 6px;
}

.accordion-item {
    background: #494949;
    color: white;
}

.accordion-flush .accordion-item .accordion-button {
    border: 1px solid #0d5841;
}

.badge {
    --bs-bg-opacity: 1;
    display: inline-block;
    padding: 7px 10px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 5px;
    --bs-bg-opacity: 1;
}

.accordion-button::after {
    filter: grayscale(1) invert(1) !important;
}

.accordion-button.hid::after {
    display: none;
}


/** PROFILE CONTENT CLOSED **/

/** RESET PASSWORD CONTENT OPEN **/
.signup-form .sprofile-tips {
    margin: 5px 0;
}

.sprofile-tips {
    display: block;
    border: 1px solid #7293e1;
    background-color: rgba(114,147,225,.4);
    border-radius: 5px;
    padding: 10px;
}

    .sprofile-tips p {
        display: flex;
        font-size: 12px;
        line-height: 150%;
        margin: 0;
        color: #26ffbc;
    }

        .sprofile-tips p:first-child:before {
            content: "\f05a";
            font: var(--fa-font-solid);
            font-weight: 900;
            font-size: 16px;
            margin: auto 0;
            margin-right: 8px;
            line-height: 100%;
        }

    .sprofile-tips ol {
        font-size: 13px;
        line-height: 150%;
        margin-bottom: 5px;
        padding-left: 30px;
    }
/** RESET PASSWORD CONTENT CLOSED **/

/** REFERRAL CONTENT OPEN **/

.modal-body.black {
    background: #000;
}

.referral-reward.reward-icon {
    margin-top: 40px;
    padding-top: 50px;
}

.referral-reward {
    position: relative;
    display: grid;
    background: #3e3e3e;
    padding: 15px;
    margin: 0 15px;
    border-radius: 15px;
}

    .referral-reward.reward-icon:before {
        content: '';
        position: absolute;
        top: -25px;
        left: calc(50% - 30px);
        width: 60px;
        height: 60px;
        background: url(../images2/icon-rf-gift.png) center no-repeat, #14805E;
        background-size: 100% 120%;
        background-position: -20% 0;
        border-radius: 50%;
    }

.referral-reward-left {
    width: 100%;
}

.sprofile-referral {
    margin: 0;
    margin-bottom: 25px;
    width: 100%;
    display: inline-block;
}

    .sprofile-referral label {
        font-size: 13px;
        margin-bottom: 3px;
        color: white;
    }

.btn-share {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    background: #FFDE1A;
    border-radius: 3px;
    font-size: 14px;
    color: #000;
    margin-left: 10px;
}

.sprofile-copycode {
    display: flex;
}

    .sprofile-copycode input {
        height: 25px;
        font-size: 12px;
        width: 86%;
        border: none;
        background: #222;
        border-radius: 3px 0 0 3px;
        color: #fff;
        padding: 0 20px;
        outline: none;
    }

    .sprofile-copycode button {
        display: flex;
        background: #FFDE1A;
        background-position: 100%0;
        background-size: 200%;
        border-radius: 0 3px 3px 0;
        width: 50px;
        height: 25px;
        min-width: unset;
        padding: 0;
        margin: 0;
        border: none;
    }

.btn-css3 {
    color: #fff;
    border-radius: 3px;
    min-width: 100px;
    background: linear-gradient(to right,#3356cd 0,#5471d5 15%,#5471d5 30%,#3356cd 55%,#3356cd 100%);
    background-position: 50%0;
    background-size: 200%;
    box-shadow: 0 5px 10px 0 rgba(30,52,124,.1),inset 0 0 3px 0#859ae1;
    text-shadow: 0 0 2px #1e20b3;
    transition: box-shadow .5s ease-out .1s,background-position .3s ease-in,text-shadow .3s ease-in .1s;
}

.sprofile-copycode button:before {
    content: '';
    width: 18px;
    height: 17px;
    margin: auto;
    background: url(../images2/icon-copy.png) no-repeat;
    background-size: contain;
    filter: invert(1);
}

.primary-app {
    background-color: #5f5e5e;
    border-color: #4f4f4f;
    box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
    transition: 0.3s;
}

    .primary-app i {
        padding-left: 10px;
    }

.yellow--text {
    color: white;
    font-size: 14px;
    font-weight: 600;
    border-radius: 5px;
    padding: 5px;
}

.detail-card {
    box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
    padding: 10px;
    border-radius: 5px;
    background-color: #3d3d3f;
    border-color: #3a3a3b;
}

.v-card__text {
    min-height: 60px;
}

.detail-card hr {
    margin: 0;
    color: #747372;
    height: 2px;
}

.detail-card-title {
    padding: 20px;
    font-weight: 600;
    font-size: 13px;
    color: white;
}

.v-card__text .detail {
    padding: 20px;
    color: white;
    font-weight: 500;
    font-size: 13px;
}

.vip-contentwrap.r {
    padding: 0px 16px 0;
}

.vip2.r.carousel .carousel-inner .carousel-control-next, .vip2.r.carousel .carousel-inner .carousel-control-prev {
    top: 0;
}

.concon {
    display: flex;
    justify-content: center;
    padding-left: 30px;
    padding-right: 30px;
}

.label {
    padding: 5px;
    color: white;
    font-size: 13px;
    font-weight: 700;
    padding-left: 21px;
}

.vip2.carousel .carousel-inner {
    margin-bottom: 20px;
}

.vip-contentwrap {
    width: 100%;
}

.card-body {
    position: relative;
    width: 100%;
    padding-right: 30px;
    padding-left: 30px;
}

.vip2.carousel .carousel-inner .carousel-control-prev, .vip2.carousel .carousel-inner .carousel-control-next {
    margin: 0px -15px;
}

.referral-flex {
    display: flex;
    justify-content: left;
    gap: 5px;
    position: relative;
    right: 30px;
    padding-top: 20px;
}

.downline-head {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: black;
    font-size: 14px;
    font-weight: 700;
}

.downlinetable .title.a {
    font-size: 12px;
}

.downlinetable .title.b {
    font-size: 12px;
    background-color: #12805d;
    color: white;
    border: none;
}

.table > :not(:first-child) {
    border-top: none !important;
}

.emptytable {
    margin-left: auto;
    border: none;
    margin-bottom: 13px;
    color: black;
}

.submit_btn.qr.a {
    position: relative;
    height: 35px;
    margin: auto;
}

/** REFERRAL CONTENT CLOSED **/

/** REFERRAL BEFORE LOGIN CONTENT **/

.referral-wrap {
    display: block;
    position: inherit;
    inset: 0;
    overflow-x: hidden;
    overflow-y: auto;
    transition: cubic-bezier(.075,.82,.165,1);
}

.content.player-full-content {
    min-height: auto;
    padding-top: 0;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.referral-program-head {
    padding-top: 0px;
}

.referral-program-promotion-banner {
    padding-bottom: 70%;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.referral-program-promotion-banner_logo {
    width: 55px;
    position: absolute;
    left: 0;
    right: 0;
    top: 20px;
    margin: 0 auto;
}

    .referral-program-promotion-banner_logo img {
        width: 100%;
    }

.referral-program-promotion-banner_title {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50px;
}

    .referral-program-promotion-banner_title .title1 {
        display: block;
        white-space: nowrap;
        text-align: center;
        text-shadow: 0vw 0.5333333333vw 1.0666666667vw #000;
        font-size: 20px;
        line-height: 1;
        font-weight: 900;
    }

    .referral-program-promotion-banner_title .title2.yellow {
        display: block;
        white-space: nowrap;
        text-align: center;
        text-shadow: 0vw 0.5333333333vw 1.0666666667vw #000;
        font-size: 20px;
        line-height: 1;
        font-weight: 900;
        color: #ffde1a;
    }

.referral-program-promotion-banner_img {
    position: absolute;
    /* padding-bottom: 100%; */
    width: 100%;
    top: 0;
}

    .referral-program-promotion-banner_img img {
        position: absolute;
        top: -50px;
        width: 100%;
    }

.referral-program-body {
    padding: 7px;
    position: relative;
    z-index: 55;
    margin-top: -37px;
}

.referral-program-promotion-panel {
    background-color: #333;
    box-shadow: 0 2px 4px #00000080;
    border: 1px solid #666;
    padding: 15px 10px;
    border-radius: 3px;
}

    .referral-program-promotion-panel .reward-title {
        font-weight: 700;
        font-size: 15px;
        color: #fff;
        text-align: center;
        line-height: normal;
    }

    .referral-program-promotion-panel .content {
        margin-top: 10px;
        padding: 10px;
    }


        .referral-program-promotion-panel .content .reward-desc {
            color: #b5b5b5;
            font-size: 12px;
            line-height: 1.429;
        }

        .referral-program-promotion-panel .content .sub-heading {
            margin-top: 10px;
            font-size: 13px;
            font-weight: 700;
            color: #ffde1a;
        }

        .referral-program-promotion-panel .content .tier-block {
            position: relative;
            display: flex;
            vertical-align: bottom;
            width: 100%;
            margin-top: 10px;
        }

            .referral-program-promotion-panel .content .tier-block .reward-tier {
                position: relative;
                z-index: 2;
            }

                .referral-program-promotion-panel .content .tier-block .reward-tier .cont {
                    position: relative;
                    padding-bottom: 5px;
                }

                    .referral-program-promotion-panel .content .tier-block .reward-tier .cont:before {
                        content: "";
                        display: block;
                        position: absolute;
                        right: 0;
                        bottom: 0;
                        background-color: #ffde1a;
                        width: 12px;
                        height: 12px;
                        border-radius: 50%;
                        box-shadow: 0 0 1.0666666667vw 1.0666666667vw #14805e;
                        border: 0.2666666667vw solid #14805E;
                    }

                    .referral-program-promotion-panel .content .tier-block .reward-tier .cont:after {
                        content: "";
                        display: block;
                        width: 100%;
                        height: 1px;
                        background: linear-gradient(90deg,rgba(255,255,255,0) 0%,#09C58A 100%);
                        margin-top: 1.8666666667vw;
                    }


                    .referral-program-promotion-panel .content .tier-block .reward-tier .cont .title {
                        font-size: 13px;
                        color: white;
                        font-weight: 500;
                    }

                    .referral-program-promotion-panel .content .tier-block .reward-tier .cont .title-percentage {
                        font-size: 13px;
                        display: flex;
                        gap: 5px;
                        align-items: center;
                        letter-spacing: 0.4px;
                    }

                        .referral-program-promotion-panel .content .tier-block .reward-tier .cont .title-percentage .number {
                            font-size: 17px;
                            font-weight: 700;
                            color: #ffde1a;
                            line-height: 1.5;
                            vertical-align: text-bottom;
                        }

                        .referral-program-promotion-panel .content .tier-block .reward-tier .cont .title-percentage span {
                            font-size: 12px;
                            font-weight: 700;
                            color: #b5b5b5;
                            line-height: 1.5;
                            vertical-align: text-bottom;
                        }


            .referral-program-promotion-panel .content .tier-block .referral-chart {
                width: 100%;
                display: flex;
                margin-top: 30px;
                min-width: 140px;
                max-width: 175px !important;
                position: relative;
                align-items: center;
                justify-content: center;
            }

                .referral-program-promotion-panel .content .tier-block .referral-chart .w {
                }

                .referral-program-promotion-panel .content .tier-block .referral-chart .chart-img {
                    width: 30px;
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: 0;
                    margin: 0 auto;
                    z-index: 2;
                }

                .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart {
                    position: absolute;
                    left: 0;
                    right: 0;
                    top: 0;
                    margin: 0 auto;
                }

                    .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart.first {
                        width: 48%;
                    }

                    .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart .inner {
                        position: relative;
                        padding: 0 0 100%;
                        background: #14805E;
                        border-radius: 50%;
                        box-shadow: 0 4.5px 3.6px #00000006, 0 12.5px 10px #00000009, 0 30.1px 24.1px #0000000c, 0 100px 80px #00000012;
                        backdrop-filter: none;
                        -webkit-backdrop-filter: none;
                    }

                    .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart.first .inner {
                        opacity: .6;
                    }

                        .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart.first .inner:before {
                            content: "";
                            position: absolute;
                            inset: 0;
                            display: block;
                            border-radius: 50%;
                            padding: 0.5px;
                            background: linear-gradient(0deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.6) 100%) border-box;
                            -webkit-mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
                            -webkit-mask-composite: xor;
                            mask-composite: exclude;
                            pointer-events: none;
                        }

                        .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart.first .inner:after {
                            pointer-events: none;
                            content: "";
                            display: block;
                            position: absolute;
                            inset: 0;
                            border-radius: 50%;
                            border: 1px solid transparent;
                            box-shadow: none;
                        }

                    .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart p {
                        position: absolute;
                        z-index: 2;
                        left: 0;
                        right: 0;
                        margin: 0 auto;
                        bottom: 10px;
                        color: #ffffff80;
                        font-size: 12px;
                        transform: scale(.8);
                        transform-origin: 50% 50%;
                        letter-spacing: 0.2px;
                        text-align: center;
                    }

                    .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart.second {
                        width: 75%;
                    }

                        .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart.second .inner {
                            opacity: .4;
                        }


                    .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart.third {
                        width: 100%;
                    }

                        .referral-program-promotion-panel .content .tier-block .referral-chart .promotion-chart.third .inner {
                            opacity: .2;
                        }


    .referral-program-promotion-panel .content2 {
        margin-top: 10px;
    }

        .referral-program-promotion-panel .content2 .step-block {
        }

            .referral-program-promotion-panel .content2 .step-block .num-title {
                font-size: 55px;
                font-weight: 700;
                padding-left: 45px;
                top: 0;
                color: #ffde1a;
            }

                .referral-program-promotion-panel .content2 .step-block .num-title.second {
                    display: flex;
                    justify-content: right;
                    padding-right: 45px;
                    padding-left: 0px;
                }

            .referral-program-promotion-panel .content2 .step-block .num-body {
                position: relative;
                padding: 5px 10px;
                -webkit-backdrop-filter: blur(10px);
                backdrop-filter: blur(10px);
                border-radius: 1.3333333333vw;
                background-color: #ffffff08;
                overflow: hidden;
            }

                .referral-program-promotion-panel .content2 .step-block .num-body.second {
                    text-align: right;
                }


                .referral-program-promotion-panel .content2 .step-block .num-body .num-yellow {
                    font-size: 14px;
                    font-weight: 700;
                    line-height: 1.5;
                    color: #ffde1a;
                }

                    .referral-program-promotion-panel .content2 .step-block .num-body .num-yellow.long {
                        width: 60%;
                    }

                .referral-program-promotion-panel .content2 .step-block .num-body .num-desc {
                    font-size: 12px;
                    font-weight: 500;
                    line-height: 1.5;
                    color: white;
                }

                .referral-program-promotion-panel .content2 .step-block .num-body .right-inv {
                    position: absolute;
                    left: 146px;
                    top: 5px;
                    opacity: 0.2;
                    width: 50px;
                    transform-origin: 50% 50%;
                    filter: blur(2px);
                }

                .referral-program-promotion-panel .content2 .step-block .num-body .right-inv2 {
                    position: absolute;
                    right: 20px;
                    top: 5px;
                    opacity: 0.3;
                    width: 35px;
                    transform-origin: 50% 50%;
                    filter: blur(2px);
                }


            .referral-program-promotion-panel .content2 .step-block .step-block-inv.first {
                position: absolute;
                z-index: 3;
                width: 100px;
                right: 30px;
                top: 85px;
            }

            .referral-program-promotion-panel .content2 .step-block .step-block-inv.second {
                position: absolute;
                z-index: 3;
                width: 100px;
                left: 30px;
                top: 210px;
            }


            .referral-program-promotion-panel .content2 .step-block .step-block-inv.third {
                position: absolute;
                z-index: 3;
                width: 100px;
                right: 30px;
                bottom: 25px;
            }


/** REFERRAL BEFORE LOGIN CONTENT CLOSED **/

/**AGENT REPORT CONTENT OPEN **/
.agent-report {
    display: grid;
    grid-template-columns: 47% 47%;
    grid-gap: 12px;
    padding-left: 14px;
    padding-top: 10px;
}

.report-detail {
    border-radius: 8px;
    padding: 24px 8px;
    font-size: 1rem;
    text-align: center;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    gap: 17px;
    color: #6a718e;
    box-shadow: 0px 3px 6px 3px rgb(32 117 109);
}

    .report-detail span:nth-child(1) {
        font-weight: 400;
        font-size: 13px;
        word-wrap: break-word;
    }

    .report-detail span:nth-child(2) {
        font-weight: 700;
        font-size: 15px;
        word-wrap: break-word;
    }

.afterlogin-sec {
    margin-bottom: 30px;
    margin-top: 25px;
}

.referral-flex.a {
    padding-left: 10px;
    padding-right: 10px;
}

.dataTables_wrapper table thead {
    background-color: #12805d;
}

#downlineee_length td {
    color: black;
}

#gamelogtable-a_length td {
    color: black;
}

#gamelogtable-a_length select {
    color: black;
    background: white;
}

#gamelogtable-a_info {
    color: black !important;
}

#gamelogtable-a_paginate {
    font-size: 12px !important;
}

    #gamelogtable-a_paginate span {
        font-size: 11px !important;
    }

#downlineee_length select {
    background: white;
    color: black;
}

#downlineee_info {
    color: black !important;
}

#downlineee_paginate {
    font-size: 12px !important;
}

    #downlineee_paginate span {
        font-size: 11px !important;
    }

/** Agent report CONTENT CLOSED **/

/** VIP POINT CONTENT OPEN **/
.vips-group {
    flex: 1; 
    overflow-y: scroll; 
    overflow-x: hidden; 
    padding: 0 2.6666666667vw;
}

.vips-row {
    display: flex;
    padding: 10px 0;
}

.vips-main-info {
    position: relative;
    display: flex;
    background: #272727;
    border-radius: 3px;
    width: 60%;
    padding: 15px;
    min-height: 105px;
    margin-bottom: 20px;
    overflow: hidden;
}

    .vips-main-info:before {
        content: '';
        position: absolute;
        right: -60px;
        top: -30px;
        width: 200px;
        height: 200px;
        background: url(../images2/bg-banner-vip.png) no-repeat, #0003;
        background-size: 70%;
        background-position: center;
        border: 10px double #0008;
        border-radius: 50%;
        transform: rotate(20deg);
        opacity: 0.3;
    }

    .vips-main-info img {
        width: 40px;
        height: 40px;
        margin: auto 0;
        margin-right: 5px;
    }

.vips-main-index {
    display: grid;
    margin: auto 5px;
}

    .vips-main-index span {
        font-size: 11px;
        color: #bbb;
        letter-spacing: 1.4px;
    }

    .vips-main-index h5 {
        font-size: 15px;
        margin: 0;
        letter-spacing: 2.4px;
        font-weight: 700;
    }

.vips-level-info {
    display: inline-grid;
    background: #272727;
    width: calc(40% - 10px);
    min-height: 105px;
    margin-left: 10px;
    margin-bottom: 20px;
}

    .vips-level-info > div.flex {
        margin: auto;
        margin-bottom: 0;
    }

        .vips-level-info > div.flex i {
            margin: auto 5px;
            font-size: 15px;
            color: #26ffbc;
        }

        .vips-level-info > div.flex span {
            margin: auto 0;
            font-size: 22px;
            font-weight: 700;
            font-family: serif;
            color: #26ffbc;
            line-height: 120%;
        }

    .vips-level-info > a {
        display: flex;
        margin: auto;
        margin-top: 5px;
        font-size: 10px;
        padding: 2px 10px;
        background: #e63846;
        border-radius: 3px;
    }

        .vips-level-info > a:before {
            content: '\f05a';
            font: var(--fa-font-solid);
            font-weight: 600;
            font-size: 14px;
            line-height: 100%;
            margin: auto;
            margin-right: 5px;
        }

.vip_exclusive_main {
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    color: #6a718e;
    text-align: center;
    box-shadow: 0px 0px 6px 0px #4CAF50;
}

.vip_exclusive_sub {
    padding: 10px;
    border: 1px solid #12805d;
    color: white;
}

.vip_exclusive_text {
    font-size: 12px;
}

.vip_cell {
    font-size: 12px;
}

.vip_benefits.ded table thead tr th {
    text-align: center;
    color: #ffffff;
    border: 2px solid #12805d;
    background-color: #12805d;
    font-size: 12px;
    height: 40px;
}

.vip_exclusive.a {
    margin-top: 45px;
}

.main_profile_title {
    font-size: 12px;
    font-weight: 700;
    margin: 5px 0px;
    color: white;
}

.vip_benefits.b {
    padding-left: 0;
    padding-right: 0;
}

/** VIP POINT CONTENT CLOSED **/

/** REFERRAL BEFORE LOGIN CONTENT OPENED **/

.v-card_text {
    width: 100%;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.375rem;
    letter-spacing: 1px;
    padding: 22px;
}

.v-timeline {
    padding: 22px;
    position: relative;
}

.v-timeline--dense:not(.v-timeline--reverse):before {
    left: 68px;
    right: auto;
}

.v-timeline:before {
    background: #3d3838;
    content: "";
    position: absolute;
    width: 2px;
    bottom: 32px !important;
    height: 75% !important;
    top: 33px !important;
}

.v-timeline--dense .v-timeline-item {
    flex-direction: row-reverse !important;
}

.v-timeline-item {
    display: flex;
    padding-bottom: 24px;
}

.v-timeline--dense .v-timeline-item_body {
    max-width: calc(100% - 96px);
}

.v-timeline-item_body {
    position: relative;
    height: 100%;
    flex: 1 1 auto;
}

.tier-card.active-tier.v-card .v-card_text {
    color: #ffce01 !important;
    background-color: #4b4a4a;
}

.v-sheet.v-card:not(.v-sheet--outlined) {
    box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
}

.v-timeline-item_divider {
    position: relative;
    min-width: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.v-timeline .v-timeline-item_dot {
    background: #fff;
}

.v-timeline-item_dot {
    z-index: 2;
    border-radius: 50%;
    box-shadow: 0 2px 1px -1px rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 1px 3px 0 rgba(0,0,0,.12);
    height: 38px;
}

.grey.lighten-2 {
    background-color: #585858 !important;
    border-color: #e0e0e0 !important;
}

.v-timeline-item--fill-dot .v-timeline-item_inner-dot {
    height: 31px;
    margin: 2px;
    width: 30px;
}

.v-timeline-item_inner-dot {
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}


/** VIP POINT BEFORE LOGIN CONTENT CLOSED **/


@media only screen and (max-width: 380px) {
    .sgames-content {
        display: grid;
        grid-template-columns: repeat(2,1fr);
    }
}

.maintenance-overlay {
    display: none;
}

.maintenance-overlay.show {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.8);
    color: white;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.maintenance-message {
    font-size: 24px;
}