@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap');

body {
    --star-on-icon: url("//nx-cdn.trgwl.com/Images/icons/star-on.svg?v=20230828-1");
    --star-off-icon: url("//nx-cdn.trgwl.com/Images/icons/star-off.svg?v=20230828-1");
    --love-on-icon: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 37 32' enable-background='new 0 0 37 32' xml:space='preserve' fill='%23000000'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cg%3E%3Cpath fill='%23808184' d='M33.582,2.483c-1.776-1.56-4.077-2.418-6.481-2.418c-2.767,0-5.49,1.134-7.472,3.112l-0.781,0.778 c-0.188,0.188-0.508,0.188-0.697,0l-1.027-1.024C15.23,1.041,12.711,0,10.032,0C7.415,0,4.938,1,3.059,2.814 c-1.87,1.805-2.911,4.287-2.933,6.988c-0.023,2.824,1.095,5.573,3.067,7.541l14.252,14.22C17.728,31.845,18.103,32,18.5,32 s0.772-0.155,1.055-0.437L34.061,17.09c1.952-1.948,3.021-4.645,2.934-7.399C36.906,6.897,35.693,4.338,33.582,2.483z M33.355,16.382L18.849,30.855c-0.188,0.188-0.51,0.188-0.697,0L3.899,16.635c-1.784-1.779-2.794-4.267-2.773-6.824 c0.02-2.431,0.953-4.66,2.627-6.277C5.445,1.9,7.675,1,10.032,1c2.413,0,4.681,0.938,6.387,2.64l1.026,1.024 c0.565,0.564,1.545,0.564,2.11,0l0.78-0.778c1.796-1.792,4.263-2.82,6.766-2.82c2.161,0,4.228,0.77,5.821,2.169 c1.902,1.67,2.993,3.974,3.073,6.488C36.075,12.238,35.138,14.603,33.355,16.382z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center no-repeat;
    --love-off-icon: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 37 32' enable-background='new 0 0 37 32' xml:space='preserve' fill='%23000000'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cg%3E%3Cpath fill='%23808184' d='M33.582,2.483c-1.776-1.56-4.077-2.418-6.481-2.418c-2.767,0-5.49,1.134-7.472,3.112l-0.781,0.778 c-0.188,0.188-0.508,0.188-0.697,0l-1.027-1.024C15.23,1.041,12.711,0,10.032,0C7.415,0,4.938,1,3.059,2.814 c-1.87,1.805-2.911,4.287-2.933,6.988c-0.023,2.824,1.095,5.573,3.067,7.541l14.252,14.22C17.728,31.845,18.103,32,18.5,32 s0.772-0.155,1.055-0.437L34.061,17.09c1.952-1.948,3.021-4.645,2.934-7.399C36.906,6.897,35.693,4.338,33.582,2.483z M33.355,16.382L18.849,30.855c-0.188,0.188-0.51,0.188-0.697,0L3.899,16.635c-1.784-1.779-2.794-4.267-2.773-6.824 c0.02-2.431,0.953-4.66,2.627-6.277C5.445,1.9,7.675,1,10.032,1c2.413,0,4.681,0.938,6.387,2.64l1.026,1.024 c0.565,0.564,1.545,0.564,2.11,0l0.78-0.778c1.796-1.792,4.263-2.82,6.766-2.82c2.161,0,4.228,0.77,5.821,2.169 c1.902,1.67,2.993,3.974,3.073,6.488C36.075,12.238,35.138,14.603,33.355,16.382z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center no-repeat;
}

.photobox__previewbox input[type=checkbox] {
    position: absolute;
    display: none;
}

    .photobox__previewbox input[type=checkbox].favourite-game-btn + label {
        position: absolute;
        margin: 0;
        bottom: 5px;
        right: 5px;
        z-index: 2;
        width: 25px;
        height: 25px;
        padding: 5px;
        background: var(--star-off-icon) center no-repeat;
        background-size: 19px;
        background-color: #fff;
        border-radius: 50%;
        cursor: pointer;
        transition: background-image ease .35s;
    }

    .photobox__previewbox input[type=checkbox].favourite-game-btn:checked + label {
        background-image: var(--star-on-icon);
    }

.fa.fa-tawk {
    background-image: url('../img/tawkIcon.png');
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    overflow: hidden;
    border-radius: 0.25em;
    padding-right: 1.2em;
}

#alertModal {
    z-index: 9999999999 !important;
}

    #alertModal .modal-content {
        background-color: rgba(0, 0, 0, .9);
        /*        width:500px; remove for mobile will over device*/
    }

    #alertModal .tim-btn-bg, #alertModal .tim-btn {
        padding: 10px 20px;
        font-size: 18px;
    }

.img-thumbnail {
    background-color: inherit;
    border: none;
}

.product-thumb .img-thumbnail {
    max-width: 210px;
}

.product-thumb:before {
    z-index: 2;
}

.overlay:hover {
    background: rgba(0,0,0, 0.5);
}

.overlay .game-content {
    /*visibility: hidden;*/
    left: 0 !important;
    text-align: center;
    width: 100%;
}

.overlay:hover .game-content {
    visibility: visible;
    background: rgba(0,0,0,0.5);
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 3;
    padding: 50% 0;
    cursor: pointer;
}

.overlay .game-title {
    color: #fff;
}

.overlay:hover .game-title {
    font-weight: bold;
    font-size: 20px;
    margin: 0 auto;
    max-width: 210px;
    padding: 0 10px;
}

.game-frame {
    text-align: center;
    margin: 0 auto;
    line-height: 0;
    /*padding-top: 155px;*/
}

.user-auto-promocode, .user-auto-promocode-online {
    display: none;
}

#loader-wrapper {
    position: fixed;
    z-index: 1000000000;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    opacity: 0.4;
    display: none;
}

.loader, #loader {
    --width: 50px;
    border: 5px solid #f3f3f3;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    border-top: 5px solid #555;
    border-radius: 50%;
    width: var(--width);
    height: var(--width);
    margin: calc(-1 * var(--width) / 2);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.nopadding {
    padding: 0 !important;
}

.simple-login {
    vertical-align: middle;
    margin-right: 5px;
}

    .simple-login .fld {
        border-radius: 5px;
        padding: 2px 3px;
        width: 115px;
        height: 26px;
        vertical-align: middle;
    }

    .simple-login img.simple-captcha-img {
        height: 26px;
        width: auto !important;
    }

    .simple-login .simple-captcha-code {
        width: 50px;
    }

.sl-h {
    display: none !important;
}

.sl-s {
    display: inline-block;
}

@media (max-width: 992px) {
    .sl-h {
        display: inline-block !important;
    }

    .sl-s {
        display: none;
    }
}


.fastdeposit-note, .autodeposit-note {
    padding: 10px 25px;
    color: red;
    border: 2px solid red;
    font-size: 0.8em;
}

    .fastdeposit-note li, .autodeposit-note li {
        list-style-type: disclosure-closed;
        font-weight: bold;
    }

.fastDepositCurrencyS2 {
    font-size: 20px;
    font-weight: bold;
    color: #000;
    vertical-align: top;
}

.fastDepositAmountS2 {
    font-size: 30px;
    font-weight: bold;
    animation-name: DepositAmount;
    -webkit-animation-duration: 500ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-direction: alternate;
}

.fastdeposit-note-minamt {
    display: none;
}

@keyframes DepositAmount {
    from {
        color: #6616CE;
    }

    to {
        color: red;
    }
}

.fastDepositTimerS2 {
    font-size: 24px;
}

.fastdeposit-copy {
    text-align: center;
}

.fastdeposit-cancel button {
    text-transform: uppercase;
    background: red;
    border: none;
}

    .fastdeposit-cancel button:hover {
        background: #d80000;
    }

ad-active::-moz-selection { /* Code for Firefox */
    color: red;
    background: yellow;
}

ad-active::selection {
    color: red;
    background: yellow;
}

.iti__arrow {
    border: none;
}

body.iti-mobile .iti--container {
    z-index: 10000000000;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
}

.t991-dp-block {
    display: none !important;
}

@media only screen and (max-width: 992px) {


    /* 991px Hide | Show */
    .t991-dp-none {
        display: none !important;
    }

    .t991-dp-block {
        display: block !important;
    }
}


#DepositTabContent .bank-list-card .bank_list-container {
    color: #fff;
    background-color: #000;
}

#DepositTabContent .bank-list-card .bank_list-code {
    font-size: .75rem;
}

#DepositTabContent .bank-list-card .bank_list-account_number {
    font-size: 1rem;
    color: #ffffff;
    -webkit-text-fill-color: white;
}

#DepositTabContent .bank-list-card .card-text .text-muted {
    color: #ffffff !important;
}

#DepositTabContent .bank-list-card .bank_list-account_name {
    color: #ccc;
}

#DepositTabContent .bank-list-card .bank_list-footer .btn {
    color: #ffffff;
    background-color: #777777;
}

    #DepositTabContent .bank-list-card .bank_list-footer .btn:hover {
        background-color: #28324d;
    }

#DepositTabContent .form-control, #WithdrawalTabContent .form-control {
    font-weight: bold;
}

.autodeposit-bankno .btn:has(+.btn) {
    margin-block-end: 0.5rem;
}

.disabled-apk-download {
    display: none !important;
}

.seoar table {
    max-width: 100%;
}

.slotwrapper {
    overflow: hidden;
    display: inline-block;
    font-size: 75px;
    line-height: 75px;
    max-height: 75px;
}

    .slotwrapper ul {
        padding: 0;
        margin: 0;
        list-style: none;
        position: relative;
        float: left;
        text-align: center;
    }

        .slotwrapper ul li img {
            vertical-align: top;
        }

@media screen and (max-width: 1200px) {
    .slotwrapper {
        width: 100%;
    }

        .slotwrapper ul {
            width: 33%;
        }
}

@media screen and (max-width: 768px) {
    .slotwrapper {
        height: 100px;
    }

        .slotwrapper ul {
            height: 100px;
            font-size: 100px;
            line-height: 100px;
        }
}

.scroller-span {
    color: #FFF;
    display: block !important;
}

.custom-max-width55 {
    width: 55% !important;
}

.float-right {
    float: right !important;
}

.fullWidth-table {
    width: 100% !important;
}

/* bankaccount scrollbar */
.login-form ::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.login-form ::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.login-form ::-webkit-scrollbar-thumb {
    background: #739894;
    border-radius: 10px;
}

    .login-form ::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

/* bankaccount scrollbar */

