﻿
:root {
    --main-color: #d9ac4f;
    --main_gradient-color: linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
    --main_gradient-color2: linear-gradient(180deg, #FAE59F 0%, #C4933F 100%);
}

body {
    font-family: bahnschrift;
}

.form-control:focus {
    border-color: #b47908;
}

.modal-body .form-control, .modal-body .form-select {
    border-radius: 0.25rem;
    padding: 9px 17px;
    font-size: 13px;
}

.light-logo {
    height: auto;
}

.page-header .logo-wrapper img {
    width: 150px;
    margin-top: 15px;
}


.light-logo-ji {
    display: block;
    margin: auto;
}

.dash-top-button {
    font-size: 15px;
    padding: 5px 17px;
    margin-top: 2px;
    width: 170px;
}

@media (max-width: 200px) {
    .page-header .logo-wrapper img {
        display: none !important;
    }
}

.page-wrapper {
    background: #000;
}

.float-right {
    float: right!important;
}

.float-left {
    float: left!important;
}

.padd-for-col {
    padding-right: calc(0.5rem * 0.5)!important;
    padding-left: calc(0.5rem * 0.5)!important;
}

.topheadapp {
    padding: 10px 20px;
    margin-left: 15px;
}

    .topheadapp i {
        font-size: 26px !important;
        font-weight: 800;
    }


.bottom-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #2b2b2b;
    height: 70px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    z-index: 100;
    padding-top: 15px;
}

    .bottom-nav p {
        color: #aeaeae;
        font-size: 15px;
    }

    .bottom-nav .icon {
        font-size: 26px;
    }

.nav-item {
    text-align: center;
    font-size: 12px;
    color: #ccc;
    flex: 1;
}

    .nav-item.active {
        color: #facc15;
    }

.promotion-icon {
    position: absolute;
    top: -38px;
    left: 50%;
    transform: translateX(-50%);
    width: 197px;
    height: auto;
    z-index: 101;
}

.promotion-label {
    position: absolute;
    top: 45px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 12px;
    color: #ccc;
}


    .promotion-label.active {
        color: #ffcc5c;
    }


.langimg {
    top: 50px;
    left: 20px;
    position: fixed;
}

.logoimg {
    top: 0;
    position: fixed;
}



.topbarji h4 {
    text-align: center;
    padding: 20px;
}



.text-center {
    text-align: center!important;
}

.text-right {
    text-align: right;
}

.theme-button1 {
    text-align: center;
    border: 1px solid #F6E3A3;
    color: #000;
    background: linear-gradient(180deg, #F6E3A3 0%, #D2A753 100%);
}

.lang-img {
    height: 40px;
    width: 40px;
}

.dash-news img {
    width: 35px;
}


#all_news ul li {
    line-height: 1.4;
}






















#all_news {
    /*background: #002b3b;*/
    height: 40px;
    overflow: hidden;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 3px;
    position: relative;
    -webkit-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.5);
    -moz-box-shadow: inset 0px 1px 2px rgba(0,0,0,0.5);
    box-shadow: inset 0px 1px 2px rgba(0,0,0,0.5);
}

    #all_news span {
        float: left;
        color: rgba(0,0,0,.8);
        color: #fff;
        padding: 6px;
        position: relative;
        border-radius: 4px;
        font-size: 12px;
    }

    #all_news button {
        float: right;
        color: rgba(0,0,0,.8);
        color: #fff;
        padding: 6px;
        position: relative;
        border-radius: 4px;
        font-size: 12px;
    }

    #all_news ul {
        float: left;
        /*padding-left: 55px;
   padding-right: 85px;*/
        -webkit-animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite;
        -moz-animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite;
        -ms-animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite;
        animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite;
    }

        #all_news ul:hover {
            -webkit-animation-play-state: paused;
            -moz-animation-play-state: paused;
            -ms-animation-play-state: paused;
            animation-play-state: paused;
        }

    #all_news li {
        line-height: 25px;
    }

    #all_news a {
        color: #fff;
        text-decoration: none;
        font-size: 13px;
    }

@-webkit-keyframes ticker {
    0% {
        margin-top: 0;
    }

    25% {
        margin-top: -26px;
    }

    50% {
        margin-top: -52px;
    }

    75% {
        margin-top: -78px;
    }

    100% {
        margin-top: 0;
    }
}

@-moz-keyframes ticker {
    0% {
        margin-top: 0;
    }

    25% {
        margin-top: -26px;
    }

    50% {
        margin-top: -52px;
    }

    75% {
        margin-top: -78px;
    }

    100% {
        margin-top: 0;
    }
}

@-ms-keyframes ticker {
    0% {
        margin-top: 0;
    }

    25% {
        margin-top: -26px;
    }

    50% {
        margin-top: -52px;
    }

    75% {
        margin-top: -78px;
    }

    100% {
        margin-top: 0;
    }
}

@keyframes ticker {
    0% {
        margin-top: 0;
    }

    25% {
        margin-top: -26px;
    }

    50% {
        margin-top: -52px;
    }

    75% {
        margin-top: -78px;
    }

    100% {
        margin-top: 0;
    }
}





.small-userinfo {
    width: 100%;
    color: #000;
    background: linear-gradient(180deg, #F6E3A3 0%, #D2A753 100%);
    border-radius: 10px;
    margin-top: 20px;
}

    .small-userinfo .infotext {
        padding: 10px;
        color: #000;
        font-size: 14px;
        font-weight: 700;
    }




.gamecategory .card-body img {
    width: 100%;
    max-width: 75px;
    margin-top: -25px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}


.gamecategory .card-body .gamewinnerplace {
    margin-top: 0px;
}


.paddingcat {
    padding-left: 10px;
    padding-right: 10px;
}

.paddingcat2 {
    margin-top: 100px !important;
}

.gamewinner1 {
    margin-top: -50px;
}

.gamecategory h5 {
    color: #000;
    font-weight: 600;
}

.gamecategory {
    width: 100%;
    background: linear-gradient( 135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent ), #e6bf73; /* golden base color */
    background-size: 40px 40px;
    border-radius: 12px;
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), inset 0 -1px 2px rgba(0, 0, 0, 0.1);
}




.gamecategory2 h5 {
    color: #000;
    font-weight: 600;
    text-align: center;
}

.gamecategory2 img {
    width: 100%;
}


