body,
body.mobile,
body.desktop {
    background-color:
        var(--site-theme-canvas);

    background-image:
        none;
}




.btn-primary {
    background:
        linear-gradient(
            180deg,
            var(--site-theme-accent) 18.18%,
            var(--site-theme-accent-soft) 69.12%
        );

    border-color:
        var(--site-theme-accent);
}

.btn-primary.active,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover,
.btn-primary[disabled] {
    background-color:
        var(--site-theme-accent-soft);

    border-color:
        var(--site-theme-accent-soft);
}

.btn-primary--dark {
    background-color:
        var(--site-theme-primary);

    border-color:
        var(--site-theme-primary);
}

.btn-primary--dark.active,
.btn-primary--dark:active,
.btn-primary--dark:focus,
.btn-primary--dark:hover,
.btn-primary--dark[disabled] {
    background-color:
        var(--site-theme-accent);

    border-color:
        var(--site-theme-accent);
}




.top-bar
.inner-header,
body.mobile
.inner-header {
    background-color:
        var(--site-theme-accent-soft);

    background-image:
        none;
}

.top-bar
a,
.top-bar
button {
    color:
        var(--site-theme-primary);
}




@media screen and (max-width: 992px) {
    .navbar-default {
        background-color:
            var(--site-theme-canvas);
    }

    .navbar-header {
        background-color:
            var(--site-theme-primary);
    }
}




.desktop
.main.nav-wrapper,
.nav-content {
    background:
        var(--site-theme-accent);
}

.side-nav-items
> .nav-item
> a.active,
.nav-item-content {
    background-color:
        var(--site-theme-primary);
}

.nav-content
span.circle {
    background:
        var(--site-theme-accent);
}




#r-side-bar {
    background-color:
        var(--site-theme-primary);
}

#r-side-bar
.swiper-button-next
span,
#r-side-bar
.swiper-button-prev
span {
    background-color:
        var(--site-theme-surface);
}

@media screen and (max-width: 992px) {
    #r-side-bar
    .mdc-tab {
        background:
            var(--site-theme-surface);
    }

    #r-side-bar
    .mdc-tab--active,
    #r-side-bar
    .mdc-tab-indicator.active,
    #r-side-bar
    .mdc-tab.active {
        background:
            var(--site-theme-surface);
    }

    #r-side-bar
    .mdc-tab--active::before,
    #r-side-bar
    .mdc-tab.active::before {
        border-bottom-color:
            var(--site-theme-primary);
    }
}




.scroll-wrapper[_home]
.slider-content {
    background:
        var(--site-theme-surface);
}

.scroll-wrapper[_home]
.next-btn,
.scroll-wrapper[_home]
.prev-btn {
    background-color:
        var(--site-theme-primary);
}

.mobile
.scroll-wrapper[_home]
.next-btn,
.mobile
.scroll-wrapper[_home]
.prev-btn,
.mobile
.scroll-wrapper[_home]
.slider-content {
    background:
        var(--site-theme-accent);
}




.u-section-box--bg {
    background:
        var(--site-theme-panel);
}

.svc-advantage
.card
.circle-wrp,
.svc-advantage
.progress {
    background:
        var(--site-theme-canvas);
}

.info-centre
.content-box
li {
    border-bottom-color:
        var(--site-theme-canvas);
}

.icon-wrp,
.info-centre
.content-box
li
.btn-link {
    background:
        var(--site-theme-canvas);
}

.today-lottery-results
.today-lottery
.u-section-box--bg {
    background:
        var(--site-theme-canvas-deep);
}




.carousel-indicators
li {
    background:
        var(--site-theme-canvas);
}




.onix-banner-placeholder--primary {
    background:
        linear-gradient(
            135deg,
            var(--site-theme-canvas) 0%,
            var(--site-theme-primary) 50%,
            var(--site-theme-accent) 100%
        );
}

.onix-banner-placeholder--secondary {
    background:
        linear-gradient(
            135deg,
            var(--site-theme-primary) 0%,
            var(--site-theme-canvas) 48%,
            var(--site-theme-accent-soft) 100%
        );
}




.onix_hkb_result {
    background:
        var(--site-theme-panel)
        !important;

    border-color:
        var(--site-theme-canvas)
        !important;
}

.onix_hkb_date {
    background:
        var(--site-theme-accent);
}




.site-footer,
.desktop
.site-footer {
    background:
        var(--site-theme-canvas-deep);
}