.cd-tabs__panel section.depositbank-account-list, .cd-tabs__panel section.memberbank-account-list {
    width: 100%;
    transition: all 200ms ease-in-out 50ms;
    background: #eeeeee !important;
    overflow: auto;
    white-space: nowrap;
}

    .cd-tabs__panel section.depositbank-account-list .depositbank, .cd-tabs__panel section.memberbank-account-list .memberbank {
        height: 75px;
        width: auto;
        overflow: hidden;
        border-radius: 0px;
        background: #eeeeee;
        transition: all 200ms ease-in-out 50ms;
        font-weight: 500;
        cursor: pointer;
        display: inline-flex;
        margin-bottom: 3px;
        border-top: solid 3px #eeeeee;
    }

    .cd-tabs__panel section.depositbank-account-list .expand, .cd-tabs__panel section.memberbank-account-list .expand {
        background: #f9f9f9;
        border-top: solid 3px #00c154;
    }

        .cd-tabs__panel section.depositbank-account-list .expand .bank-profile .checkbox, .cd-tabs__panel section.memberbank-account-list .expand .bank-profile .checkbox {
            display: block;
        }

        .cd-tabs__panel section.depositbank-account-list .expand > div, .cd-tabs__panel section.memberbank-account-list .expand > div {
            transition-delay: 200ms;
            opacity: 1;
        }

.bank-profile {
    text-align: center;
    padding: 5px 10px;
    white-space: nowrap;
    font-size: 10px;
    position: relative
}

    .bank-profile img {
        width: 45px;
        height: 45px;
        border-radius: 50%;
        border: solid 1px #878383;
    }

    .bank-profile .checkbox {
        width: 12px;
        position: absolute;
        top: 2px;
        right: 2px;
        height: auto;
        border: none;
        display: none;
    }

.btn-deposit-amount {
    width: 50px;
    height: 50px;
    border-radius: 50% !important;
    color: #4b637a;
    background: #f9f9f9;
    border: none;
    padding: 5px !important;
    font-size: 10px !important;
}

.bank-qrcode {
    width: 250px !important;
    height: 250px !important;
    right: 100px !important;
    left: auto !important;
    text-align: center;
    position: fixed !important;
    bottom: 15px !important;
    z-index: 100 !important;
}

.bank-qrcode-title {
    font-size: 12px;
    color: #fff;
    margin-top: 15px;
    margin-bottom: 5px;
}

.bank-qrcode-float {
    position: fixed;
    bottom: 35%;
    right: 100px;
    z-index: 100;
    width: 60px;
    height: 60px;
    background-color: #fff;
    border-radius: 50%;
    text-align: center;
    box-shadow: 3px 3px 13px black;
    cursor: pointer;
}

.bank-qrcode-close {
    width: 25px;
    height: 25px;
    font-size: 20px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 10px;
    top: 10px;
    color: #fff;
    font-weight: 300;
    opacity: 1;
    border-radius: 100%;
    border: 2px solid #fff;
    background: transparent;
}

#mb-accbtn span, #db-accbtn span {
    color: #000;
}

@media (max-width: 992px) {
    .bank-qrcode {
        bottom: 100px !important;
        right: 15px !important;
    }

    .bank-qrcode-float {
        bottom: 35%;
        right: 15px;
    }
}



/* bank logo has change rounded in deposit, standardize at footer*/
ul#Payment-Providers li img {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
}

.donecopybtn {
    opacity: 0;
}

    .donecopybtn.active {
        opacity: 1;
        animation: fadeIn 3s ease forwards;
    }

#betHistoryModel > div.modal-dialog {
    max-width: 800px !important
}

#betHistoryModelDiv.modal-content {
    width: 100% !important;
    max-width: none;
}

.game-item {
    padding: 0 5px;
}

#dls-modal.modal {
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.6);
    backdrop-filter: blur(5px);
}

#WithdrawalTabContent .amountNote {
    display: block;
}

#mega888-download, #megaGaming-download, #megaV3-download, #pussy888-download, #kiss918-download {
    font-size: 0.8rem !important;
}

#megaGaming-download {
    font-size: 0.8rem !important;
}

.mega888-loader-wrapper {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(21, 21, 21, 0.24);
    z-index: 2;
}

    .mega888-loader-wrapper .loader {
        margin-left: -30px;
        -webkit-transform: none;
        transform: none;
    }

.IntroVideo1_close_btn {
    right: -15px;
    top: -15px;
    position: absolute;
    color: #fff;
    width: 2.5em;
    height: 2.5em;
    opacity: 1;
    z-index: 10001;
    padding: 5px !important;
    border-radius: 50px;
    background-color: transparent !important;
    border: none;
    filter: drop-shadow(2px 4px 6px black);
}

#IntroVideo1_myModal .modal-content {
    background: transparent !important;
    width: 360px;
    margin: auto;
    border: none;
}

#IntroVideo1_Video img {
    height: auto;
    width: 100%;
}

#IntroVideo1_VTdata .modal-dialog {
    background: #fff;
    margin: 0;
}
#tournament-history table {
    font-size: .95em;
}

#tournament-history thead {
    background: #201f25;
    color: #fff;
}

#tournament-history tbody td {
    background: #fff;
}

#tournament-history tbody tr.highlight {
    border: solid;
}

    #tournament-history tbody tr.highlight td {
        background: #efefac !important;
    }

#tournament-history tbody tr:nth-child(2n+2) td {
    background: #e2e2e2;
}

#tournament-history th,
#tournament-history td {
    padding: 10px 7px;
}

#WithdrawalTabContent .amountNote.amountNoteInline {
    display: inline-block;
}

.simple-forgotpw {
    font-size: .8em !important;
}

.promotion-rules-page #page-content .CalculationTable {
    width: 100%;
}

    .promotion-rules-page #page-content .CalculationTable td {
        border-width: 2px;
        border-style: solid;
        padding: 3px;
    }

.promotion-rules-page table .verttext {
    writing-mode: vertical-rl;
    text-orientation: upright;
    text-align: center;
}

.promotion-rules-page .txt-win {
    color: green;
}

.promotion-rules-page .txt-lose {
    color: red;
}

.promotion-rules-page .txt-bonus {
    color: #2ca1cb;
}

.promotion-rules-page .CalculationTable tr td:first-child {
    text-align: center;
}

.promotion-rules-page .content-text {
    font-size: 0.75rem;
}

.promotion-rules-page.dark-theme,
.promotion-rules-page.dark-theme #page-content p {
    color: white !important;
}

    .promotion-rules-page.dark-theme .CalculationTable td {
        border-color: white !important;
    }

.promotion-rules-page.light-theme,
.promotion-rules-page.light-theme #page-content p {
    color: black !important;
}

    .promotion-rules-page.light-theme .CalculationTable td {
        border-color: black !important;
    }

.promotion-rules-page .blog-title {
    font-size: 25px;
    text-decoration: underline;
    font-weight: bold;
}

.promotion-rules-page.light-theme .blog-title {
    color: black;
}

.promotion-rules-page.dark-theme .blog-title {
    color: white;
}

.promotion-rules-page #page-content p {
    font-weight: 500;
    font-size: 0.9rem;
}

@media (max-width:426px) {
    .promotion-rules-page .container .col-6 {
        flex: none;
    }
}

.tip-container {
    position: absolute;
    right: .25rem;
    top: 0;
    height: 100%;
    display: flex;
    gap: .25rem;
    align-items: center;
}

.qrcode-tip {
    /* position: absolute;
    top: 107px;
    right: 30px; */
    text-align: center;
    background-color: #000;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 12px;
    cursor: default;
    display: flex;
    align-items: center;
    justify-content: center;
}

.copy-tip {
    /* position: absolute;
    top: 107px;
    right: 1rem; */
    text-align: center;
    background-color: #000;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 10px;
    cursor: default;
    display: flex;
    align-items: center;
    justify-content: center;
}

.help-tip {
    /* position: absolute;
    top: 25px;
    right: 5px;*/
    text-align: center;
    background-color: #000;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 12px;
    cursor: default;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .help-tip:before {
        content: '?';
        font-weight: bold;
        color: #fff;
    }

    .help-tip:hover ul, .copy-tip:hover ul {
        display: block;
        transform-origin: 100% 0%;
        -webkit-animation: fadeIn 0.3s ease-in-out;
        animation: fadeIn 0.3s ease-in-out;
    }

    .help-tip ul, .copy-tip ul {
        display: none;
        text-align: left;
        background-color: #1E2021;
        padding: 15px 30px;
        width: 300px;
        position: absolute;
        border-radius: 3px;
        box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
        right: -5px;
        top: 40px;
        color: red !important;
        font-size: 13px !important;
        line-height: 1.4;
        z-index: 1;
        border: none;
    }

        .help-tip ul:before, .copy-tip ul:before {
            position: absolute;
            content: '';
            width: 0;
            height: 0;
            border: 6px solid transparent;
            border-bottom-color: #1E2021;
            right: 10px;
            top: -12px;
        }

        .help-tip ul:after, .copy-tip ul:after {
            width: 100%;
            height: 40px;
            content: '';
            position: absolute;
            top: -40px;
            left: 0;
        }

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
        transform: scale(0.6);
    }

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

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

    100% {
        opacity: 100%;
    }
}


button.game-lobby-list-load-btn {
    display: block;
}

.game-lobby-list-load-btn .spinner-border {
    width: 15px;
    height: 15px;
    border-width: 2px;
    vertical-align: middle;
    margin-left: 7px;
    display: none;
}

.game-lobby-list-load-btn .default-text {
    display: inline-block;
}

.game-lobby-list-load-btn .loading-text {
    display: none;
}

.game-lobby-list-load-btn:disabled .default-text {
    display: none;
}

.game-lobby-list-load-btn:disabled .loading-text {
    display: inline-block;
}

.game-lobby-list-load-btn:disabled .spinner-border {
    display: inline-block;
}

#forgotPasswordModal .did-floating-label {
    white-space: nowrap;
    overflow: hidden;
    width: 260px;
    text-overflow: ellipsis;
}


#disclaimerModal > .modal-dialog > .modal-content > .modal-body {
    height: 40vh !important;
}

/*#WithdrawalTabContent .input-group input, #WithdrawalTabContent .input-group select, #DepositTabContent .input-group input, #DepositTabContent .input-group select {
    border-top-right-radius: 0em;
    border-bottom-right-radius: 0em;
}*/

.css-marquee {
    animation: cssmarquee 5s linear infinite;
}

@-moz-keyframes cssmarquee {
    0% {
        transform: translateX(100%);
    }

    100% {
        transform: translateX(-100%);
    }
}

@-webkit-keyframes cssmarquee {
    0% {
        transform: translateX(100%);
    }

    100% {
        transform: translateX(-100%);
    }
}

@keyframes cssmarquee {
    0% {
        -moz-transform: translateX(100%);
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }

    100% {
        -moz-transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}

/* Affiliate popup CSS*/

/*#affiliate-detail-list .modal-content{
    width: 50% !important;
    max-width: unset !important;    
}*/

@media (min-width: 576px) {
    #affiliate-detail-list .modal-dialog {
        max-width: 50%;
    }
}

/*@media only screen and (max-width:426px) {
    #affiliate-detail-list .modal-content {
        width: 100% !important;
    }
}*/