.gamecategory2section {
    width: 100%;
    background: linear-gradient( 135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent ), #e6bf73; /* golden base color */
    background-size: 40px 40px;
    border-radius: 12px;
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), inset 0 -1px 2px rgba(0, 0, 0, 0.1);
}

.section-head {
    color: #d9ac4f;
}

.gamecategory3 img {
    width: 100%;
}

.gamecategory3 h5 {
    color: #000;
    font-weight: 600;
    padding-right: 10px;
}


.winn-info .img1 {
    border-radius: 50%;
    width: 40px;
}


.win-info-box .win-info-box-inn {
    background: #494949;
    border-radius: 10px;
}

.winn-info .img2 {
    height: 50px;
}

.win-info-head h5 {
    color: #fae59f;
    font-weight: 700;
}


/*===============================*/

.gamewinner .gamewinneruser {
    border-radius: 50%;
}

.gamewinner .right-box-amount {
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 10px!important;
    font-weight: 700;
    color: #8f5206;
    background: -webkit-linear-gradient(top, #FAE59F 0%, #C4933F 100%);
    background: linear-gradient(180deg, #FAE59F 0%, #C4933F 100%);
}


.gamewinner h5 {
    color: #8f5206;
    text-align: center;
}


.right-box-amount {
    padding: 4px 10px;
    border-radius: 20px;
    font-weight: 700;
    color: #8f5206;
    background: -webkit-linear-gradient(top, #FAE59F 0%, #C4933F 100%);
    background: linear-gradient(180deg, #FAE59F 0%, #C4933F 100%);
}


.gamewinner .gamewinnercrown {
    position: relative;
    width: 75px!important;
    margin-right: 10px;
    z-index: 11111111111111111111;
}


.gamewinner .card-body {
    margin-top: -25px;
}

/*=====================================================*/


.portfolio-box {
    border: 1px solid #ccc;
    padding: 20px;
    margin-bottom: 20px;
    text-align: center;
    background-color: #f8f9fa;
}

.d-none {
    display: none !important;
}


.gamecategorybocc {
    border-radius: 10px!important;
    margin-bottom: 15px;
}

    .gamecategorybocc .card-body img {
        width: 100%;
    }

    .gamecategorybocc .card-body {
        padding: 0;
    }

    .gamecategorybocc .overlay-text {
        position: absolute;
        bottom: 5px;
        /* left: -1%; */
        text-align: center;
        /* transform: translateX(-50%); */
        color: white;
        font-weight: bold;
        padding: 5px 10px;
        border-radius: 4px;
        font-size: 10px;
        margin: auto;
    }


.lottery .nowrap {
    white-space: nowrap;
}


.scroller {
    scrollbar-color: #9d9999 lightblue;
}


/*================================================================*/


.main-wallet-balance {
    text-align: center;
    padding: 10px 10px;
    background-color: #282828;
}

.main-wallet-balance-details {
    padding: 15px;
    background: #383838;
    margin: 15px 0;
    border-radius: 10px;
}


.theme-button2 {
    text-align: center;
    border: 1px solid #F6E3A3;
    color: #8f5206;
    border-radius: 15px;
    font-weight: 700;
    font-size: 18px;
    padding: 10px;
    width: 100%;
    background: linear-gradient(180deg, #F6E3A3 0%, #D2A753 100%);
}

.main-wallet-balance-details2 img {
    width: 100%;
    padding: 11px;
}


.main-wallet-balance-details2 p {
    font-size: 11px;
    font-weight: 700;
}

.main-wallet-balance-details3-box {
    padding: 15px;
    background: #383838;
    margin: 15px 0;
    padding: 20px 0;
    border-radius: 6px;
    text-align: center;
}

    .main-wallet-balance-details3-box p {
        font-size: 15px;
        font-weight: 700;
        text-align: center;
        margin-bottom: 0;
    }

/*=======================================*/

.profile-top-info {
    background: linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
    padding: 30px;
    padding-bottom: 100px;
    border-radius: 0 0 55px 55px;
}

.user-det img {
    border-radius: 50%;
    max-width: 90px;
}

.user-det h4, .user-det p {
    color: #ffffff;
}

.user-det h4 {
    font-size: 16px;
}


.user-det h5 {
    color: #ffffff;
    background-color: #dd9138;
    padding: 2px 10px;
    border-radius: 15px;
}


.main-wallet-balance-details-profile p {
    margin-bottom: 5px;
    text-align: left;
}

.main-wallet-balance-details-profile h4 {
    margin-bottom: 5px;
    text-align: left;
    font-size: 20px;
}

.main-wallet-balance-details3 p {
    text-align: center!important;
}

.main-wallet-balance-details3 img {
    text-align: center!important;
    padding: 10px;
    max-width: 55px;
}

.main-wallet-balance-details-profile {
    margin-top: -80px;
}


.main-wallet-balance-details4-box .img1 {
    width: 40px;
    border-radius: 50%;
}


.main-wallet-balance-details4-box h5 {
    font-size: 12px;
    font-weight: 600;
    text-align: left;
    margin-bottom: 2px;
}

.main-wallet-balance-details4-box p {
    font-size: 10px;
    color: #b3b3b3;
    font-weight: 600;
    text-align: left;
    margin-bottom: 2px;
}


.main-wallet-balance-details4-box {
    padding: 25px 8px !important;
}



.profile-panel-data {
    padding: 15px;
    background: #383838;
    margin: 10px 0;
    padding: 5px 10px;
    border-radius: 6px;
}

    .profile-panel-data .main-wallet-balance-details4-box {
        padding: 5px 8px !important;
        color: #fff;
    }

    .profile-panel-data .bottom-border {
        border-bottom: 1px solid #515151;
    }

    .profile-panel-data .main-wallet-balance-details4-box h5 {
        color: #fff;
    }

.theme-button2-outline {
    text-align: center;
    border: 1px solid #8f5206;
    color: #8f5206;
    border-radius: 15px;
    font-weight: 700;
    font-size: 18px;
    padding: 10px;
    width: 100%;
    background: #ffffff00;
}


/*==================================*/


.Deposit-Top {
    width: 100%;
    height: auto;
    background: #38383800;
    background-image: url(../img/new/TotalAssetsBg.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: top;
    border-radius: .26667rem;
    color: #8f5206;
    padding: .32rem;
    position: relative;
    text-align: left !important;
    padding: 15px;
}

    .Deposit-Top p {
        margin-bottom: 5px;
        font-weight: 800;
        font-size: 15px;
    }

    .Deposit-Top h4 {
        margin-bottom: 5px;
        font-weight: 800;
        font-size: 19px;
        color: #8f5206;
    }

.main-wallet-balance-details2 .dep-1 {
    width: 100%;
    height: auto;
    background: #333332;
    border-radius: 7px;
    height: 100px;
}


    .main-wallet-balance-details2 .dep-1 img {
        width: 100%;
        max-width: 70px;
        padding: 11px;
        display: block;
        margin: auto;
    }



    .main-wallet-balance-details2 .dep-1 p {
        text-align: center;
        padding-bottom: 8px!important;
    }


/*=======================================*/

.dep-section-2 {
    background: #333332;
    padding: 5px;
    border-radius: 7px;
    padding: 10px;
}


    .dep-section-2 .dep-1 {
        color: #a8a5a1;
        background: #4d4d4c;
        border-radius: 7px;
        padding: 15px 10px;
        font-weight: 800;
        width: 100%;
    }


.dep-section-3 .dep-section-3-inn {
    border: 1px solid #5f5f5f;
}


    .dep-section-3 .dep-section-3-inn h5 {
        font-size: 18px;
        font-weight: 800;
        color: #d9ac4f;
    }

    .dep-section-3 .dep-section-3-inn span {
        font-size: 18px;
        font-weight: 800;
        color: #666462;
    }

    .dep-section-3 .dep-section-3-inn .win-info-head h5 {
        text-align: center;
    }

    .dep-section-3 .dep-section-3-inn:active {
        background: linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
        color: #8f5206;
    }

    .dep-section-3 .dep-section-3-inn:focus {
        background: linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
        color: #8f5206;
    }

.dep-section-4-inn {
    background-color: #181919;
    border-radius: 20px;
}


    .dep-section-4-inn span {
        background-color: #181919;
        font-size: 22px!important;
        font-weight: 800!important;
        color: #d4ac4f!important;
    }

    .dep-section-4-inn input {
        background-color: #181919!important;
        border: 1px solid #181919!important;
        color: #fff;
        border: none;
        width: 100%;
    }

/*====================================*/

.dep-instr {
    border: 1px solid #5f5f5f;
    padding: 10px;
    border-radius: 7px;
}

    .dep-instr p {
        font-weight: 700;
        color: #a8a5a1;
    }



.profile-panel-data .bottom-border {
    border-bottom: 1px solid #515151;
}

.dep-hist h4 {
    color: #dd9138;
    font-weight: 700;
}

.dep-hist h6 {
    color: #a8a5a1;
    font-weight: 700;
}


/*===========================*/


.Wallet__C-balance {
    background-color: #4d4d4c;
    background-image: url(../img/new/walletbg.png);
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: .53333rem;
    padding: .46667rem .54667rem .4rem;
    position: relative;
    z-index: 0;
    text-align: center;
}


    .Wallet__C-balance p {
        text-align: center;
        font-weight: 500;
    }

.Wallet__C-balance-l1 {
    font-weight: 700;
}


.btn-withdraw {
    background: #d23838!important;
    border-radius: 15px;
    font-weight: 600;
    font-size: 13px;
    color: #fff;
    text-align: center;
    border: 1px solid #d23838!important;
}

.btn-deposit {
    background: #17b15e!important;
    border-radius: 15px;
    font-weight: 600;
    font-size: 13px;
    color: #fff;
    text-align: center;
    border: 1px solid #17b15e!important;
}

.timer-card {
}

.timer-cards {
    background: #4d4d4c;
    text-align: center;
}

.timer-card .clock-icon img {
    width: 50px;
    height: 50px;
}

.timer-cards {
    flex-wrap: nowrap; /* keep in one line */
    border-radius: 10px;
}

.timer-card {
    flex: 1 1 25%;
    text-align: center;
}


    .timer-card .card-title {
        color: #a8a5a1;
        text-align: center;
    }


    .timer-card.active .card-title {
        color: #8f5206; /* highlighted when active */
    }

    .timer-card.active {
        background: linear-gradient(180deg, #FAE59F 0%, #C4933F 100%);
        border-radius: 10px;
        padding: 10px;
    }



/*========================================*/
.TimeLeft__C {
    margin: 10px auto 0;
    width: 100%; /* make it full-width */
    background-image: url(../img/new/wing_bg.png);
    background-repeat: no-repeat;
    background-size: 100% auto; /* stretch horizontally */
    background-position: center top;
}

    .TimeLeft__C .TimeLeft__ins {
        color: #8f5206;
        padding: 3px;
        border: 1px solid #8f5206;
        border-radius: 10px;
        font-size: 10px;
        text-align: center;
        margin: 5px;
    }

    .TimeLeft__C .TimeLeft__name {
        color: #8f5206;
        padding: 3px;
        font-size: 10px;
        text-align: center;
        margin: 5px;
        font-weight: 600;
    }

.timer-inner-div {
    text-align: center;
    margin: 15px;
}


    .timer-inner-div img {
        width: 25px;
        height: 25px;
        text-align: center;
    }

.ball-dis {
    text-align: center;
    display: block !important;
    margin: auto;
}

.timer-inner-div2 .TimeLeft__text {
    color: #8f5206;
    padding: 3px;
    font-size: 13px;
    text-align: right;
    margin: 5px;
    margin-right: 0;
    font-weight: 700;
}

.timer-inner-div2 .TimeLeft__id {
    color: #8f5206;
    padding: 3px;
    font-size: 14px;
    text-align: right;
    margin: 5px;
    margin-right: 0;
    font-weight: 700;
}


.timer-inner-div2 {
    text-align: center;
    margin: 5px 15px;
}



.timer-container {
    display: flex;
    gap: 5px;
    float: right;
}

.digit-box {
    background: #111;
    color: white;
    font-weight: bold;
    font-size: 19px;
    width: 23px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    clip-path: polygon(0% 0, 100% 0, 100% 100%, 0% 100%);
}

.colon {
    background: none;
    color: white;
    font-size: 28px;
    font-weight: bold;
    width: 10px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}



/*=======================================*/

.buttonsofgame {
    text-align: center;
}

.color-btn {
    padding: 10px 25px;
    color: #fff;
    font-weight: 500;
    border: none;
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
}

.green-btn {
    background-color: #28a745!important;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.violet-btn {
    background-color: #a14edb!important;
    border-radius: 10px;
}

.red-btn {
    background-color: #dc3545!important;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.color-btn:hover {
    opacity: 0.9;
}


.buttonsofgame {
    background: #4d4d4c;
}

.ball-dis-big img {
    width: 100%;
    padding: 5px;
}

.ball-dis-big {
    background: #181919;
    margin: 10px;
    border-radius: 8px;
    padding: 5px;
}


    .ball-dis-big button {
        border: none;
    }


.Betting__C-multiple-l {
    background: #242424;
    border: 1px solid #d23838;
    color: #d23838;
    border-radius: 8px;
    padding: 5px 10px;
    margin: 3px;
}

.Betting__C-multiple-r {
    background: #242424;
    margin: 3px;
    border-radius: 8px;
    padding: 5px 10px;
}

.Betting__C-multiple {
    overflow: auto;
}

.nav {
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
}

.nav-pills .nav-link {
    white-space: normal; /* allow wrapping */
}

    .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
        font-weight: 700;
        color: #8f5206;
        background: linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
    }


.nav-pills .nav-link {
    background: #4d4d4c;
    margin: 5px;
    color: #929292;
    font-size: 12px;
}


.Betting__C-foot button {
    width: 40%;
}

.Betting__C-foot button {
    width: 40%;
    font-size: 17px;
    padding: 9px 10px;
}

.Betting__C-foot-b {
    background-color: #dd9138!important;
    border-radius: 20px 0 0 20px;
}

.Betting__C-foot-s {
    background-color: #5088d3!important;
    border-radius: 0 20px 20px 0;
}



@media (max-width: 575.98px) {
    .nav-pills li {
        width: 33%;
    }
}

.tab-content {
    border: none;
    border-top: none;
    padding: 10px;
}

.circlegreen {
    color: #47ba7c;
}

.circlepurple {
    color: #ec4cdf;
}

.circlered {
    color: #f23f3f;
}



.tab-show-box1 {
    background: #181919;
    padding: 5px;
}

    .tab-show-box1 th {
        background: #3A3947;
    }

.textpurplegreen {
    font-size: 20px;
    font-weight: bold;
    background: linear-gradient(to bottom, #47ba7c 50%, #ec4cdf 50%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

.textpurplered {
    font-size: 20px;
    font-weight: bold;
    background: linear-gradient(to bottom, #f23f3f 50%, #ec4cdf 50%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}


.textgreen {
    color: #47ba7c!important;
    font-size: 20px;
}

.textpurple {
    color: #ec4cdf!important;
    font-size: 20px;
}

.textred {
    color: #f23f3f!important;
    font-size: 20px;
}

.colred {
    color: #f23f3f!important;
}

.Betting__C-foot-page .active {
    background: #d9ac4f!important;
    color: #8f5206;
    border: none;
}

.Betting__C-foot-page .disabled {
    background: #4d4d4c!important;
    pointer-events: none;
    color: #ccc;
    border: none;
}

.tab-show-box1 td {
    font-size: 11px!important;
}

.tab-show-box1 th {
    font-size: 12px!important;
}

.tab-show-box2 .winn-num span {
    border-radius: 50%;
    width: auto;
    height: auto;
    line-height: 13px;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    font-family: Roboto;
    border: .01333rem solid #fd565c;
    color: #fd565c !important;
}

.tab-show-box2 .winn-num-white span {
    border-radius: 50%;
    width: auto;
    height: auto;
    line-height: 13px;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    font-family: Roboto;
    border: .01333rem solid #bbb;
    color: #bbb !important;
}





.tab-show-box2 {
    background: #181919;
    padding: 5px;
}

    .tab-show-box2 th {
        background: #3A3947;
    }

    .tab-show-box2 td {
        font-size: 11px!important;
    }

    .tab-show-box2 th {
        font-size: 12px!important;
    }



.winn-num {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; /* or space-evenly */
    width: 100%;
    padding: 5px;
}

    .winn-num span {
        flex: 1 0 auto;
        text-align: center;
        padding: 4px 4px;
        box-sizing: border-box;
        border-radius: 50%;
        width: 18px;
        height: 19px;
        line-height: 18px;
        font-size: 12px;
        font-weight: 500;
        text-align: center;
        font-family: Roboto;
        border: .01333rem solid #fd565c;
        color: #fd565c !important;
    }


.winn-num-white {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; /* or space-evenly */
    width: 100%;
    padding: 5px;
}

    .winn-num-white span {
        flex: 1 0 auto;
        text-align: center;
        padding: 2px;
        box-sizing: border-box;
    }


.simp-num {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; /* or space-evenly */
    width: 100%;
    padding: 5px;
}

    .simp-num span {
        flex: 1 0 auto;
        text-align: center;
        padding: 4px 4px;
        box-sizing: border-box;
    }


.bk-yellow {
    background: #f3bd14;
    color: #fff;
}


.col-yellow {
    color: #f3bd14!important;
}

.bk-blue {
    background: #609dec;
    color: #fff;
}


.bk-red {
    background-color: #fd565c;
    color: #fff;
}

.bk-red-purple {
    background-image: linear-gradient(135deg, #fd565c 0%, #fd565c 50.37%, #ec4cdf 50.38%, #ec4cdf 100%) !important;
    color: #fff;
}

.bk-red {
    background-color: #47ba7c;
    color: #fff;
}


.howtohead {
    background: linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
    text-align: center;
}

    .howtohead h1 {
        text-align: center;
        color: #fff;
    }

.howtohead-foot-btn button {
    background: #d9ac4f;
    color: #fff;
    display: block;
    margin: auto;
}

#HowToModal .modal-dialog {
}

#HowToModal p {
    font-size: 14px;
    font-weight: 500;
}

#HowToModal .modal-header {
    display: block;
}


/*==============================*/

.gameModal .modal.fade .modal-dialog {
    transform: translateY(100%);
    transition: transform 0.3s ease-out;
}

.gameModal .modal.fade.show .modal-dialog {
    transform: translateY(0);
}

/* Fixed to bottom half */
.gameModal .modal-dialog.modal-bottom {
    position: absolute;
    bottom: 0;
    margin: 0;
    width: 100%;
    max-height: 50vh;
}

.gameModal .modal-content {
    height: 100%;
    border-radius: 1rem 1rem 0 0;
    overflow-y: auto;
}


#SelectSmallModal .modal-header {
    background: linear-gradient(90deg, #6ca6f3 0%, #87bcf5 100%);
}


#SelectBigModal .modal-header {
    background: #dd9138;
}


#SelectGreenModal .modal-header {
    background: #17b15e;
}


#SelectVioletModal .modal-header {
    background: #9b48db;
}


#SelectRedModal .modal-header {
    background: #d23838;
}

.gameModal .modal-header {
    display: block;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%);
    clip-path: polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%);
}

    .gameModal .modal-header h5 {
        background: #fff;
        color: #000;
        padding: 6px;
    }

    .gameModal .modal-header .modal-title {
        color: #fff;
        padding: 6px;
        font-size: 15px !important;
    }

.gamepop span {
    background: #4d4d4c;
    color: #f5f3f0;
    padding: 5px;
    width: 47px;
    font-weight: 500;
    text-align: center;
    font-size: 12px;
    border-radius: 5px;
}

.smallgm span.active-multiplier {
    background-color: #5088d3; /* Bootstrap blue */
    color: white;
    font-weight: bold;
}


.biggm span.active-multiplier {
    background-color: #dd9138; /* Bootstrap blue */
    color: white;
    font-weight: bold;
}


.greengm span.active-multiplier {
    background-color: #17b15e; /* Bootstrap green */
    color: white;
    font-weight: bold;
}


.violetgm span.active-multiplier {
    background-color: #9b48db; /* Bootstrap voilet */
    color: white;
    font-weight: bold;
}


.redgm span.active-multiplier {
    background-color: #d23838; /* Bootstrap red */
    color: white;
    font-weight: bold;
}



.quantity-container {
    display: flex;
    align-items: center;
    gap: 10px;
}

.quantity-btn {
    width: 39px;
    height: 30px;
    background-color: #4a90e2;
    border: none;
    border-radius: 10px;
    color: #222;
    font-size: 17px;
    cursor: pointer;
}

.quantity-btn-big {
    width: 39px;
    height: 30px;
    background-color: #dd9138;
    border: none;
    border-radius: 10px;
    color: #222;
    font-size: 17px;
    cursor: pointer;
}

.quantity-btn-red {
    width: 39px;
    height: 30px;
    background-color: #dc3545;
    border: none;
    border-radius: 10px;
    color: #222;
    font-size: 17px;
    cursor: pointer;
}

.quantity-btn-green {
    width: 39px;
    height: 30px;
    background-color: #28a745;
    border: none;
    border-radius: 10px;
    color: #222;
    font-size: 17px;
    cursor: pointer;
}

.quantity-btn-violet {
    width: 39px;
    height: 30px;
    background-color: #a14edb;
    border: none;
    border-radius: 10px;
    color: #222;
    font-size: 17px;
    cursor: pointer;
}

.quantity-input {
    width: 70px;
    height: 30px;
    text-align: center;
    background-color: #2a2a2a;
    color: white;
    border: 1px solid #444;
    font-size: 13px;
}


/*=========================*/
.gameModal .round-checkbox {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    vertical-align: middle;
    border: 1px solid #ccc;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
}

    .gameModal .round-checkbox:checked {
        appearance: auto;
        clip-path: circle(50% at 50% 50%);
        background-color: blue; /* Example checked color */
    }


.gameModal label {
    font-size: 15px;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
}

.checkbox-wrapper, .radio-wrapper {
    float: left;
}

.game-button-small1 {
    background: #4d4d4c;
    color: #a8a5a1;
}

.game-button-small2 {
    background: #5088d3;
    color: #fff;
}

.game-button-big2 {
    background: #dd9138;
    color: #fff;
}

.game-button-bigred {
    background: #d23838;
    color: #fff;
}

.game-button-bigviolet {
    background: #9b48db;
    color: #fff;
}

.game-button-biggreen {
    background: #17b15e;
    color: #fff;
}

.red {
    color: red;
}


#RulesModal p {
    font-size: 12px;
    font-weight: 500;
}


#RulesLabel {
    text-align: center;
}