.footer-content {
    background:
        var(--site-theme-canvas);
}

#collapsible-footer
.i-collapse,
.i-collapse {
    color:
        var(--site-theme-primary);
}




.menu-bottom
.navbar-inverse {
    background:
        var(--site-theme-navigation);
}

.menu-bottom
.horizontal-hover,
.menu-bottom
.vertical-hover
li {
    background-color:
        var(--site-theme-accent-soft);
}

.menu-bottom
.horizontal-hover::after {
    border-top-color:
        var(--site-theme-accent-soft);
}

.menu-bottom
.footericon-single
a.footer-funds
i {
    color:
        var(--site-theme-primary);
}




.wallet-bal
.row,
.wallet-bal
.btn-refresh-wallet.pull-right,
.wallet-bal
.btn-refresh-wallet.refresh_icon,
.wallet-bal
.btn-collapse-balances {
    background-color:
        var(--site-theme-primary);
}




@media screen and (min-width: 992px) {
    .profile-head
    .container-box
    .title {
        background-color:
            var(--site-theme-primary);
    }

    .profile-head
    .container {
        background-color:
            var(--site-theme-canvas);
    }
}

.profile-head
.reward_balance_wrapper
> div {
    background-color:
        var(--site-theme-primary);
}

.profile-head
.bal-box,
.profile-head
.member-wallet-static__single {
    background:
        var(--site-theme-surface);
}

.profile-head
.mdc-tab-scroller__scroll-content
.mdc-tab {
    background:
        var(--site-theme-surface);
}

.profile-head
.nav-tabs
.nav-btn.active {
    border-bottom-color:
        var(--site-theme-primary);

    color:
        var(--site-theme-link-accent);
}

.mdc-tab-indicator
.mdc-tab-indicator__content--underline {
    border-color:
        var(--site-theme-primary);
}




.onix-WD-transaction
.nav-pills {
    background:
        var(--site-theme-accent-soft);
}

.onix-WD-transaction
.nav
> li
> a {
    color:
        var(--site-theme-canvas-deep);
}

.onix-WD-transaction
.nav-pills
> li.active
> a,
.onix-WD-transaction
.nav-pills
> li.active
> a:focus,
.onix-WD-transaction
.nav-pills
> li.active
> a:hover {
    background:
        var(--site-theme-canvas-deep);
}

.WD-Card {
    background:
        var(--site-theme-canvas-deep);
}

.WD-Profile
div {
    background:
        var(--site-theme-accent-soft);
}




.dialog {
    background-color:
        var(--site-theme-canvas);

    border-color:
        var(--site-theme-accent);
}

.dialog.arrow-top::after {
    border-bottom-color:
        var(--site-theme-accent);
}

.dialog.arrow-top::before {
    border-bottom-color:
        var(--site-theme-canvas);
}

.ce-modal__content-container {
    background-color:
        var(--site-theme-canvas);
}

#slot-game-modal
.md-content {
    background:
        var(--site-theme-primary);
}






.btn-secondary {
    background:
        linear-gradient(
            180deg,
            var(--site-theme-accent) 18.18%,
            var(--site-theme-accent-soft) 69.12%
        );

    border-color:
        var(--site-theme-accent);

    color:
        #fff;
}

.btn-secondary.active,
.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary:hover,
.btn-secondary[disabled] {
    background:
        var(--site-theme-accent-soft);

    border-color:
        var(--site-theme-accent-soft);

    color:
        #fff;
}

.btn-tertiery {
    background:
        var(--site-theme-accent-deep);

    border-color:
        var(--site-theme-accent-deep);

    color:
        #fff;
}

.btn-tertiery.active,
.btn-tertiery:active,
.btn-tertiery:focus,
.btn-tertiery:hover,
.btn-tertiery[disabled] {
    background:
        var(--site-theme-accent);

    border-color:
        var(--site-theme-accent);

    color:
        #fff;
}

.btn-accent {
    background:
        var(--site-theme-primary);

    border-color:
        var(--site-theme-primary);

    color:
        #fff;
}

.btn-accent.active,
.btn-accent:active,
.btn-accent:focus,
.btn-accent:hover,
.btn-accent[disabled] {
    background:
        var(--site-theme-accent);

    border-color:
        var(--site-theme-accent);

    color:
        #fff;
}




body.mobile
.mobile-border {
    border-top-color:
        var(--site-theme-accent);
}




.svc-advantage
.card {
    background:
        linear-gradient(
            180deg,
            var(--site-theme-primary) 24.5%,
            var(--site-theme-panel) 100%
        );
}