#dpt-info {
    background: #f6f6f6;
    font-weight: 600;
    font-size: 10px;
}

    #dpt-info .card-header, #dpt-info .card-body {
        background: #f6f6f6;
    }

        #dpt-info .card-body span {
            color: #333;
        }
        #dpt-info .card-body span.bankno  {
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
        }
    #dpt-info button.copy-bankno {
        width: 11px;
        height: 11px;
        font-size: 11px;
        line-height: 0px;
    }

#qrcodeImage {
    width: 60px;
    margin: 0px 0px 0px 15px;
    padding: 0 0 0 15px;
    cursor: pointer;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    object-fit: contain;
}

#banklogoImage {
    width: 100px;
    height: auto;
    max-height: 50px;
    text-align: center;
    object-fit: contain;
}

.payment-grid {
    display: grid;
    grid-template-columns: 100%;
    grid-gap: 25px;
}

    .payment-grid .payment-form {
        margin-top: 10px;
        font-size: 12px;
    }

@media screen and (max-width: 992px) {
    .payment-grid {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "payment-form payment-form"
            "payment-transaction payment-transaction";
        grid-gap: 15px;
    }

        .payment-grid .payment-transaction {
            grid-area: payment-transaction;
        }

        .payment-grid .payment-form {
            grid-area: payment-form;
        }
}

.asf-container {
    position: fixed;
    bottom: 205px;
    left: 25px;
    z-index: 100;
    cursor: pointer;
}

    .asf-container img {
        object-fit: contain;
        width: 118px;
        height: auto;
        transition: width .5s;
    }

    .asf-container::after {
        content: '';
        opacity: 0.9;
        background-color: #EEE;
        border-radius: 5px;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }

    .asf-container:hover {
        z-index: 999;
    }

    .asf-container img:hover {
        width: 250px !important;
    }

.asf-close {
    position: absolute;
    right: -20px;
    top: -16px;
    color: #FFF;
    width: 17.59px;
    cursor: pointer;
    -webkit-filter: drop-shadow( 2px 1px 1px rgba(0, 0, 0, .9));
    filter: drop-shadow( 2px 1px 1px rgba(0, 0, 0, .9));
}

    .asf-close.xs {
        width: 12px;
        right: -13px;
        top: -15px;
    }

#shareboxPopup .tooltip {
    padding: 10px;
    background: #000;
    color: #fff;
    font-size: 0.75rem;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s;
}

    #shareboxPopup .tooltip.show {
        opacity: 1;
        pointer-events: auto;
    }

.toast {
    max-width: 300px;
}

.toast-body {
    border-bottom: 6px solid #0373ff;
    color: black;
    background: white;
    font-size: 0.75rem;
}

    .toast-body p {
        color: black;
    }

.toast-header {
    color: black;
    font-size: 1rem;
}

    .toast-header .close span {
        font-size: 1.5rem;
        top: 2px;
        right: 8px;
        color: black;
    }

    .toast-header strong {
        font-weight: 700;
        font-size: 12px;
    }

@media (max-width: 426px) {
    .toast {
        max-width: 60vw;
    }

    .toast-body {
        font-size: 10px;
    }
}