#DashModal .modal-header {
    display: block;
}


    #DashModal .modal-header p {
        color: #fff;
        font-size: 13px;
        margin-bottom: 5px;
        text-align: center;
    }

#DashModal .modal-header {
    background: #4d4d4c;
}


#DashModal .modal-body {
    padding: 10px;
    background-color: #333332;
    overflow: auto;
}

.orange {
    color: #dd9138;
}


#DashModal .title2 {
    background: #242424;
    height: 25px;
    border-radius: 16px;
    text-align: center;
    padding: 2px 10px;
}

#DashModal .title {
    font-weight: 500;
}

.orangeButton {
    border: 1px solid #dd9138;
    background: transparent;
    color: #dd9138;
}


#DashModal .card-body p {
    font-weight: 400;
    font-size: 11px;
    color: #a8a5a1;
}


#DashModal .card-body {
    background: #4d4d4c;
    border-radius: 10px;
}

.custom-modal {
    height: 75vh; /* 75% of screen height */
    max-height: 75vh;
}

    .custom-modal .modal-content {
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .custom-modal .modal-body {
        overflow-y: auto;
        flex: 1 1 auto; /* allow modal body to grow and scroll if needed */
    }

#DashModal .modal-footer {
    background-color: #333332;
}

#DashModal .custom-modal {
    margin-top: 120px!important;
}