#collapsible-footer
.i-collapse,
.i-collapse {
    background-color:
        var(--site-theme-primary);

    color:
        #fff;
}

.menu-bottom
.footericon-single
a.footer-funds
i {
    background-color:
        var(--site-theme-primary);

    color:
        #fff;
}




.sub-games
.scroll-wrapper
.row.slider-content {
    background-color:
        var(--site-theme-accent-soft);
}

.sub-games
.scroll-wrapper
.next-btn,
.sub-games
.scroll-wrapper
.prev-btn {
    background-color:
        var(--site-theme-accent);
}

.sub-games
.scroll-wrapper
.btn-box {
    border-right-color:
        var(--site-theme-accent);
}

.sub-games
.scroll-wrapper
.btn-box.active,
.sub-games
.scroll-wrapper
.btn-box:active {
    background-color:
        var(--site-theme-primary);
}

.sub-games
.filter
.btn.active {
    border-bottom-color:
        var(--site-theme-primary);
}

.sub-games
.amount_box {
    background-color:
        var(--site-theme-accent-soft);
}

.sub-games
.apkdownload-box {
    background:
        var(--site-theme-accent);
}

.sub-games
.apkdownload-box
li {
    background-color:
        var(--site-theme-primary);
}




.g-slider-wrapper.hot
.game-title,
.g-slider-wrapper.new
.game-title {
    background:
        var(--site-theme-accent);
}




#r-side-bar
.modal-footer
a {
    color:
        var(--site-theme-link-accent);
}




.profile-head
.icon-shield,
.profile-head
.acc_safety_info
i {
    color:
        var(--site-theme-accent);
}




.acc
.mdc-tab--active
.mdc-tab__text-label,
.acc
.mdc-tab.active
.mdc-tab__text-label {
    color:
        var(--site-theme-link-accent);
}




.withdraw-page
#withdrawForm
.form-check
> .filter-title::before {
    border-color:
        var(--site-theme-primary);
}

.withdraw-page
#withdrawForm
.form-check
> .filter-title::after {
    background-color:
        var(--site-theme-primary);
}




.history-table
.total-data,
.history-table
.h-result.row:nth-of-type(odd) {
    background-color:
        var(--site-theme-primary);
}







.deposit-page
.deposit-loading-overlay {
    background:
        color-mix(
            in srgb,
            var(--site-theme-canvas)
            76%,
            transparent
        );
}

.deposit-page
.deposit-loading-overlay__content {
    background:
        color-mix(
            in srgb,
            var(--site-theme-primary)
            94%,
            var(--site-theme-canvas)
        );

    border-color:
        color-mix(
            in srgb,
            var(--site-theme-accent)
            48%,
            transparent
        );

    box-shadow:
        0
        12px
        32px
        rgba(
            0,
            0,
            0,
            0.38
        );
}

.deposit-page
.deposit-loading-overlay__spinner {
    border-color:
        rgba(
            255,
            255,
            255,
            0.24
        );

    border-top-color:
        var(--site-theme-accent-light);
}

.deposit-page
.deposit-loading-overlay__text {
    color:
        #fff;
}




.deposit-page
.deposit-qris-full-form__button {
    background:
        var(--site-theme-accent);

    color:
        #fff;
}

.deposit-page
.deposit-qris-full-form__button:hover,
.deposit-page
.deposit-qris-full-form__button:focus {
    background:
        var(--site-theme-accent-soft);

    color:
        #fff;
}

.deposit-page
.deposit-qris-full-form__button--back {
    background:
        var(--site-theme-primary);
}

.deposit-page
.deposit-qris-full-form__button--back:hover,
.deposit-page
.deposit-qris-full-form__button--back:focus {
    background:
        var(--site-theme-surface);
}




.deposit-page
input[type="checkbox"] {
    accent-color:
        var(--site-theme-accent);
}

.deposit-page
.deposit-qris-full-form__control
[data-qris-amount-input]:focus {
    box-shadow:
        inset
        0
        0
        0
        1px
        var(--site-theme-accent-light);
}

.deposit-page
#depositForm
.form-control:focus {
    border-color:
        var(--site-theme-accent-soft);

    box-shadow:
        0
        0
        0
        1px
        color-mix(
            in srgb,
            var(--site-theme-accent)
            38%,
            transparent
        );
}




.deposit-page
#depositForm
.radio_2
label {
    border-color:
        var(--site-theme-primary);

    color:
        var(--site-theme-primary);
}