/* loyal program page */
/*badge 1 design */
 .loyalD1 {
	 background-size: 100% 100% !important;
	 background-repeat: no-repeat !important;
	 height: 154px;
	 position: relative;
	 width: 272px;
	 border-radius: 10px;
	 border: none;
	 -webkit-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 -moz-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 overflow: hidden;
}
 .loyalD1::before {
	 background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
	 content: "";
	 display: block;
	 height: 100%;
	 left: -75%;
	 position: absolute;
	 top: 0;
	 transform: skewX(-25deg);
	 width: 50%;
	 z-index: 2;
}
 .loyalD1:hover::before, .loyalD1:focus::before {
	 animation: cardshine 0.85s;
}
 .loyalD1 .badgeD1_0 {
	 position: absolute;
	 right: 45px;
	 width: 42px;
	 height: auto;
	 top: 15px;
}
 .loyalD1 .badgeD1_1, .loyalD1 .badgeD1_2, .loyalD1 .badgeD1_3, .loyalD1 .badgeD1_4, .loyalD1 .badgeD1_5 {
	 position: absolute;
	 right: 45px;
	 width: 50px;
	 height: auto;
	 top: 15px;
}
 .loyalD1 .badgeD1_6 {
	 position: absolute;
	 right: 40px;
	 width: 60px;
	 height: auto;
	 top: 20px;
}
 .loyalD1 .badgeD1_7 {
	 position: absolute;
	 right: 40px;
	 width: 50px;
	 height: auto;
	 top: 10px;
}
 .loyalD1 .badgeD1_8, .loyalD1 .badgeD1_9 {
	 position: absolute;
	 right: 40px;
	 width: 60px;
	 height: auto;
	 top: 10px;
}
 .loyalD1 .cardnnoD1 {
	 position: absolute;
	 bottom: 40px;
	 font-size: 24px;
	 left: 15.6px;
	 letter-spacing: 1.2px;
	 font-family: 'Rajdhani', sans-serif;
	 font-weight: 500;
}
 .loyalD1.card0 .cardnnoD1 {
	 background: -webkit-linear-gradient(#74bd11 40%, #74bd11 55%, #74bd11 10%);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card1 .cardnnoD1 {
	 background: -webkit-linear-gradient(#1a9ae2 40%, #1a9ae2 55%, #1a9ae2 10%);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card2 .cardnnoD1 {
	 background: -webkit-linear-gradient(#f032e8 40%, #f032e8 55%, #f032e8 10%);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card3 .cardnnoD1 {
	 background: -webkit-linear-gradient(#18a4ff 40%, #18a4ff 55%, #18a4ff 10%);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card4 .cardnnoD1 {
	 background: -webkit-linear-gradient(#a745db 40%, #a745db 55%, #a745db 10%);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card5 .cardnnoD1 {
	 background: -webkit-linear-gradient(#e01b41 40%, #e01b41 55%, #e01b41 10%);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card6 .cardnnoD1 {
	 background: -webkit-linear-gradient(#41b159 40%, #41b159 55%, #41b159 10%);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card7 .cardnnoD1 {
	 background: -webkit-linear-gradient(#f6780c 40%, #f6780c 55%, #f6780c 10%);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card8 .cardnnoD1 {
	 background: -webkit-linear-gradient(#e53d1c 40%, #e53d1c 55%, #e53d1c 10%);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card9 .cardnnoD1 {
	 background: -webkit-linear-gradient(268deg, #6900fd, #eb00e3);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .loyalD1.card9 .cardnnoD1 .loyalprogram-progress {
	 background: rgba(254, 184, 26, 1.0);
	 background: linear-gradient(90deg, rgba(254, 184, 26, 1.0), rgba(237, 22, 203, 1.0));
}
 .loyalD1 .memberidD1 {
	 position: absolute;
	 bottom: 20.8px;
	 left: 29.2px;
	 color: #fff;
	 letter-spacing: 1.5px;
	 text-transform: uppercase;
	 font-size: 10px;
	 font-family: 'Montserrat', sans-serif !important;
	 text-shadow: 1px 1px 1px #636060;
}
 .loyalD1 .cardnyearD1 {
	 position: absolute;
	 bottom: 20.8px;
	 right: 52px;
	 color: #fff;
	 letter-spacing: 1.5px;
	 font-size: 10px;
	 font-family: 'Montserrat', sans-serif !important;
	 text-shadow: 1px 1px 1px #636060;
}
 .loyalD1 .rankingNameD1 {
	 display: none;
}
/*badge 2 design */
 .loyalD2 {
	 background-size: 100% 100% !important;
	 background-repeat: no-repeat !important;
	 height: 154px;
	 position: relative;
	 width: 272px;
	 border-radius: 10px;
	 border: 1px solid #fff;
	 -webkit-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 -moz-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 overflow: hidden;
}
 .loyalD2::before {
	 background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
	 content: "";
	 display: block;
	 height: 100%;
	 left: -75%;
	 position: absolute;
	 top: 0;
	 transform: skewX(-25deg);
	 width: 50%;
	 z-index: 2;
}
 .loyalD2:hover::before, .loyalD2:focus::before {
	 animation: cardshine 0.85s;
}
 .loyalD2 .badgeD2_0, .loyalD2 .badgeD2_1, .loyalD2 .badgeD2_2 {
	 position: absolute;
	 right: 35px;
	 width: 45px;
	 height: auto;
	 top: 20px;
}
 .loyalD2 .badgeD2_3, .loyalD2 .badgeD2_4, .loyalD2 .badgeD2_5, .loyalD2 .badgeD2_6 {
	 position: absolute;
	 right: 30px;
	 width: 50px;
	 height: auto;
	 top: 20px;
}
 .loyalD2 .badgeD2_7, .loyalD2 .badgeD2_8, .loyalD2 .badgeD2_9 {
	 position: absolute;
	 right: 25px;
	 width: 75px;
	 height: auto;
	 top: 20px;
}
 .loyalD2 .cardnnoD2 {
	 position: absolute;
	 bottom: 10px;
	 font-size: 25px;
	 left: 15.6px;
	 letter-spacing: 1.2px;
	 font-family: 'Rajdhani', sans-serif !important;
	 font-weight: 600;
}
 .loyalD2 .memberidD2 {
	 position: absolute;
	 top: 15px;
	 left: 15.6px;
	 color: #fff;
	 font-weight: bold;
	 text-transform: uppercase;
	 font-family: 'Montserrat', sans-serif !important;
}
 .loyalD2 .rankingNameD2 {
	 position: absolute;
	 top: 42px;
	 left: 15.6px;
	 font-weight: bold;
	 font-size: 35px;
	 text-align: left;
	 text-transform: uppercase;
	 font-family: 'Montserrat', sans-serif !important;
	/*text-shadow: #35332f 1px 0 3px;
	*/
}
 .loyalD2.card0 .cardnnoD2, .loyalD2.card0 .memberidD2, .loyalD2.card0 .rankingNameD2 p {
	 color: #63512d !important;
	 text-shadow: 0px 1px 1px #fff;
}
 .loyalD2.card0 .rankingNameD2 .loyalprogram-progress {
	 background: #63512d !important;
}
 .loyalD2.card1 .cardnnoD2, .loyalD2.card1 .memberidD2, .loyalD2.card1 .rankingNameD2 p, .loyalD2.card3 .cardnnoD2, .loyalD2.card3 .memberidD2, .loyalD2.card3 .rankingNameD2 p {
	 color: #474748 !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD2.card1 .rankingNameD2 .loyalprogram-progress, .loyalD2.card3 .rankingNameD2 .loyalprogram-progress {
	 background: #474748 !important;
}
 .loyalD2.card2 .cardnnoD2, .loyalD2.card2 .memberidD2, .loyalD2.card2 .rankingNameD2 p, .loyalD2.card4 .cardnnoD2, .loyalD2.card4 .memberidD2, .loyalD2.card4 .rankingNameD2 p {
	 color: #784014 !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD2.card2 .rankingNameD2 .loyalprogram-progress, .loyalD2.card4 .rankingNameD2 .loyalprogram-progress {
	 background: #784014 !important;
}
 .loyalD2.card5 .cardnnoD2, .loyalD2.card5 .memberidD2, .loyalD2.card5 .rankingNameD2 p {
	 color: #c0584e !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD2.card5 .rankingNameD2 .loyalprogram-progress {
	 background: #c0584e !important;
}
 .loyalD2.card6 .cardnnoD2, .loyalD2.card6 .memberidD2, .loyalD2.card6 .rankingNameD2 p, .loyalD2.card7 .cardnnoD2, .loyalD2.card7 .memberidD2, .loyalD2.card7 .rankingNameD2 p {
	 color: #445054 !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD2.card6 .rankingNameD2 .loyalprogram-progress, .loyalD2.card7 .rankingNameD2 .loyalprogram-progress {
	 background: #445054 !important;
}
 .loyalD2.card8 .cardnnoD2, .loyalD2.card8 .memberidD2, .loyalD2.card8 .rankingNameD2 p {
	 color: #7b3f13 !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD2.card8 .rankingNameD2 .loyalprogram-progress {
	 background: #7b3f13 !important;
}
 .loyalD2.card9 .cardnnoD2, .loyalD2.card9 .memberidD2 {
	 color: #e5e5e5;
	 text-shadow: 1px 1px 3px #898383;
}
 .loyalD2.card9 .rankingNameD2 {
	 background: -webkit-linear-gradient(360deg, #feb81a, #ed16cb) !important;
	 -webkit-background-clip: text !important;
	 -webkit-text-fill-color: transparent;
}
 .loyalD2.card9 .rankingNameD2 .loyalprogram-progress {
	 background: rgba(254, 184, 26, 1.0);
	 background: linear-gradient(90deg, rgba(254, 184, 26, 1.0), rgba(237, 22, 203, 1.0));
}
 .loyalD2 .cardnyearD2 {
	 display: none;
}
/*badge 3 design */
 .loyalD3 {
	 background-size: 100% 100% !important;
	 background-repeat: no-repeat !important;
	 height: 154px;
	 position: relative;
	 width: 272px;
	 border-radius: 10px;
	 border: 1px solid #fff;
	 -webkit-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 -moz-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 overflow: hidden;
}
 .loyalD3::before {
	 background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
	 content: "";
	 display: block;
	 height: 100%;
	 left: -75%;
	 position: absolute;
	 top: 0;
	 transform: skewX(-25deg);
	 width: 50%;
	 z-index: 2;
}
 .loyalD3:hover::before, .loyalD3:focus::before {
	 animation: cardshine 0.85s;
}
 .loyalD3 .badgeD3_0, .loyalD3 .badgeD3_1, .loyalD3 .badgeD3_2, .loyalD3 .badgeD3_3, .loyalD3 .badgeD3_4 {
	 position: absolute;
	 right: 35px;
	 width: 48px;
	 top: 20px;
}
 .loyalD3 .badgeD3_5, .loyalD3 .badgeD3_6, .loyalD3 .badgeD3_7, .loyalD3 .badgeD3_8, .loyalD3 .badgeD3_9 {
	 position: absolute;
	 right: 20px;
	 width: 80px;
	 top: 20px;
}
 .loyalD3 .cardnnoD3 {
	 position: absolute;
	 bottom: 10px;
	 font-size: 25px;
	 left: 15.6px;
	 letter-spacing: 1.2px;
	 font-family: 'Rajdhani', sans-serif !important;
	 font-weight: 600;
}
 .loyalD3 .memberidD3 {
	 position: absolute;
	 top: 15px;
	 left: 15.6px;
	 color: #fff;
	 font-weight: bold;
	 text-transform: uppercase;
	 font-family: 'Montserrat', sans-serif !important;
}
 .loyalD3 .rankingNameD3 {
	 position: absolute;
	 top: 42px;
	 left: 15.6px;
	 font-weight: bold;
	 font-size: 35px;
	 text-align: left;
	 text-transform: uppercase;
	 font-family: 'Montserrat', sans-serif !important;
	/*text-shadow: #35332f 1px 0 3px;
	*/
}
 .loyalD3.card0 .cardnnoD3, .loyalD3.card0 .memberidD3, .loyalD3.card0 .rankingNameD3 p {
	 color: #63512d !important;
	 text-shadow: 0px 1px 1px #fff;
}
 .loyalD3.card0 .rankingNameD3 .loyalprogram-progress {
	 background: #63512d !important;
}
 .loyalD3.card1 .cardnnoD3, .loyalD3.card1 .memberidD3, .loyalD3.card1 .rankingNameD3 p {
	 color: #474748 !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD3.card1 .rankingNameD3 .loyalprogram-progress {
	 background: #474748 !important;
}
 .loyalD3.card2 .cardnnoD3, .loyalD3.card2 .memberidD3, .loyalD3.card2 .rankingNameD3, .loyalD3.card5 .cardnnoD3, .loyalD3.card5 .memberidD3, .loyalD3.card5 .rankingNameD3 {
	 color: #7c4116 !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD3.card2 .rankingNameD3 .loyalprogram-progress, .loyalD3.card5 .rankingNameD3 .loyalprogram-progress {
	 background: #7c4116 !important;
}
 .loyalD3.card3 .cardnnoD3, .loyalD3.card3 .memberidD3, .loyalD3.card3 .rankingNameD3, .loyalD3.card6 .cardnnoD3, .loyalD3.card6 .memberidD3, .loyalD3.card6 .rankingNameD3 {
	 color: #435053 !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD3.card3 .rankingNameD3 .loyalprogram-progress, .loyalD3.card6 .rankingNameD3 .loyalprogram-progress {
	 background: #435053 !important;
}
 .loyalD3.card4 .cardnnoD3, .loyalD3.card4 .memberidD3, .loyalD3.card4 .rankingNameD3, .loyalD3.card7 .cardnnoD3, .loyalD3.card7 .memberidD3, .loyalD3.card7 .rankingNameD3 {
	 color: #d77103 !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD3.card4 .rankingNameD3 .loyalprogram-progress, .loyalD3.card7 .rankingNameD3 .loyalprogram-progress {
	 background: #d77103 !important;
}
 .loyalD3.card8 .cardnnoD3, .loyalD3.card8 .memberidD3, .loyalD3.card8 .rankingNameD3 {
	 color: #286b9c !important;
	 text-shadow: 1px 1px 3px #fff;
}
 .loyalD3.card8 .rankingNameD3 .loyalprogram-progress {
	 background: #286b9c !important;
}
 .loyalD3.card9 .cardnnoD3, .loyalD3.card9 .memberidD3 {
	 color: #e5e5e5;
	 text-shadow: 1px 1px 3px #898383;
}
 .loyalD3.card9 .rankingNameD3 {
	 background: -webkit-linear-gradient(360deg, #feb81a, #ed16cb) !important;
	 -webkit-background-clip: text !important;
	 -webkit-text-fill-color: transparent;
}
 .loyalD3.card9 .rankingNameD3 .loyalprogram-progress {
	 background: rgba(254, 184, 26, 1.0);
	 background: linear-gradient(90deg, rgba(254, 184, 26, 1.0), rgba(237, 22, 203, 1.0));
}
 .loyalD3 .cardnyearD3 {
	 display: none;
}
/*badge 4 design */
 .loyalD4 {
	 background-size: 100% 100% !important;
	 background-repeat: no-repeat !important;
	 height: 154px;
	 position: relative;
	 width: 272px;
	 border-radius: 10px;
	 border: 1px solid #fff;
	 -webkit-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 -moz-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 overflow: hidden;
}
 .loyalD4::before {
	 background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
	 content: "";
	 display: block;
	 height: 100%;
	 left: -75%;
	 position: absolute;
	 top: 0;
	 transform: skewX(-25deg);
	 width: 50%;
	 z-index: 2;
}
 .loyalD4:hover::before, .loyalD4:focus::before {
	 animation: cardshine 0.85s;
}
 .loyalD4 .badgeD4_0, .loyalD4 .badgeD4_1, .loyalD4 .badgeD4_2 {
	 width: 50px;
	 position: absolute;
	 left: 18px;
	 top: 20px;
}
 .loyalD4 .badgeD4_3 {
	 width: 65px;
	 position: absolute;
	 left: 18px;
	 top: 20px;
}
 .loyalD4 .badgeD4_4, .loyalD4 .badgeD4_5, .loyalD4 .badgeD4_6, .loyalD4 .badgeD4_7, .loyalD4 .badgeD4_8 {
	 width: 75px;
	 position: absolute;
	 left: 18px;
	 top: 20px;
}
 .loyalD4 .badgeD4_9 {
	 width: 70px;
	 position: absolute;
	 left: 18px;
	 top: 8px;
}
 .loyalD4 .cardnnoD4 {
	 position: absolute;
	 bottom: 30px;
	 color: #fff !important;
	 font-size: 26px;
	 left: 17.5px;
	 letter-spacing: 1.2px;
	 font-family: 'Rajdhani', sans-serif !important;
	 font-weight: 600;
	 text-shadow: 1px 1px 1px #161515;
}
 .loyalD4 .memberidD4 {
	 position: absolute;
	 bottom: 12.48px;
	 left: 17.5px;
	 color: #fff;
	 font-weight: bold;
	 font-size: 13px;
	 text-transform: uppercase;
	 font-family: 'Montserrat', sans-serif !important;
	 text-shadow: 1px 1px 1px #161515;
}
 .loyalD4 .cardnyearD4, .loyalD4 .rankingNameD4 {
	 display: none;
}
/*badge 5 design */
 .loyalD5 {
	 background-size: 100% 100% !important;
	 background-repeat: no-repeat !important;
	 height: 154px;
	 position: relative;
	 width: 272px;
	 border-radius: 10px;
	 border: 1px solid #999494;
	 -webkit-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 -moz-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 overflow: hidden;
}
 .loyalD5::before {
	 background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
	 content: "";
	 display: block;
	 height: 100%;
	 left: -75%;
	 position: absolute;
	 top: 0;
	 transform: skewX(-25deg);
	 width: 50%;
	 z-index: 2;
}
 .loyalD5:hover::before, .loyalD5:focus::before {
	 animation: cardshine 0.85s;
}
 .loyalD5 .badgeD5_0, .loyalD5 .badgeD5_1, .loyalD5 .badgeD5_2, .loyalD5 .badgeD5_3, .loyalD5 .badgeD5_4, .loyalD5 .badgeD5_5, .loyalD5 .badgeD5_6 {
	 width: 50px;
	 position: absolute;
	 left: 18px;
	 top: 20px;
}
 .loyalD5 .badgeD5_7 {
	 width: 80px;
	 position: absolute;
	 left: 18px;
	 top: 15px;
}
 .loyalD5 .badgeD5_8, .loyalD5 .badgeD5_9 {
	 width: 88px;
	 position: absolute;
	 left: 12px;
	 top: 0px;
}
 .loyalD5 .cardnnoD5 {
	 position: absolute;
	 bottom: 30px;
	 color: #fff !important;
	 font-size: 26px;
	 left: 17.5px;
	 letter-spacing: 1.2px;
	 font-family: 'Rajdhani', sans-serif !important;
	 font-weight: 600;
	 text-shadow: 1px 1px 1px #161515;
}
 .loyalD5 .memberidD5 {
	 position: absolute;
	 bottom: 12.48px;
	 left: 17.5px;
	 color: #fff;
	 font-weight: bold;
	 font-size: 13px;
	 text-transform: uppercase;
	 font-family: 'Montserrat', sans-serif !important;
	 text-shadow: 1px 1px 1px #161515;
}
 .loyalD5 .cardnyearD5, .loyalD5 .rankingNameD5 {
	 display: none;
}
/*badge 6 design */
 .loyalD6 {
	 background-size: 100% 100% !important;
	 background-repeat: no-repeat !important;
	 height: 154px;
	 position: relative;
	 width: 272px;
	 border-radius: 10px;
	 border: 1px solid #999494;
	 -webkit-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 -moz-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
	 overflow: hidden;
}
 .loyalD6::before {
	 background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
	 content: "";
	 display: block;
	 height: 100%;
	 left: -75%;
	 position: absolute;
	 top: 0;
	 transform: skewX(39deg);
	 width: 39%;
	 z-index: 2;
}
 .loyalD6:hover::before, .loyalD6:focus::before {
	 animation: cardshine 0.85s;
}
 .loyalD6 .badgeD6_0, .loyalD6 .badgeD6_1 {
	 position: absolute;
	 left: 18px;
	 top: 13px;
	 width: 42px;
}
 .loyalD6 .badgeD6_2, .loyalD6 .badgeD6_3 {
	 position: absolute;
	 left: 15px;
	 top: 13px;
	 width: 52px;
}
 .loyalD6 .badgeD6_4, .loyalD6 .badgeD6_5 {
	 position: absolute;
	 left: 15px;
	 top: 13px;
	 width: 54px;
}
 .loyalD6 .badgeD6_6 {
	 position: absolute;
	 left: 15px;
	 top: 13px;
	 width: 70px;
}
 .loyalD6 .badgeD6_7 {
	 position: absolute;
	 left: 15px;
	 top: 10px;
	 width: 70px;
}
 .loyalD6 .badgeD6_8, .loyalD6 .badgeD6_9 {
	 position: absolute;
	 left: 15px;
	 top: 10px;
	 width: 72px;
}
 .loyalD6 .cardnnoD6 {
	 position: absolute;
	 bottom: 40px;
	 color: #fff !important;
	 left: 15.6px;
	 letter-spacing: 1.2px;
	 font-size: 26px;
	 font-family: 'Rajdhani', sans-serif !important;
	 font-weight: 600;
	 text-shadow: 1px 1px 1px #211c1c;
}
 .loyalD6 .memberidD6 {
	 position: absolute;
	 bottom: 12.48px;
	 left: 15.6px;
	 color: #fff;
	 font-weight: 600;
	 font-size: 13px;
	 text-align: left;
	 text-transform: uppercase;
	 font-family: 'Montserrat', sans-serif !important;
	 text-shadow: 1px 1px 1px #211c1c;
}
 .loyalD6 .cardnyearD6 {
	 position: absolute;
	 bottom: 12.48px;
	 left: 219.2px;
	 color: #fff;
	 font-weight: 600;
	 font-size: 13px;
	 text-align: right;
	 font-family: 'Montserrat', sans-serif !important;
	 text-shadow: 1px 1px 1px #211c1c;
}
 .loyalD6 .rankingNameD6 {
	 display: none;
}
 

@keyframes cardshine {
    100% {
        left: 125%;
    }
}

.loyalprogram-info {
    max-width: 1000px;
    margin: 0px auto;
}

    .loyalprogram-info .title {
        font-size: 45px;
        font-family: 'Bell MT', Georgia, ui-serif !important;
    }


    .loyalprogram-info .loyalty-workflow  h5 {
        font-size: 1.25rem;
        margin-bottom: .5rem;
    }
    .loyalprogram-info .loyalty-workflow p {
        font-size: .9em;
        margin-bottom: 0px;
    }

@media (max-width: 576px) {
    /*.loyalprogram-info {
        padding: 30px 0
    }*/

        .loyalprogram-info .title {
            font-size: 35px;
        }
}

.loyalprogram-info .table-title {
    color: #459E85;
}
.loyalprogram-info .h6, .loyalprogram-info h6 {
    font-size: 1rem;
}
.loyalprogram-info .tab-content {
    box-shadow: none;
}
.loyalprogram-info .tab-content .card {
    border-radius: 0.75rem;
}
.loyalprogram-info  li.nav-item:hover{
    background:transparent
}
.loyalprogram-info .nav-pills .nav-link {
    background: transparent;
    border: none;
    width: 130px;
    height: 100px;
    opacity: 0.6;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    /*width:100%;*/
}

    .loyalprogram-info .nav-pills .nav-link img {
        width: 35px;
        position: absolute;
        top: 35%;
        transform: translateY(-35%);
    }

    .loyalprogram-info .nav-pills .nav-link.D1C1 img,
    .loyalprogram-info .nav-pills .nav-link.D1C2 img,
    .loyalprogram-info .nav-pills .nav-link.D1C3 img,
    .loyalprogram-info .nav-pills .nav-link.D1C4 img,
    .loyalprogram-info .nav-pills .nav-link.D1C5 img {
        width: 38px;
    }

    .loyalprogram-info .nav-pills .nav-link.D1C6 img {
        width: 46px;
    }

    .loyalprogram-info .nav-pills .nav-link.D1C7 img {
        width: 38px;
    }

    .loyalprogram-info .nav-pills .nav-link.D1C8 img,
    .loyalprogram-info .nav-pills .nav-link.D1C9 img {
        width: 45px;
    }

    .loyalprogram-info .nav-pills .nav-link.D2C7 img,
    .loyalprogram-info .nav-pills .nav-link.D2C8 img,
    .loyalprogram-info .nav-pills .nav-link.D2C9 img {
        width: 50px;
    }

    .loyalprogram-info .nav-pills .nav-link.D3C5 img,
    .loyalprogram-info .nav-pills .nav-link.D3C6 img,
    .loyalprogram-info .nav-pills .nav-link.D3C7 img,
    .loyalprogram-info .nav-pills .nav-link.D3C8 img,
    .loyalprogram-info .nav-pills .nav-link.D3C9 img {
        width: 50px;
    }

    .loyalprogram-info .nav-pills .nav-link.D4C3 img,
    .loyalprogram-info .nav-pills .nav-link.D4C4 img,
    .loyalprogram-info .nav-pills .nav-link.D4C5 img,
    .loyalprogram-info .nav-pills .nav-link.D4C6 img,
    .loyalprogram-info .nav-pills .nav-link.D4C7 img {
        width: 45px;
    }

    .loyalprogram-info .nav-pills .nav-link.D4C8 img,
    .loyalprogram-info .nav-pills .nav-link.D4C9 img {
        width: 47px;
    }

    .loyalprogram-info .nav-pills .nav-link.D5C7 img {
        width: 50px;
    }

    .loyalprogram-info .nav-pills .nav-link.D5C8 img,
    .loyalprogram-info .nav-pills .nav-link.D5C9 img {
        width: 60px;
    }

    .loyalprogram-info .nav-pills .nav-link.D6C2 img,
    .loyalprogram-info .nav-pills .nav-link.D6C3 img,
    .loyalprogram-info .nav-pills .nav-link.D6C4 img,
    .loyalprogram-info .nav-pills .nav-link.D6C5 img {
        width: 40px;
    }
    .loyalprogram-info .nav-pills .nav-link.D6C6 img,
    .loyalprogram-info .nav-pills .nav-link.D6C7 img,
    .loyalprogram-info .nav-pills .nav-link.D6C8 img,
    .loyalprogram-info .nav-pills .nav-link.D6C9 img {
        width: 55px;
    }

    .loyalprogram-info .nav-pills .nav-link p {
        position: absolute;
        bottom: .5rem;
        text-align: center;
        width: 100%;
        text-shadow: 1px 1px #000;
        margin-bottom: 0;
        font-size: 15px;
    }

    .loyalprogram-info .nav-pills .nav-link.active {
        background: rgba(0, 0, 0, .2);
        box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 4px;
        border-radius: 0.5rem;
        opacity: 1;
        font-weight: bold;
    }

.loyalprogram-info .nav.nav-pills::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.loyalprogram-info .nav.nav-pills::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.loyalprogram-info .nav.nav-pills::-webkit-scrollbar-thumb {
    background: rgb(115 121 123);
    border-radius: 10px;
}

    .loyalprogram-info .nav.nav-pills::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

.loyalprogram-info .info-wrapper {
    background: rgb(41 45 46);
    border: solid 1px #6c757d;
    padding: 10px;
    border-radius: 0.5rem;
}

    .loyalprogram-info .info-wrapper .text-secondary {
        color: #98a4af !important;
    }

/* theme color loyalty  bg */
.theme-loyalbgvip.D1C0 {
    background: linear-gradient(313deg, rgba(116, 189, 17, 0) 68.25%, rgba(116, 189, 17, 0.2) 100.63%), linear-gradient(359deg, rgba(116, 189, 17, 0) 13.75%, rgba(116, 189, 17, .2) 134.65%), linear-gradient(319deg, rgba(116, 189, 17, 0) 54.68%, rgba(116, 189, 17, .2) 111.39%)
}

.theme-loyalbgvip.D1C1 {
    background: linear-gradient(313deg, rgba(26, 154, 226, 0) 68.25%, rgba(26, 154, 226, 0.2) 100.63%), linear-gradient(359deg, rgba(26, 154, 226, 0) 13.75%, rgba(26, 154, 226, .2) 134.65%), linear-gradient(319deg, rgba(26, 154, 226, 0) 54.68%, rgba(26, 154, 226, .2) 111.39%)
}

.theme-loyalbgvip.D1C2 {
    background: linear-gradient(313deg, rgba(240, 50, 232, 0) 68.25%, rgba(240, 50, 232, 0.2) 100.63%), linear-gradient(359deg, rgba(240, 50, 232, 0) 13.75%, rgba(240, 50, 232, .2) 134.65%), linear-gradient(319deg, rgba(240, 50, 232, 0) 54.68%, rgba(240, 50, 232, .2) 111.39%);
}

.theme-loyalbgvip.D1C3 {
    background: linear-gradient(313deg, rgba(24, 164, 255, 0) 68.25%, rgba(24, 164, 255, 0.2) 100.63%), linear-gradient(359deg, rgba(24, 164, 255, 0) 13.75%, rgba(24, 164, 255, .2) 134.65%), linear-gradient(319deg, rgba(24, 164, 255, 0) 54.68%, rgba(24, 164, 255, .2) 111.39%)
}

.theme-loyalbgvip.D1C4 {
    background: linear-gradient(313deg, rgba(167, 69, 219, 0) 68.25%, rgba(167, 69, 219, 0.2) 100.63%), linear-gradient(359deg, rgba(167, 69, 219, 0) 13.75%, rgba(167, 69, 219, .2) 134.65%), linear-gradient(319deg, rgba(167, 69, 219, 0) 54.68%, rgba(167, 69, 219, .2) 111.39%);
}

.theme-loyalbgvip.D1C5 {
    background: linear-gradient(313deg, rgba(224, 27, 65, 0) 68.25%, rgba(224, 27, 65, 0.2) 100.63%), linear-gradient(359deg, rgba(224, 27, 65, 0) 13.75%, rgba(224, 27, 65, .2) 134.65%), linear-gradient(319deg, rgba(224, 27, 65, 0) 54.68%, rgba(224, 27, 65, .2) 111.39%);
}

.theme-loyalbgvip.D1C6 {
    background: linear-gradient(313deg, rgba(65, 177, 89, 0) 68.25%, rgba(65, 177, 89, 0.2) 100.63%), linear-gradient(359deg, rgba(65, 177, 89, 0) 13.75%, rgba(65, 177, 89, .2) 134.65%), linear-gradient(319deg, rgba(65, 177, 89, 0) 54.68%, rgba(65, 177, 89, .2) 111.39%);
}

.theme-loyalbgvip.D1C7 {
    background: linear-gradient(313deg, rgba(246, 120, 12, 0) 68.25%, rgba(246, 120, 12, 0.2) 100.63%), linear-gradient(359deg, rgba(246, 120, 12, 0) 13.75%, rgba(246, 120, 12, .2) 134.65%), linear-gradient(319deg, rgba(246, 120, 12, 0) 54.68%, rgba(246, 120, 12, .2) 111.39%)
}

.theme-loyalbgvip.D1C8 {
    background: linear-gradient(313deg, rgba(229, 61, 28, 0) 68.25%, rgba(229, 61, 28, 0.2) 100.63%), linear-gradient(359deg, rgba(229, 61, 28, 0) 13.75%, rgba(229, 61, 28, .2) 134.65%), linear-gradient(319deg, rgba(229, 61, 28, 0) 54.68%, rgba(229, 61, 28, .2) 111.39%);
}

.theme-loyalbgvip.D1C9 {
    background: linear-gradient(313deg, rgba(105, 0, 253, 0) 68.25%, rgba(105, 0, 253, 0.2) 100.63%), linear-gradient(359deg, rgba(105, 0, 253, 0) 13.75%, rgba(105, 0, 253, .2) 134.65%), linear-gradient(319deg, rgba(105, 0, 253, 0) 54.68%, rgba(105, 0, 253, .2) 111.39%);
}


.theme-loyalbgvip.D2C0 {
    background: linear-gradient(313deg, rgba(171, 133, 72, 0) 68.25%, rgba(171, 133, 72, 0.2) 100.63%), linear-gradient(359deg, rgba(171, 133, 72, 0) 13.75%, rgba(171, 133, 72, .2) 134.65%), linear-gradient(319deg, rgba(171, 133, 72, 0) 54.68%, rgba(171, 133, 72, .2) 111.39%)
}

.theme-loyalbgvip.D2C1, .theme-loyalbgvip.D2C3 {
    background: linear-gradient(313deg, rgba(136, 145, 148, 0) 68.25%, rgba(136, 145, 148, 0.2) 100.63%), linear-gradient(359deg, rgba(136, 145, 148, 0) 13.75%, rgba(136, 145, 148, .2) 134.65%), linear-gradient(319deg, rgba(136, 145, 148, 0) 54.68%, rgba(136, 145, 148, .2) 111.39%);
}

.theme-loyalbgvip.D2C2, .theme-loyalbgvip.D2C4 {
    background: linear-gradient(313deg, rgba(169, 99, 51, 0) 68.25%, rgba(169, 99, 51, 0.2) 100.63%), linear-gradient(359deg, rgba(169, 99, 51, 0) 13.75%, rgba(169, 99, 51, .2) 134.65%), linear-gradient(319deg, rgba(169, 99, 51, 0) 54.68%, rgba(169, 99, 51, .2) 111.39%);
}

.theme-loyalbgvip.D2C5 {
    background: linear-gradient(313deg, rgba(243, 180, 152, 0) 68.25%, rgba(243, 180, 152, 0.2) 100.63%), linear-gradient(359deg, rgba(243, 180, 152, 0) 13.75%, rgba(243, 180, 152, .2) 134.65%), linear-gradient(319deg, rgba(243, 180, 152, 0) 54.68%, rgba(243, 180, 152, .2) 111.39%);
}

.theme-loyalbgvip.D2C6, .theme-loyalbgvip.D2C7 {
    background: linear-gradient(313deg, rgba(163, 182, 209, 0) 68.25%, rgba(163, 182, 209, 0.2) 100.63%), linear-gradient(359deg, rgba(163, 182, 209, 0) 13.75%, rgba(163, 182, 209, .2) 134.65%), linear-gradient(319deg, rgba(163, 182, 209, 0) 54.68%, rgba(163, 182, 209, .2) 111.39%)
}

.theme-loyalbgvip.D2C8 {
    background: linear-gradient(313deg, rgba(238, 168, 21, 0) 68.25%, rgba(238, 168, 21, 0.2) 100.63%), linear-gradient(359deg, rgba(238, 168, 21, 0) 13.75%, rgba(238, 168, 21, .2) 134.65%), linear-gradient(319deg, rgba(238, 168, 21, 0) 54.68%, rgba(238, 168, 21, .2) 111.39%);
}

.theme-loyalbgvip.D2C9 {
    background: linear-gradient(313deg, rgba(237, 22, 203, 0) 68.25%, rgba(237, 22, 203, 0.2) 100.63%), linear-gradient(359deg, rgba(237, 22, 203, 0) 13.75%, rgba(237, 22, 203, .2) 134.65%), linear-gradient(319deg, rgba(237, 22, 203, 0) 54.68%, rgba(237, 22, 203, .2) 111.39%);
}

.theme-loyalbgvip.D3C0 {
    background: linear-gradient(313deg, rgba(171, 133, 72, 0) 68.25%, rgba(171, 133, 72, 0.2) 100.63%), linear-gradient(359deg, rgba(171, 133, 72, 0) 13.75%, rgba(171, 133, 72, .2) 134.65%), linear-gradient(319deg, rgba(171, 133, 72, 0) 54.68%, rgba(171, 133, 72, .2) 111.39%)
}
.theme-loyalbgvip.D3C1 {
    background: linear-gradient(313deg, rgba(136, 145, 148, 0) 68.25%, rgba(136, 145, 148, 0.2) 100.63%), linear-gradient(359deg, rgba(136, 145, 148, 0) 13.75%, rgba(136, 145, 148, .2) 134.65%), linear-gradient(319deg, rgba(136, 145, 148, 0) 54.68%, rgba(136, 145, 148, .2) 111.39%)
}

.theme-loyalbgvip.D3C2, .theme-loyalbgvip.D3C5 {
    background: linear-gradient(313deg, rgba(192, 98, 106, 0) 68.55%, rgba(192, 98, 106, 0.5) 100.63%), linear-gradient(359deg, rgba(192, 98, 106, 0) 13.75%, rgba(192, 98, 106, .5) 134.65%), linear-gradient(319deg, rgba(192, 98, 106, 0) 54.68%, rgba(192, 98, 106, .5) 111.39%)
}

.theme-loyalbgvip.D3C3, .theme-loyalbgvip.D3C6 {
    background: linear-gradient(313deg, rgba(66, 73, 115, 0) 68.55%, rgba(66, 73, 115, 0.5) 100.63%), linear-gradient(359deg, rgba(66, 73, 115, 0) 13.75%, rgba(66, 73, 115, .5) 134.65%), linear-gradient(319deg, rgba(66, 73, 115, 0) 54.68%, rgba(66, 73, 115, .5) 111.39%)
}

.theme-loyalbgvip.D3C4, .theme-loyalbgvip.D3C7 {
    background: linear-gradient(313deg, rgba(231, 179, 78, 0) 68.55%, rgba(231, 179, 78, 0.5) 100.63%), linear-gradient(359deg, rgba(231, 179, 78, 0) 13.75%, rgba(231, 179, 78, .5) 134.65%), linear-gradient(319deg, rgba(231, 179, 78, 0) 54.68%, rgba(231, 179, 78, .5) 111.39%)
}

.theme-loyalbgvip.D3C8 {
    background: linear-gradient(313deg, rgba(18, 121, 224, 0) 68.55%, rgba(18, 121, 224, 0.5) 100.63%), linear-gradient(359deg, rgba(18, 121, 224, 0) 13.75%, rgba(18, 121, 224, .5) 134.65%), linear-gradient(319deg, rgba(18, 121, 224, 0) 54.68%, rgba(18, 121, 224, .5) 111.39%)
}

.theme-loyalbgvip.D3C9 {
    background: linear-gradient(90deg, rgba(254, 184, 26, .3), rgba(237, 22, 203, 0.3));
}

.theme-loyalbgvip.D4C0 {
    background: linear-gradient(313deg, rgb(0, 104, 55, 0) 68.25%, rgba(0, 104, 55, 0.2) 100.63%), linear-gradient(359deg, rgba(0, 104, 55, 0) 13.75%, rgba(0, 104, 55, .2) 134.65%), linear-gradient(319deg, rgba(0, 104, 55, 0) 54.68%, rgba(0, 104, 55, .2) 111.39%)
}

.theme-loyalbgvip.D4C1 {
    background: linear-gradient(313deg, rgb(84, 16, 26, 0) 68.25%, rgba(84, 16, 26, 0.2) 100.63%), linear-gradient(359deg, rgba(84, 16, 26, 0) 13.75%, rgba(84, 16, 26, .2) 134.65%), linear-gradient(319deg, rgba(84, 16, 26, 0) 54.68%, rgba(84, 16, 26, .2) 111.39%)
}

.theme-loyalbgvip.D4C2 {
    background: linear-gradient(313deg, rgb(27, 20, 100, 0) 68.25%, rgba(27, 20, 100, 0.2) 100.63%), linear-gradient(359deg, rgba(27, 20, 100, 0) 13.75%, rgba(27, 20, 100, .2) 134.65%), linear-gradient(319deg, rgba(27, 20, 100, 0) 54.68%, rgba(27, 20, 100, .2) 111.39%);
}

.theme-loyalbgvip.D4C3 {
    background: linear-gradient(313deg, rgba(32, 96, 153, 0) 68.25%, rgba(32, 96, 153, 0.2) 100.63%), linear-gradient(359deg, rgba(32, 96, 153, 0) 13.75%, rgba(32, 96, 153, .2) 134.65%), linear-gradient(319deg, rgba(32, 96, 153, 0) 54.68%, rgba(32, 96, 153, .2) 111.39%)
}

.theme-loyalbgvip.D4C4 {
    background: linear-gradient(313deg, rgba(241, 90, 36, 0) 68.25%, rgba(241, 90, 36, 0.2) 100.63%), linear-gradient(359deg, rgba(241, 90, 36, 0) 13.75%, rgba(241, 90, 36, .2) 134.65%), linear-gradient(319deg, rgba(241, 90, 36, 0) 54.68%, rgba(241, 90, 36, .2) 111.39%);
}

.theme-loyalbgvip.D4C5 {
    background: linear-gradient(313deg, rgba(83, 71, 65, 0) 68.25%, rgba(83, 71, 65, 0.2) 100.63%), linear-gradient(359deg, rgba(83, 71, 65, 0) 13.75%, rgba(83, 71, 65, .2) 134.65%), linear-gradient(319deg, rgba(83, 71, 65, 0) 54.68%, rgba(83, 71, 65, .2) 111.39%);
}

.theme-loyalbgvip.D4C6 {
    background: linear-gradient(313deg, rgba(102, 45, 145, 0) 68.25%, rgba(102, 45, 145, 0.2) 100.63%), linear-gradient(359deg, rgba(102, 45, 145, 0) 13.75%, rgba(102, 45, 145, .2) 134.65%), linear-gradient(319deg, rgba(102, 45, 145, 0) 54.68%, rgba(102, 45, 145, .2) 111.39%);
}

.theme-loyalbgvip.D4C7 {
    background: linear-gradient(313deg, rgba(83, 71, 65, 0) 68.25%, rgba(83, 71, 65, 0.2) 100.63%), linear-gradient(359deg, rgba(83, 71, 65, 0) 13.75%, rgba(83, 71, 65, .2) 134.65%), linear-gradient(319deg, rgba(83, 71, 65, 0) 54.68%, rgba(83, 71, 65, .2) 111.39%)
}

.theme-loyalbgvip.D4C8 {
    background: linear-gradient(313deg, rgba(175, 11, 31, 0) 68.25%, rgba(175, 11, 31, 0.2) 100.63%), linear-gradient(359deg, rgba(175, 11, 31, 0) 13.75%, rgba(175, 11, 31, .2) 134.65%), linear-gradient(319deg, rgba(175, 11, 31, 0) 54.68%, rgba(175, 11, 31, .2) 111.39%);
}

.theme-loyalbgvip.D4C9 {
    background: linear-gradient(313deg, rgba(155, 0, 208, 0) 68.25%, rgba(155, 0, 208, 0.2) 100.63%), linear-gradient(359deg, rgba(155, 0, 208, 0) 13.75%, rgba(155, 0, 208, .2) 134.65%), linear-gradient(319deg, rgba(155, 0, 208, 0) 54.68%, rgba(155, 0, 208, .2) 111.39%);
}

.theme-loyalbgvip.D5C0 {
    background: linear-gradient(313deg,rgb(65, 71, 106, 0) 68.25%, rgba(65, 71, 106, 0.2) 100.63%), linear-gradient(359deg, rgba(65, 71, 106, 0) 13.75%, rgba(65, 71, 106, .2) 134.65%), linear-gradient(319deg, rgba(65, 71, 106, 0) 54.68%, rgba(65, 71, 106, .2) 111.39%)
}

.theme-loyalbgvip.D5C1 {
    background: linear-gradient(313deg, rgb(57, 47, 23, 0) 68.25%, rgba(57, 47, 23, 0.2) 100.63%), linear-gradient(359deg, rgba(57, 47, 23, 0) 13.75%, rgba(57, 47, 23, .2) 134.65%), linear-gradient(319deg, rgba(57, 47, 23, 0) 54.68%, rgba(57, 47, 23, .2) 111.39%)
}

.theme-loyalbgvip.D5C2 {
    background: linear-gradient(313deg, rgb(134, 142, 133, 0) 68.25%, rgba(134, 142, 133, 0.2) 100.63%), linear-gradient(359deg, rgba(134, 142, 133, 0) 13.75%, rgba(134, 142, 133, .2) 134.65%), linear-gradient(319deg, rgba(134, 142, 133, 0) 54.68%, rgba(134, 142, 133, .2) 111.39%);
}

.theme-loyalbgvip.D5C3 {
    background: linear-gradient(313deg, rgba(155, 107, 45, 0) 68.25%, rgba(155, 107, 45, 0.2) 100.63%), linear-gradient(359deg, rgba(155, 107, 45, 0) 13.75%, rgba(155, 107, 45, .2) 134.65%), linear-gradient(319deg, rgba(155, 107, 45, 0) 54.68%, rgba(155, 107, 45, .2) 111.39%)
}

.theme-loyalbgvip.D5C4 {
    background: linear-gradient(313deg, rgba(113, 78, 54, 0) 68.25%, rgba(113, 78, 54, 0.2) 100.63%), linear-gradient(359deg, rgba(113, 78, 54, 0) 13.75%, rgba(113, 78, 54, .2) 134.65%), linear-gradient(319deg, rgba(113, 78, 54, 0) 54.68%, rgba(113, 78, 54, .2) 111.39%);
}

.theme-loyalbgvip.D5C5 {
    background: linear-gradient(313deg, rgba(27, 20, 100, 0) 68.25%, rgba(27, 20, 100, 0.2) 100.63%), linear-gradient(359deg, rgba(27, 20, 100, 0) 13.75%, rgba(27, 20, 100, .2) 134.65%), linear-gradient(319deg, rgba(27, 20, 100, 0) 54.68%, rgba(27, 20, 100, .2) 111.39%);
}

.theme-loyalbgvip.D5C6 {
    background: linear-gradient(313deg, rgba(31, 80, 51, 0) 68.25%, rgba(31, 80, 51, 0.2) 100.63%), linear-gradient(359deg, rgba(31, 80, 51, 0) 13.75%, rgba(31, 80, 51, .2) 134.65%), linear-gradient(319deg, rgba(31, 80, 51, 0) 54.68%, rgba(31, 80, 51, .2) 111.39%);
}

.theme-loyalbgvip.D5C7 {
    background: linear-gradient(313deg, rgba(44, 59, 108, 0) 68.25%, rgba(44, 59, 108, 0.2) 100.63%), linear-gradient(359deg, rgba(44, 59, 108, 0) 13.75%, rgba(44, 59, 108, .2) 134.65%), linear-gradient(319deg, rgba(44, 59, 108, 0) 54.68%, rgba(44, 59, 108, .2) 111.39%)
}

.theme-loyalbgvip.D5C8 {
    background: linear-gradient(313deg, rgba(86, 19, 95, 0) 68.25%, rgba(86, 19, 95, 0.2) 100.63%), linear-gradient(359deg, rgba(86, 19, 95, 0) 13.75%, rgba(86, 19, 95, .2) 134.65%), linear-gradient(319deg, rgba(86, 19, 95, 0) 54.68%, rgba(86, 19, 95, .2) 111.39%);
}

.theme-loyalbgvip.D5C9 {
    background: linear-gradient(313deg,rgba(98, 20, 28, 0) 68.25%, rgba(98, 20, 28, 0.2) 100.63%), linear-gradient(359deg, rgba(98, 20, 28, 0) 13.75%, rgba(98, 20, 28, .2) 134.65%), linear-gradient(319deg, rgba(98, 20, 28, 0) 54.68%, rgba(98, 20, 28, .2) 111.39%);
}

.theme-loyalbgvip.D6C0, .theme-loyalbgvip.D6C1, .theme-loyalbgvip.D6C2, .theme-loyalbgvip.D6C3, .theme-loyalbgvip.D6C4, .theme-loyalbgvip.D6C5, .theme-loyalbgvip.D6C6, .theme-loyalbgvip.D6C7, .theme-loyalbgvip.D6C8, .theme-loyalbgvip.D6C9 {
    background: linear-gradient(313deg,rgba(103, 103, 103, 0) 68.55%, rgba(103, 103, 103, 0.5) 100.63%), linear-gradient(359deg, rgba(103, 103, 103, 0) 13.75%, rgba(103, 103, 103, .5) 134.65%), linear-gradient(319deg, rgba(103, 103, 103, 0) 54.68%, rgba(103, 103, 103, .5) 111.39%)
}

/* theme loyalty font color*/
.theme-loyaltext.D1C0 {
    color: #74bd11
}

.theme-loyaltext.D1C1 {
    color: #1a9ae2
}

.theme-loyaltext.D1C2 {
    color: #f032e8
}

.theme-loyaltext.D1C3 {
    color: #18a4ff
}

.theme-loyaltext.D1C4 {
    color: #a745db
}

.theme-loyaltext.D1C5 {
    color: #e01b41
}

.theme-loyaltext.D1C6 {
    color: #41b159
}

.theme-loyaltext.D1C7 {
    color: #F6780C
}

.theme-loyaltext.D1C8 {
    color: #e53d1c
}

.theme-loyaltext.D1C9 {
    color: #6900fd
}

.theme-loyaltext.D2C0 {
    color: #a78c57
}

.theme-loyaltext.D2C1 {
    color: #8daab1
}

.theme-loyaltext.D2C2 {
    color: #d77103
}

.theme-loyaltext.D2C3 {
    color: #8daab1
}

.theme-loyaltext.D2C4 {
    color: #d77103
}

.theme-loyaltext.D2C5 {
    color: #c0584e
}

.theme-loyaltext.D2C6 {
    color: #89a6ad
}

.theme-loyaltext.D2C7 {
    color: #89a6ad
}

.theme-loyaltext.D2C8 {
    color: #e5cd0d
}

.theme-loyaltext.D2C9 {
    color: #ed16cb
}

.theme-loyaltext.D3C0 {
    color: #c38146
}

.theme-loyaltext.D3C1 {
    color: #b9b1b1
}

.theme-loyaltext.D3C2 {
    color: #ffa298
}

.theme-loyaltext.D3C3 {
    color: #93b0b7
}

.theme-loyaltext.D3C4 {
    color: #ffef1b
}

.theme-loyaltext.D3C5 {
    color: #ffa298
}

.theme-loyaltext.D3C6 {
    color: #93b0b7
}

.theme-loyaltext.D3C7 {
    color: #ffef1b
}

.theme-loyaltext.D3C8 {
    color: #44acf7
}

.theme-loyaltext.D3C9 {
    color: #f5b6fb
}

.theme-loyaltext.D4C0 {
    color: #04bb65
}

.theme-loyaltext.D4C1 {
    color: #d52a43
}

.theme-loyaltext.D4C2 {
    color: #3a2cc7
}

.theme-loyaltext.D4C3 {
    color: #2c81cd
}

.theme-loyaltext.D4C4 {
    color: #F15A24
}

.theme-loyaltext.D4C5 {
    color: #676767
}

.theme-loyaltext.D4C6 {
    color: #662D91
}

.theme-loyaltext.D4C7 {
    color: #676767
}

.theme-loyaltext.D4C8 {
    color: #AF0B1F
}

.theme-loyaltext.D4C9 {
    color: #9B00D0
}

.theme-loyaltext.D5C0 {
    color: #4c5bb1
}

.theme-loyaltext.D5C1 {
    color: #c96818
}

.theme-loyaltext.D5C2 {
    color: #868E85
}

.theme-loyaltext.D5C3 {
    color: #b39e93
}

.theme-loyaltext.D5C4 {
    color: #bf7d50
}

.theme-loyaltext.D5C5 {
    color: #2a2095
}

.theme-loyaltext.D5C6 {
    color: #339d5e
}

.theme-loyaltext.D5C7 {
    color: #465fb3
}

.theme-loyaltext.D5C8 {
    color: #a720b9
}

.theme-loyaltext.D5C9 {
    color: #c52233
}

.theme-loyaltext.D6C0, .theme-loyaltext.D6C1, .theme-loyaltext.D6C2, .theme-loyaltext.D6C3, .theme-loyaltext.D6C4, .theme-loyaltext.D6C5, .theme-loyaltext.D6C6, .theme-loyaltext.D6C7, .theme-loyaltext.D6C8, .theme-loyaltext.D6C9 {
    background: -webkit-linear-gradient(241deg, #ff5722e0, #FAD75D);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none !important
}


.loyalprogram-info h5 {
    font-size: 1.25rem;
}

    .loyalprogram-info h5.step {
        display: flex;
        flex-direction: row;
    }

        .loyalprogram-info h5.step:before {
            content: "";
            flex: 1 1;
            border-bottom: 2px solid #fff;
            margin: 10px 15px 10px 0px;
        }

        .loyalprogram-info h5.step:after {
            content: "";
            flex: 1 1;
            border-bottom: 2px solid #fff;
            margin: 10px 0px 10px 15px;
        }

.loyalprogram-info #carouselLoyaltyProgram .carousel-control-prev,
.loyalprogram-info #carouselLoyaltyProgram .carousel-control-next {
    height: 125px;
    display:inline-flex;
}

.loyalprogram-progress-container {
    height: 12px;
    background-color: #ddd;
    border-radius: 10px;
}

.loyalprogram-progress {
    height: 12px;
    border-radius: 10px;
    background-color: #4CAF50;
    color: #fff;
    font-size: 10px;
    text-align: center;
    line-height: 12px;
}

.loyalprofile {
    width: auto;
    padding-right: 0.5rem;
}

.loyaldesc {
    width: auto;
}

.loyaldesc .h6, .loyaldesc h6{
    font-size: 1rem;
}
@media screen and (max-width: 1250px) {
    .loyalprofile {
        width: auto;
        padding-right: 0.5rem;
    }

    .loyaldesc {
        width: auto;
    }
}

@media (max-width: 576px) {
    .loyalprofile {
        width: 100%;
    }

    .loyaldesc {
        width: 100%;
    }
}

.angpow-ico-btn, .rebate-ico-btn {
    width: 60px;
    padding: 0;
}

    .angpow-ico-btn img, .rebate-ico-btn img {
        width: 100%;
    }

@media (max-width: 768px) {
    .angpow-ico-btn, .rebate-ico-btn {
        width: 45px;
        margin-top: -3px;
    }
}

.selectCustom.promo_category .custom-select-dd,
.selectCustom.tournament_category .custom-select-dd {
    padding-left: 15px;
}

.selectCustom.promo_category .select-options li:first-child,
.selectCustom.tournament_category .select-options li:first-child {
    display: list-item;
}

#DepoConfModal button {
    height: fit-content;
}

#DepoConfModal .tooltip{ 
    background: #000;
    color: #fff;
    font-size: 0.75rem;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -100%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s;
}
#DepoConfModal .tooltip.show {
    opacity: 1;
    pointer-events: auto;
}
/*Popup Modals for certain games like PokerV*/

.transferModal .form-group label {
    margin-bottom: 0;
    padding-bottom: 2px;
    color: black;
}

.transferModal #playnowBtn {
    margin: 10px 0px !important;
    padding: 10px 0px !important;
    font-size: 13px !important;
    border-radius: 2px !important;
}

.transferModal .card-header {
    background-color: #c1c1c1;
    padding: 0;
}

    .transferModal .card-header button {
        color: black;
    }

.transferModal ul li {
    color: black;
}

.transferModal .card {
    border: none;
    background-color: #dadada;
}

.transferModal .form-group {
    font-size: 14px;
}

.transferModal .btn-link i {
    color: black;
}

.transferModal .h3, .transferModal .h5, .transferModal span, .transferModal .form-group {
    color: black;
}

.transferModal .card-header span {
    font-size: 13px;
}

    .transferModal .card-header .btn-link:after {
        content: none;
    }

.transferModal .modal-content {
    width: 360px;
    margin: auto;
}

.transferModal {
    z-index: 10000 !important;
}

#promotionPopUP .modal-dialog  {
    max-width: 600px;
}
#promotionPopUP .modal-content {
    width: auto;
}
#promotionPopUP .modal-content .popuppclose {
    right: .5rem;
    top: .5rem;
    position: absolute;
    width: 1.5rem;
    height: 1.5rem;
    z-index: 5;
    opacity: 1;
    border-radius: 50%;
}
#promotionPopUP .modal-content .svg-closeicon {
    width: 1.5rem;
    height: 1.5rem;
    color: #32343A;
}
#promotionPopUP .modal-body {
    background-color: #fff;
    border-top-right-radius: 0.3rem;
    border-top-left-radius: 0.3rem;
    padding: 1rem 1rem 0rem 1rem;
}
#promotionPopUP .modal-body #promoBaseMessage {
    color: #71747B;
    font-weight: 400;
    font-size: 16px;
}

#promotionPopUP .modal-body #promoTitle {
    color: #000;
    font-weight: 700;
    font-size: 20px;
    padding-top: 10px;
    display: block;
}
#promotionPopUP .modal-footer {
    background-color: #fff;
    border-bottom-right-radius: 0.3rem;
    border-bottom-left-radius: 0.3rem;
    border-top: none;
}
#promotionPopUP .btn-danger {
    color: #71747B !important;
    background-color: #FFf !important;
    border-color: #71747B !important;
    border-radius: 0.25rem !important;
}
#promotionPopUP .btn-danger:hover {
    color: #71747B;
    background-color: #e7e4e4 !important;
    border-color: #e7e4e4 !important;
}
#promotionPopUP .btn-danger:focus {
    color: #71747B;
    background-color: #e7e4e4 !important;
    border-color: #e7e4e4 !important;
    box-shadow: 0 0 0 0.2rem rgb(219 193 195 / 50%);
}
#promotionPopUP .btn-success {
    color: #fff !important;
    background-color: #32343A !important;
    border-color: #32343A !important;
    border-radius: 0.25rem !important;
}
#promotionPopUP .btn-success:hover {
    color: #fff;
    background-color: #000 !important;
    border-color: #000 !important;
}
#promotionPopUP .btn-success:focus {
    color: #fff;
    background-color: #000 !important;
    border-color: #000 !important;
    box-shadow: 0 0 0 0.2rem rgb(63 67 64 / 50%);
}
/*Popup Modals for certain games like PokerV*/
.eightmfun-QR-show {
    display: none;
}