#DashModal .radious {
    border-radius: 20px!important;
}

/*=========================================================*/

/* Modal-style container */
.digit-modal {
    position: absolute;
    top: 5vh;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
    background-color: rgba(18, 18, 18, 0.9);
    padding: 10px 20px;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
}

.digit {
    width: 70px;
    height: 100px;
    background-color: #333333bd;
    color: gold;
    font-size: 70px;
    font-weight: bold;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Courier New', Courier, monospace;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

@media (max-width: 500px) {
    .digit {
        width: auto;
        height: auto;
        font-size: 100px;
        padding: 20px;
    }
}


#BigNumberModal .modal-dialog-scrollable .modal-body {
    overflow-y: auto;
    background: transparent;
}


#BigNumberModal .modal-dialog-scrollable .modal-content {
    background: transparent;
}

#BigNumberModal .modal-dialog {
    top: 15%;
}

.withdraw-add-bank p {
    color: #ccc!important;
}

.addWithdrawType-text {
    color: red;
    text-align: center;
}

.withdraw-2 .imgs {
}

.withdraw-2 .cont {
    padding: 5px 20px;
}

.withdraw-2 h5 {
    color: #fff;
    text-align: left;
    font-size: 16px;
}

.withdraw-2 p {
    color: #fff;
    text-align: left !important;
    font-size: 12px;
    margin-bottom: 0;
}