.deposit-page
#depositForm
.radio_2
label
.marked {
    color:
        var(--site-theme-primary);
}

.deposit-page
#depositForm
.radio_2
input[type="radio"]:checked
~ label {
    background-color:
        var(--site-theme-primary);

    border-color:
        var(--site-theme-primary);

    color:
        #fff;
}

.deposit-page
#depositForm
.radio_2
input[type="radio"]:checked
~ label
.marked {
    color:
        var(--site-theme-primary);
}




.deposit-page
#depositForm
.bankInfo-box {
    background:
        linear-gradient(
            145deg,
            var(--site-theme-primary)
            0%,
            var(--site-theme-panel)
            100%
        );

    border:
        1px
        solid
        color-mix(
            in srgb,
            var(--site-theme-accent)
            38%,
            transparent
        );

    box-shadow:
        0
        6px
        18px
        rgba(
            0,
            0,
            0,
            0.22
        );

    color:
        #fff;
}




.deposit-page
#depositForm
.sel-method-wrapper {
    border-color:
        var(--site-theme-accent);
}



.deposit-page
#depositForm
.bankInfo-box
table.info-box--001
.lbl {
    background-color:
        var(--site-theme-primary);

    color:
        #fff;
}

.deposit-page
#depositForm
.bankInfo-box
table.info-box--001
a.lbl {
    background-color:
        var(--site-theme-primary);

    color:
        #fff;
}

.deposit-page
#depositForm
.bankInfo-box
table.info-box--001
i {
    color:
        var(--site-theme-accent-light);
}



body.register-page
#registerForm1
.radio_2
label {
    border-color:
        var(--site-theme-primary);

    color:
        var(--site-theme-primary);
}

body.register-page
#registerForm1
.radio_2
label
.marked {
    color:
        var(--site-theme-primary);
}

body.register-page
#registerForm1
.radio_2
input[type="radio"]:checked
~ label {
    background-color:
        var(--site-theme-primary);

    border-color:
        var(--site-theme-primary);

    color:
        #fff;
}

body.register-page
#registerForm1
.radio_2
input[type="radio"]:checked
~ label
.marked {
    color:
        var(--site-theme-primary);
}






.promotions-page
.promotion-single {
    background:
        var(--site-theme-panel);

    color:
        #fff;
}




.promotions-page
.promotion-page
.g_category-nav {
    background-color:
        var(--site-theme-panel);
}

.promotions-page
.promotion-page
.g_category-nav
.nav-item {
    background:
        var(--site-theme-primary);

    color:
        #fff;
}

.promotions-page
.promotion-page
.g_category-nav
.nav-item
.navlink {
    color:
        #fff;
}

.promotions-page
.promotion-page
.g_category-nav
.nav-item.active
.navlink,
.promotions-page
.promotion-page
.g_category-nav
.nav-item:hover
.navlink {
    background:
        var(--site-theme-accent-soft);

    color:
        #fff;
}




.promotions-page
.promotion-modal
.md-content,
.promotions-page
.promotionmodal_content {
    background-color:
        var(--site-theme-panel);

    color:
        #fff;
}

.promotions-page
.promotion-modal
.md-close {
    color:
        #fff;
}




.promotions-page
.promotion-single
.btn-secondary {
    background:
        linear-gradient(
            180deg,
            var(--site-theme-accent)
            18.18%,
            var(--site-theme-accent-soft)
            69.12%
        );

    border-color:
        var(--site-theme-accent);

    color:
        #fff;
}

.promotions-page
.promotion-single
.btn-secondary.active,
.promotions-page
.promotion-single
.btn-secondary:active,
.promotions-page
.promotion-single
.btn-secondary:focus,
.promotions-page
.promotion-single
.btn-secondary:hover {
    background:
        var(--site-theme-accent-soft);

    border-color:
        var(--site-theme-accent-soft);

    color:
        #fff;
}





body.contact-us-page
.contact-us
.bg-1 {
    background:
        var(--site-theme-primary);
}

body.contact-us-page
.contact-us
.bg-1
.btn {
    background:
        var(--site-theme-accent);

    color:
        #fff;
}

body.contact-us-page
.contact-us
.bg-1
.btn
i,
body.contact-us-page
.contact-us
.icon-txt {
    color:
        #fff;
}

body.contact-us-page
.contact-us
a:hover
> * {
    color:
        var(--site-theme-link-accent);
}