.cs-box .svg-ico {
    width: 100%;
    height: 100%;
}

.image-size {
    aspect-ratio: 1/1;
    background-color: #252525;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 10px !important;
}

.cs-box .photobox__previewbox:before, .cs-box .owl-item .photobox:before {
    content: none !important;
}

html[lang="km"] .h1, html[lang="km"] .h2, html[lang="km"] .h3, html[lang="km"] .h4, html[lang="km"] .h5, html[lang="km"] .h6,
html[lang="km"] h1, html[lang="km"] h2, html[lang="km"] h3, html[lang="km"] h4, html[lang="km"] h5, html[lang="km"] h6,
html[lang="km"] p, html[lang="km"] span, html[lang="km"] ul, html[lang="km"] li,
html[lang="km"] body, html[lang="km"] div, html[lang="km"] table, html[lang="km"] input, html[lang="km"] button, html[lang="km"] select, html[lang="km"] optgroup, html[lang="km"] textarea, html[lang="km"] a, html[lang="km"] small {
    font-family: Battambang !important;
}

/* profile wallet table marquee css */
.marqueeContainer {
    overflow: hidden !important;
}

.marqueeContainer-content {
    white-space: nowrap;
}

.marqueeContainer-animation {
    width: fit-content;
    animation: marqueeBounce 5s linear infinite;
}

    .marqueeContainer-animation:hover {
        animation-play-state: paused;
    }