.withdraw-2 {
    height: auto;
    background: #333332;
    border-radius: 10px;
}

.withall {
    border: 1px solid #d9ac4f;
    border-radius: 7px;
    background: none;
    color: #d9ac4f;
    font-size: 13px;
    padding: 0px 25px;
}

.col-gold {
    color: #d9ac4f;
    font-size: 16px;
}

.withdraw-button {
    width: 90%;
    background: linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
    border-radius: 20px;
    border: none;
    color: #8f5206;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 700;
}

.Recharge__container-intro p {
    position: relative; /* Required for positioning the :after element */
    padding-left: 1.5rem; /* Add some spacing for the diamond */
}

    .Recharge__container-intro p:after {
        content: "";
        position: absolute;
        width: 6px;
        height: 6px;
        transform: rotate(45deg);
        background: #d9ac4f;
        left: 0.5rem;
        top: 7px;
    }

.dep-instr p {
    position: relative; /* Required for positioning the :after element */
    padding-left: 1.5rem; /* Add some spacing for the diamond */
}


    .dep-instr p:after {
        content: "";
        position: absolute;
        width: 6px;
        height: 6px;
        transform: rotate(45deg);
        background: #d9ac4f;
        left: 0.5rem;
        top: 7px;
    }



.with-4 p {
    margin-bottom: 0;
}




.WithdrawalHistoryBox {
    background: #1e1e1e;
    padding: 5px;
    border-radius: 7px;
    padding: 10px;
}

#AddBankModal .modal-dialog-centered .modal-header .modal-title {
    font-weight: 700;
    color: #875601;
    font-size: 16px !important;
}

#USDTAddressModal .modal-dialog-centered .modal-header .modal-title {
    font-weight: 700;
    color: #875601;
    font-size: 16px !important;
}

.chooseCountry {
    height: 43px;
}

.BankAddForm input, .BankAddForm select {
    background: #333332;
}



.withdraw-button-bank {
    width: 90%;
    background: #6f7381;
    border-radius: 20px;
    border: none;
    color: #fff;
    padding: 7px 20px;
    font-size: 16px;
    font-weight: 700;
}

.dep-section-3 .trximg {
    width: 25px;
}



.USDTAddressSection input {
    width: 100%;
    background: none;
    border: none;
    color: #d9ac4f;
    font-weight: 700;
    padding-left: .5px;
    padding-bottom: 0;
    outline: none; /* <--- THIS removes the focus border */
    box-shadow: none; /* Also prevent shadow glow */
}

    .USDTAddressSection input:focus {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }



.BankAccountSection input {
    width: 100%;
    background: none;
    border: none;
    color: #d9ac4f;
    font-weight: 700;
    padding-left: .5px;
    padding-bottom: 0;
    outline: none; /* <--- THIS removes the focus border */
    box-shadow: none; /* Also prevent shadow glow */
}

    .BankAccountSection input:focus {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }



.dep-section-4-inn {
    background: #1c1c1c; /* or your dark background */
    border-radius: 20px;
    height: 48px; /* or adjust to match the design */
}

    .dep-section-4-inn input {
        width: 100%;
        height: 100%;
        background: transparent;
        border: none;
        color: #d9ac4f;
        font-weight: 600;
        outline: none;
        box-shadow: none;
        padding: 0 10px;
        font-size: 14px;
    }

.goldcol {
    color: #d9ac4f;
}



/*=========================================================*/

.filterForm select, .filterForm input {
    height: 50px;
}


.History-Nav img {
    width: 26px;
}

.History-Nav i {
    font-size: 26px;
}

.History-Nav span {
    white-space: nowrap;
}

.History-Nav-Tab .withdraw-button {
    width: 100%;
    background: linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
    border-radius: 20px;
    border: none;
    color: #8f5206;
    padding: 6px 20px;
    font-size: 15px;
}

.History-Nav-Tab .WithdrawalHistoryBox {
    background: #2c2c2c;
    padding: 5px;
    border-radius: 7px;
    padding: 10px;
    margin-bottom: 10px;
}

    .History-Nav-Tab .WithdrawalHistoryBox hr {
        margin: 5px 0;
    }

.EmptyBox img {
    opacity: 0.2;
    width: 60%;
}

.EmptyBox p {
    color: #ccc;
}

.SpaceForBottom {
    padding-bottom: 105px;
}