@keyframes marqueeBounce {
    0% {
        transform: translateX(100%);
    }

    100% {
        transform: translateX(-100%);
    }
}

.updatepassword {
    padding: 10px 0px !important;
    margin: 10px 0px !important;
    font-size: 13px !important;
    border-radius: 2px !important;
    background: linear-gradient(to right, #6a11cb, #2575fc);
}

#Mega888_UpdatePassword span, #MegaGaming_UpdatePassword span, #MegaV3_UpdatePassword span, #Pussy888_UpdatePassword span, #Kiss918_UpdatePassword span {
    font-size: 13px !important;
}

/*New referral CSS*/

#tab-affiliate .downline-details {
    background: #e2e2e2;
    border-radius: 0 0 4px 4px;
    height: 100% !important;
    padding: 0;
}

    #tab-affiliate .downline-details .h3 b {
        font-size: 10px;
    }

    #tab-affiliate .downline-details .h3.one {
        height: auto !important;
        padding-bottom: 0.25rem !important;
    }

div#disclaimerModal > .modal-dialog > .modal-content > .modal-body {
    overflow-y: auto;
}

#confirm-accnum {
    text-overflow: ellipsis;
    overflow: hidden;
}


#betLimitModel .modal-header,
#gameErrorModel .modal-header {
    background: hsl(225, 31%, 23%);
    color: #ffffff;
}


#betLimitModel .modal-body p,
#gameErrorModel .modal-body p {
    font-size: 13px;
    color: #666666;
    margin-bottom: 0px;
}
#betLimitModel .modal-footer button,
#gameErrorModel .modal-footer button {
    font-size: 1em !important;
}
@media only screen and (max-width: 415px) {
    #betLimitModel .modal-content,
    #gameErrorModel .modal-content {
        width: 100% !important;
    }
}