.scroller {
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

    .scroller::-webkit-scrollbar {
        display: none; /* Chrome, Safari, Opera */
    }


.NotificationBox {
    background: #313131;
    padding: 5px;
    border-radius: 7px;
    padding: 10px;
    margin-bottom: 10px;
}


    .NotificationBox h6 {
        font-size: 17px;
        color: #fff;
    }

    .NotificationBox p {
        margin-top: 3px;
        margin-bottom: 0;
        color: #ccc;
        line-height: 16px;
        font-size: 13px;
    }

.GiftTopImg {
    width: 100%;
}

.GiftHistoryBox h6 {
    font-size: 14px;
    color: #fff;
    font-weight: 500;
}

.GiftHistoryBox h4 {
    font-size: 14px;
    font-weight: 500;
    color: #fff;
}

.NotificationBox h5 {
    font-size: 17px;
    color: #fff;
    font-weight: 500;
}



.GiftHistoryBox {
    background: #252525;
    padding: 5px;
    border-radius: 7px;
    padding: 10px;
    margin-bottom: 10px;
}


.NotificationBox h2 {
    font-size: 20px;
    font-weight: 500;
    color: #DD9138;
}

.StatHistoryBox {
    display: flex;
    align-items: flex-start;
}

.dot-image {
    margin-right: 12px;
    height: auto;
    height: 69px;
}

.history-details {
    flex-grow: 1;
}

.dep-hist {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
}

.col-yellow {
    color: #ffb933;
}

h6, h4 {
    margin: 0;
}

.history-details > div {
    padding: 14px 0;
    padding-top: 0px;
}


.StatHistoryTopBox .StatHistoryTopBoxImg {
    width: 30px;
}

.history-details h6, .history-details h4 {
    font-weight: 400;
    font-size: 12px;
}


.GiftHistoryBoxx {
    border-radius: 7px;
    padding: 10px;
}

.LangImg {
    width: 25px;
}


.LangPop h1 {
    text-align: center;
    color: #000000;
}

.main-wallet-balance-details-setting {
    margin-top: -100px;
}

    .main-wallet-balance-details-setting profimg {
        text-align: center !important;
        padding: 5px;
        max-width: 90px!important;
    }

.AvatarBox img {
    border-radius: 15px;
}

.verifyInput__container-input button {
    color: #8f5206;
    font-size: 13px;
    border: none;
    border-radius: 20px;
    padding: 0 17px;
    background: linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
    height: 50px;
}



.FeedbackTextarea {
    width: 100%;
    color: #fff;
    padding: 20px;
    border-radius: 7px;
    background: #2b2b2b;
    border-color: unset;
}


.FeedbackBox .feedbackImg {
    width: 60%;
    margin: 25px 10px;
}


.op40 {
    opacity: 0.6;
}


.GuideImg {
    display: block;
    margin: auto;
    width: 60%;
}

.AboutUsBox h4 {
    font-size: 14px;
}


.TransactionHistoryBox p {
    color: #ccc;
    margin-bottom: 0;
}

.TransactionHistoryBox .smallbox {
    background: #181919;
    padding: 5px 10px;
    border-radius: 5px;
    margin: 5px 0;
}

.TransactionHistoryBox h6 {
    padding: 5px 0;
}


.TransactionHistoryBox .h-50 {
    height: 50px !important;
}

.TransactionHistoryBox p {
    color: #ccc;
    margin-bottom: 0;
    font-size: 13px;
}

.promotion-top {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    height: 200px;
    padding-top: .6rem;
    background-image: url(../img/prom/promotionbg.png), linear-gradient(90deg, #FAE59F 0%, #C4933F 100%);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover, 100% 100%;
}

    .promotion-top .promotion-info {
        background: #333332;
        color: #d9ac4f;
        border-radius: 10px;
        text-align: center;
        font-size: 13px;
        margin-bottom: 5px;
        white-space: nowrap;
        padding: 3px 15px;
    }

    .promotion-top .promotion-info-simple {
        font-size: 11px;
        margin-bottom: 10px;
        color: #8f5206;
    }

    .promotion-top .amount {
        font-weight: 500;
        font-size: 22px;
        color: #8f5206;
        margin-bottom: 10px;
        margin-top: 7px;
    }

.promotion-middle p {
    font-size: 12px;
    margin-bottom: 5px;
}

.promotion-middle .head {
    background-color: #3a3947;
    text-align: center;
    color: #fff;
    font-size: 15px;
    padding: 15px 5px;
    background-repeat: no-repeat;
    background-position: .26667rem center;
    border-radius: 10px;
}

.promotion-middle {
    margin-top: -70px;
    position: relative;
    z-index: 1;
    background: #4d4d4c;
    border-radius: 7px;
}


.TeamReport__C-body {
    background-color: #4d4d4c;
    color: #f5f3f0;
    font-size: 13px;
    padding: 15px 0 5px;
    margin-bottom: 10px;
    border-radius: 10px;
}


    .TeamReport__C-body p span {
        color: #fff;
        font-size: 17px;
    }

    .TeamReport__C-body p {
        padding: 5px;
    }


    .TeamReport__C-body .bord-left {
        border-left: 1px solid #939393;
    }




.RuleserviceBox:after {
    background: #f36b23;
    top: auto;
    bottom: 0;
    height: 10px;
    border-radius: 0 0 10px 10px;
}

.RuleserviceBox .Ruletitle {
    color: #fff;
    background: #3a3947;
    font-size: 17px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 10px 60px 9px;
    margin: -10px 0 5px;
    display: inline-block;
    position: relative;
}

    .RuleserviceBox .Ruletitle:before, .RuleserviceBox .Ruletitle:after {
        content: "";
        background: linear-gradient(to top left, #24242e 49%, transparent 50%);
        width: 10px;
        height: 10px;
        position: absolute;
        top: 0;
        left: -10px;
    }

    .RuleserviceBox .Ruletitle:after {
        transform: rotateY(180deg);
        left: auto;
        right: -10px;
    }


.classImg {
    width: 50px;
}

.classImg {
    width: 50px;
    height: auto;
    display: block;
}

.level-container {
    position: relative;
    display: inline-block;
}

.level-text {
    position: absolute;
    top: 6px;
    right: 2px;
    background: #11111100;
    color: #fff;
    font-size: 12px;
    padding: 1px 4px;
    border-radius: 4px;
    font-weight: bold;
}




.tableRule th, .tableRule td {
    padding: 5px;
}


.italic {
    font-style: italic!important;
}

.RatioBox p {
    font-size: 12px;
    margin-bottom: 2px;
}

.serverbg {
    background: #d9ac4f;
}

.TeamReport__C-body h6 {
    padding: 2px 15px;
    font-size: 16px;
    color: #fff;
}

.TeamReport__C-body .ico {
}

.dark-only .swal-modal {
    background-color: #0e0f0fc4!important;
    width: 65%!important;
    text-align: center!important;
}

    .dark-only .swal-modal .swal-text {
        color: #e2e2e2!important;
        text-align: center !important;
        font-size: 13px!important;
    }


.theme-button2-outline {
    display: block;
    text-align: center;
    border: 1px solid #d9ac4f;
    color: #d9ac4f;
    border-radius: 15px;
    font-weight: 700;
    font-size: 18px;
    padding: 10px;
    width: 100%;
    background: #ffffff00;
}

.input-group-text {
    background-color: #333332!important;
}

.faLogCircle {
    text-align: center;
    display: block;
    margin: auto;
    font-size: 82px;
    color: #fa5b5a;
}

.Logoutpopup p {
    text-align: center;
}

.LogoutpopupMain {
    background-color: #333332!important;
    width: 80%;
    display: block;
    margin: auto;
}


.drag-btn {
    position: fixed; /* floats above page */
    right: 16px; /* start position */
    bottom: 24px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #111;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 16px rgba(0,0,0,.25);
    z-index: 9999;
    cursor: move;
    user-select: none;
    touch-action: none; /* smoother on mobile */
}

    .drag-btn img {
        max-width: 60%;
        max-height: 60%;
        display: block;
        pointer-events: none; /* prevents image from “grabbing” events */
        filter: invert(1); /* white on dark circle (optional) */
    }

.badgeBorder {
    color: #d23838;
    border: 1px solid #d23838;
    width: auto;
    text-align: center;
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 3px;
    float: right;
}

.HistTab3 .HistTabAmt {
    color: #d23838;
    width: auto;
    text-align: center;
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 3px;
    float: right;
    margin-top: 5px;
}

#myhistory .HistTab1 span {
    vertical-align: middle;
    text-align: center;
    background: #28a745;
    font-size: 30px !important;
    color: #fff;
    border-radius: 10px;
    width: 100%;
}

.HistTab2 {
    margin-bottom: 3px;
    font-size: 14px;
}

.green {
    color: #13c164!important;
}


.violet {
    color: #a043e8!important;
}

.big {
    color: #dd9138!important;
}

.red {
    color: red!important;
}

.small {
    color: #5088d3!important;
}

/*.HistoryTab   tr  td {
    border-bottom: none;
        font-size: 12px !important;
           padding: 4px;
    vertical-align: middle;
    border-bottom: none; 
}

  .HistoryTab   .HistTabDetBox   { 
      background: #333333;
}



  .HistoryTab tbody tr th, .HistoryTab tbody tr td {
    border-bottom: none;
}*/
.HistTab2 p {
    margin-bottom: 3px;
    font-size: 14px;
}


.HistoryTab {
    border-collapse: separate;
    border-spacing: 0 8px; /* spacing between rows */
}

    .HistoryTab tr {
        background: #fff;
        border-radius: 8px;
        box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    }

    .HistoryTab td {
        padding: 10px 14px;
        vertical-align: middle;
        font-size: 14px;
        border: none;
    }

.HistTabHead {
    font-weight: bold;
    font-size: 16px;
    text-align: left;
    background: #f8f9fa;
    border-radius: 8px 8px 0 0;
}

.text-end {
    text-align: right;
}

.HistoryTab > :not(caption) > * > * {
    background-color: #464646;
}

.HistoryTab td {
    padding: 3px 8px;
    border: none !important;
    vertical-align: middle;
    font-size: 12px !important;
    color: #cdcdcd;
    border: none;
}

.HistoryDetailsBox {
    display: none;
    transition: all 0.3s ease-in-out;
}


/*====================================================*/

.GameWinModelBox, .GameLossModelBox {
    position: relative;
    display: inline-block;
}

.GameWinModelBoxContent, .GameLossModelBoxContent {
    position: absolute;
    top: 50%; /* vertically center */
    left: 50%; /* horizontally center */
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff; /* make text white for contrast */
    font-weight: bold;
    padding: 10px 0px;
    border-radius: 8px;
    width: 70%;
}

.GameWinModelBox h4 {
    color: #fff;
    font-size: 24px;
}

.GameLossModelBox h4 {
    color: #fff;
    font-size: 30px;
}

.GameWinModelBox p, .GameLossModelBox p {
    color: #fff;
    font-size: 14px;
}

.GameWinModelBox .GameWinModelBoxContentSmallDetails, .GameLossModelBox .GameLossModelBoxContentSmallDetails {
    color: #808080;
    font-size: 10px;
    font-weight: 500;
}

.GameWinModelBox h6, .GameLossModelBox h6 {
    color: #f35c47;
    font-weight: 600;
    font-size: 16px;
    margin-top: 63px;
    margin-top: 45px;
    
}

.GameWinModelBox h5, .GameLossModelBox h5 {
    color: #f35c47;
    font-weight: 600;
    font-size: 23px;
}


.modalBottomClose {
    font-size: 22px;
    background: #ffffff00;
    color: #fff;
    border-radius: 20px;
    border: 1px solid #fff;
    margin-top: 5px;
}


.light-logo-ji {
    display: block;
    margin: auto;
    height: 50px;
}


/*=============== For Mobile Below S8 ====================*/



/* For Galaxy S8+ and smaller screens */
@media screen and (max-width: 360px) and (max-height: 740px) {
    h1, .h1 {
        font-size: 24px!important;
        font-weight: 700;
    }

    .right-box-amount {
        font-size: 11px;
    }

    h5, .h5 {
        font-size: 11px;
    }

    .dash-top-button {
        font-size: 12px;
        padding: 4px 10px;
        margin-top: 0;
        width: 145px;
    }

    .page-header .logo-wrapper img {
        width: 115px;
        margin-top: 15px;
    }

    .winn-info .img2 {
        height: 45px;
    }

    .gamewinner .right-box-amount { 
    font-size: 8px !important; 
}

    #all_news a { 
    font-size: 12px;
}
    .btn {
    font-size: 12px;
    font-weight: 600;
}

    .winn-info .img1 {
    border-radius: 50%;
    width: 35px;
}

    .timer-inner-div img {
    width: 20px;
    height: 20px;
    text-align: center;
}

    .nav-pills .nav-link { 
    font-size: 11px!important;
}

    .GameWinModelBox h6, .GameLossModelBox h6 {
    color: #f35c47;
    font-weight: 600;
    font-size: 16px;
    margin-top: 26px;
}
     
    .bottom-nav p {
    color: #aeaeae;
    font-size: 12px;
}

    .withdraw-button { 
    padding: 8px 20px;
    font-size: 14px; 
}

    .AboutUsBox h4 {
    font-size: 12px;
}

    .promotion-middle .head { 
    font-size: 12px; 
}

}


.swal-text:last-child {
    margin-bottom: 20px!important;
}


.swal-text:first-child {
    margin-top: 20px!important;
}


.back-red {
    background-color: #dc3545 !important;
    color:#fff!important;
}

.back-violet {
    background-color: #a14edb !important;
    color:#fff!important;
}

.back-green {
    background-color: #28a745 !important;
    color:#fff!important;
}

.back-yellow {
    background-color: #dd9138 !important;
     color:#fff!important;
}

.back-blue {
    background-color: #5088d3 !important;
    color:#fff!important;
}

.back-red-purple {
     background: linear-gradient(135deg, #ff4d4d 50%, #9b5de5 50%);
}


.back-green-purple {
   background: linear-gradient(135deg, #00c896 50%, #9b5de5 50%);
}