*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-family:
        Montserrat,
        Arial,
        Helvetica,
        sans-serif;
}

body {
    margin: 0;
}




.onixgaming-wordmark {
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    white-space: nowrap;
}




.layout .side-nav {
    overscroll-behavior: contain;
}

.layout .side-nav .nav-content,
.layout .side-nav .nav-item-content {
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
}




.slider-size {
    max-height: 500px;
    min-height: 130px;
}

.onix-native-carousel {
    overflow: hidden;
    position: relative;
    touch-action: pan-y;
}

.onix-native-carousel .carousel-inner {
    display: flex;
    overflow: visible;

    transform:
        translate3d(
            0,
            0,
            0
        );

    transition:
        transform 450ms ease;

    width: 100%;
    will-change: transform;
}

.onix-native-carousel
.carousel-inner
> .item {
    display: block !important;
    flex: 0 0 100%;
    float: none;
    left: auto;
    position: relative;
    width: 100%;
}

.onix-native-carousel
.carousel-inner
> .item.active,
.onix-native-carousel
.carousel-inner
> .item.next,
.onix-native-carousel
.carousel-inner
> .item.prev {
    display: block !important;
}

.onix-banner-placeholder {
    align-items: center;
    display: flex;

    height:
        clamp(
            130px,
            32vw,
            260px
        );

    justify-content: center;
    width: 100%;
}

.onix-banner-placeholder--primary {
    background:
        linear-gradient(
            135deg,
            #170004 0%,
            #321c0d 50%,
            #bf334d 100%
        );
}

.onix-banner-placeholder--secondary {
    background:
        linear-gradient(
            135deg,
            #321c0d 0%,
            #170004 48%,
            #d6618e 100%
        );
}

.onix-banner-placeholder__content {
    padding:
        25px 50px;

    text-align: center;
}

.onix-banner-placeholder__brand {
    color: #fff;

    font-size:
        clamp(
            24px,
            7vw,
            48px
        );

    font-weight: 900;
    letter-spacing: 2px;
    line-height: 1;
}

.onix-banner-placeholder__text {
    color:
        rgba(
            255,
            255,
            255,
            0.8
        );

    font-size: 12px;
    margin-top: 8px;
    text-transform: uppercase;
}




.onix-native-carousel .carousel-control {
    align-items: center;
    background: none;
    bottom: 0;
    display: flex;
    justify-content: center;
    opacity: 0.8;
    top: 0;
    width: 44px;
}

.onix-native-carousel .carousel-control:hover,
.onix-native-carousel .carousel-control:focus {
    opacity: 1;
}

.onix-native-carousel
.carousel-control
.icon-wrap {
    align-items: center;
    display: flex;
    justify-content: center;
}

.onix-native-carousel
.carousel-control
i {
    color: #fff;
    font-size: 22px;
}




.onix-native-carousel
.carousel-indicators {
    z-index: 5;
}

.onix-native-carousel
.carousel-indicators
li {
    cursor: pointer;
}




.onix-native-carousel
.carousel-control
.icon-prev::before {
    content: "\2039";
}

.onix-native-carousel
.carousel-control
.icon-next::before {
    content: "\203A";
}




.js-cycling-gallery-onix
[data-lottery-results-viewport] {
    overflow: hidden;
    position: relative;
}

.js-cycling-gallery-onix
[data-lottery-results-track] {
    left: 0;
    margin: 0;
    overflow: visible;
    position: absolute;
    top: 0;

    transition:
        transform 180ms ease;

    white-space: nowrap;
    width: max-content;
    will-change: transform;
}

.js-cycling-gallery-onix
[data-lottery-results-track].no-transition {
    transition: none;
}




.onixgaming-footer-logo {
    color: #fff;
    display: inline-block;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.5px;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
}

.onixgaming-footer-logo:hover,
.onixgaming-footer-logo:focus {
    color: #fff;
    text-decoration: none;
}




.mobile
.main-content
.navbar-fixed-bottom {
    transform: none;
}

.layout
.main-content.rightSideBarOpen {
    z-index: 1;
}

#r-side-bar.open {
    z-index: 2000;
}







.profile-head
.container-box
> .title {
    align-items: center;
    display: flex;
    justify-content: center;
    min-height: 42px;
    position: relative;
    text-align: center;
}

.profile-head
.container-box
> .title
.skew {
    display: inline-block;
}




.profile-head
.member-logout-form {
    margin: 0;
    padding: 0;
}

.profile-head
.btn-logout {
    align-items: center !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #fff !important;
    cursor: pointer;
    display: flex !important;
    float: none !important;
    height: 42px;
    justify-content: center;
    margin: 0 !important;
    opacity: 1 !important;
    padding: 0 !important;
    position: absolute !important;
    right: 12px;
    top: 50%;

    transform:
        translateY(-50%);

    visibility: visible !important;
    width: 42px;
    z-index: 20;
}

.profile-head
.btn-logout
i {
    color: #fff !important;
    display: block !important;
    font-size: 24px;
    line-height: 1;
    opacity: 1 !important;
    visibility: visible !important;
}

.profile-head
.btn-logout:hover,
.profile-head
.btn-logout:focus {
    background: transparent !important;
    color: #fff !important;
    outline: none !important;
}




.profile-head
.icon_menu {
    width: 100%;
}

.profile-head
.icon_menu
.icon-single {
    min-width: 0;
}




.profile-head
.member-wallet-static {
    align-items: center;
    clear: both;
    display: flex;
    justify-content: center;
    margin: 18px auto 0;
    padding:
        0 14px;

    width: 100%;
}

.profile-head
.member-wallet-static__single {
    background: #90715c;
    border-radius: 8px;

    box-shadow:
        0 0.125rem 0.25rem
        rgba(
            0,
            0,
            0,
            0.7
        );

    box-sizing: border-box;
    margin: 0 auto;
    max-width: 235px;

    padding:
        20px
        14px !important;

    text-align: center;
    width: 88%;
}

.profile-head
.member-wallet-static__single
.btn {
    align-items: center;
    background: transparent;
    border: 0;
    box-shadow: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    font-weight: 1000;
    justify-content: center;
    margin: 0;
    min-height: 0;
    outline: none;
    padding: 0 !important;
    text-align: center;
    width: 100%;
}

.profile-head
.member-wallet-static__balance {
    align-items: center;
    display: flex;
    justify-content: center;
    line-height: 1.2;
    margin: 0 auto;
    width: 100%;
}

.profile-head
.member-wallet-static__balance
.bal-txt {
    display: inline-block;
    font-weight: 700;
    margin: 0;
    padding: 0;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

.profile-head
.member-wallet-static__balance
.i-refresh {
    display: inline-block;
    font-size: 21.882px;
    margin-left: 7px;
    padding: 0;
    vertical-align: middle;
}

.profile-head
.member-wallet-static
.bal-title {
    display: block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    margin:
        7px
        0
        0;

    padding: 0;
    text-align: center;
    width: 100%;
}




.profile-head
.member-profile-tabs {
    box-sizing: border-box;
    clear: both;
    float: none;
    margin: 0;

    padding:
        20px
        14px
        0;

    width: 100%;
}

.profile-head
.mdc-tab-scroller__scroll-content {
    display: flex;
    width: 100%;
}

.profile-head
.mdc-tab-scroller__scroll-content
.mdc-tab {
    align-items: center;
    background: #90715c;
    border: 0;
    color: #fff;
    cursor: pointer;
    display: flex;
    flex: 1 1 50%;
    justify-content: center;
    min-height: 39px;
    min-width: 0;
    padding:
        0 10px;

    position: relative;
}

.profile-head
.mdc-tab-scroller__scroll-content
.mdc-tab.active {
    filter:
        brightness(90%);
}

.profile-head
.mdc-tab__content {
    align-items: center;
    display: flex;
    justify-content: center;
    width: 100%;
}

.profile-head
.mdc-tab__text-label {
    display: block;
    font-weight: 600;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}




.profile-head
.outlet {
    clear: both;
    display: block;
    margin-top: 20px;

    padding:
        0
        18px
        18px !important;

    width: 100%;
}

.profile-head
[data-member-profile-panel] {
    box-sizing: border-box;
    width: 100%;
}

.profile-head
[data-member-profile-panel][hidden] {
    display: none !important;
}

.profile-head
.container-b3 {
    margin: 0;
    padding: 0;
    width: 100%;
}




.profile-head
.member-profile-details {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    width: 100%;
}

.profile-head
.member-profile-detail-row {
    align-items: start;
    display: grid;

    grid-template-columns:
        112px
        10px
        minmax(
            0,
            1fr
        );

    margin:
        0
        0
        14px;

    padding: 0;
    width: 100%;
}

.profile-head
.member-profile-detail-row:last-child {
    margin-bottom: 0;
}

.profile-head
.member-profile-detail-label,
.profile-head
.member-profile-detail-separator,
.profile-head
.member-profile-detail-value {
    box-sizing: border-box;
    font-size: 12px;
    line-height: 1.45;
    margin: 0;
    min-width: 0;
    padding: 0;
}

.profile-head
.member-profile-detail-label {
    padding-right: 5px;
    text-align: left;
}

.profile-head
.member-profile-detail-separator {
    text-align: center;
}

.profile-head
.member-profile-detail-value {
    overflow-wrap: anywhere;
    padding-left: 3px;
    text-align: left;
}

.profile-head
.member-profile-detail-value
.i-star {
    display: inline-block;
    margin-left: 4px;
    vertical-align: middle;
}




.profile-head
[data-member-profile-panel="password"] {
    width: 100%;
}

.profile-head
.chg-pass {
    margin: 0;
    padding: 0;
}

.profile-head
#memberChangePasswordForm {
    margin: 0;
    padding: 0;
    width: 100%;
}

.profile-head
#memberChangePasswordForm
.form-group {
    margin-bottom: 20px !important;
}

.profile-head
#memberChangePasswordForm
label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 6px;
    text-align: left;
    width: 100%;
}

.profile-head
#memberChangePasswordForm
.text-danger {
    color: #d92e50;
}

.profile-head
#memberChangePasswordForm
.form-control {
    background: #aaa;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
    color: #111;
    height: 30px;

    padding:
        5px
        36px
        5px
        8px;

    width: 100%;
}

.profile-head
.member-password-input {
    position: relative;
    width: 100%;
}

.profile-head
.member-password-toggle {
    align-items: center;
    background: transparent;
    border: 0;
    box-shadow: none;
    color: #fff;
    display: flex;
    height: 30px;
    justify-content: center;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 4px;
    top: 0;
    width: 32px;
}

.profile-head
.member-password-toggle:focus,
.profile-head
.member-password-toggle:hover {
    background: transparent;
    box-shadow: none;
    outline: none;
}

.profile-head
.member-password-help {
    display: block;
    font-size: 10px;
    line-height: 1.4;
    margin-top: 5px;
}

.profile-head
.member-password-field-error {
    color: #ff8096;
    display: block;
    font-size: 10px;
    line-height: 1.4;
    margin-top: 5px;
    text-align: left;
    width: 100%;
}

.profile-head
#memberChangePasswordForm
.form-control.has-error {
    border:
        1px
        solid
        #df001b;

    box-shadow:
        0
        0
        0
        1px
        rgba(223, 0, 27, 0.12);
}

.profile-head
.member-change-password-submit {
    margin-top: 18px;
    text-align: center;
}

.profile-head
.member-change-password-submit
.btn-primary {
    min-width: 72px;
}

.profile-head
.member-change-password-message {
    font-size: 12px;
    margin-bottom: 12px;
}




@media screen and (max-width: 380px) {
    .profile-head
    .btn-logout {
        right: 6px;
    }

    .profile-head
    .member-wallet-static {
        padding-left: 10px;
        padding-right: 10px;
    }

    .profile-head
    .member-wallet-static__single {
        max-width: 225px;
        width: 88%;
    }

    .profile-head
    .member-profile-tabs {
        padding-left: 10px;
        padding-right: 10px;
    }

    .profile-head
    .outlet {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .profile-head
    .member-profile-detail-row {
        grid-template-columns:
            104px
            9px
            minmax(
                0,
                1fr
            );
    }
}



.js-enabled
#registerForm1
[data-register-step="2"] {
    display: none !important;
}

.js-enabled
#registerForm1
[data-register-step="1"].is-hidden {
    display: none !important;
}

.js-enabled
#registerForm1
[data-register-step="2"].is-active {
    display: block !important;
}

#registerForm1
[hidden] {
    display: none !important;
}

#registerForm1
.captcha-img {
    display: inline-block;
    max-width: 100%;
    object-fit: contain;
    vertical-align: middle;
}

#registerForm1
.btn-refresh-captcha {
    margin-left: 6px;
    vertical-align: middle;
}

#registerForm1
.btn-refresh-captcha:disabled {
    cursor: wait;
    opacity: 0.6;
}



.js-enabled
#registerForm1
[data-register-step="2"].is-active
.prev_btn {
    display: block !important;
}



#registerForm1
.register-captcha-row {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}

#registerForm1
.register-captcha-label {
    flex: 0 0 34%;
    float: none;
    margin-left: 0 !important;
    padding-left: 0;
    padding-right: 6px;
    width: auto;
}

#registerForm1
.register-captcha-input {
    flex: 0 0 26%;
    float: none;
    padding-left: 0;
    padding-right: 6px;
    width: auto;
}

#registerForm1
.register-captcha-input
.form-control {
    margin: 0;
    width: 100%;
}

#registerForm1
.register-captcha-row
.captcha-img {
    flex: 0 0 auto;
    height: 38px;
    margin: 0;
    max-width:
        calc(
            40% - 32px
        );
    object-fit: contain;
    width: auto;
}

#registerForm1
.register-captcha-row
.btn-refresh-captcha {
    align-items: center;
    display: inline-flex;
    flex: 0 0 28px;
    height: 38px;
    justify-content: center;
    margin: 0 0 0 4px;
    padding: 0;
    width: 28px;
}



body.register-page
.footer-content,
body.register-page
.footer-title,
body.register-page
.footer-body {
    display: none !important;
}



#registerForm1
.register-validation-host {
    position: relative;
}

#registerForm1
.form-control.has-error {
    border-color: #df001b !important;
    box-shadow: none !important;
}

#registerForm1
.form-control.has-success {
    border-color: #23b45d !important;
    box-shadow: none !important;
}

#registerForm1
.register-field-error {
    color: #df001b;
    display: block;
    font-size: 13px;
    font-style: italic;
    font-weight: 400;
    margin: 4px 0 3px;
    width: 100%;
}

#registerForm1
.register-field-status {
    align-items: center;
    display: flex;
    font-size: 15px;
    font-weight: 800;
    height: 30px;
    justify-content: center;
    line-height: 1;
    pointer-events: none;
    position: absolute;
    right: 23px;
    top: 0;
    width: 18px;
    z-index: 5;
}


#registerForm1
.input-group.register-validation-host
.register-field-status {
    right: 8px;
    top: 0;
}


#registerForm1
.register-captcha-input.register-validation-host
.register-field-status {
    right: 12px;
    top: 4px;
}

#registerForm1
.register-validation-host
> .form-control.has-error,
#registerForm1
.register-validation-host
> .form-control.has-success {
    padding-right: 30px;
}

#registerForm1
.input-group.register-validation-host
> .form-control.has-error,
#registerForm1
.input-group.register-validation-host
> .form-control.has-success {
    padding-right: 30px;
}

#registerForm1
.register-field-status.is-error {
    color: #df001b;
}

#registerForm1
.register-field-status.is-success {
    color: #23b45d;
}



#registerForm1
.register-captcha-input {
    align-self: flex-start;
    display: flex;
    flex-direction: column;
    position: relative;
}

#registerForm1
.register-captcha-input
.register-field-error {
    display: block;
    font-size: 11px;
    line-height: 1.25;
    margin: 4px 0 0;
    max-width: 150px;
    min-width: 120px;
    white-space: normal;
}

#registerForm1
.register-captcha-input
.register-field-error[hidden] {
    display: none !important;
}



#registerForm1
.register-username-availability {
    display: block;
    font-size: 13px;
    font-style: italic;
    margin: 4px 0 3px;
    width: 100%;
}

#registerForm1
.register-username-availability.is-pending {
    color: #f0ad4e;
}

#registerForm1
.register-username-availability.is-success {
    color: #23b45d;
}

#registerForm1
.register-username-availability.is-error {
    color: #df001b;
}

#registerForm1
.register-username-availability.is-neutral {
    color: #e2c36b;
}

#registerForm1
.form-control.availability-pending {
    border-color: #f0ad4e !important;
    box-shadow: none !important;
}

#registerForm1
.register-field-status.is-pending {
    color: #f0ad4e;
}



#registerForm1
.register-password-toggle-host {
    position: relative;
}

#registerForm1
.register-password-toggle-host
.form-control {
    padding-right: 78px;
}

#registerForm1
.register-password-toggle {
    align-items: center;
    background: transparent;
    border: 0;
    color: #181818;
    cursor: pointer;
    display: flex;
    height: 30px;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 18px;
    top: 0;
    width: 32px;
    z-index: 7;
}

#registerForm1
.register-password-eye {
    fill: none;
    height: 20px;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.2;
    width: 20px;
}

#registerForm1
.register-password-eye[hidden] {
    display: none !important;
}


#registerForm1
.register-password-toggle-host
.register-field-status {
    right: 54px;
}

#registerForm1
.register-password-toggle:hover,
#registerForm1
.register-password-toggle:focus-visible {
    color: #c82f5b;
}

#registerForm1
.register-password-toggle:focus-visible {
    outline: 1px solid currentColor;
    outline-offset: 1px;
}



body.register-success-page {
    background:
        #170004;
}

body.register-success-page
#mainContentContainer {
    background:
        #170004;
    min-height:
        100vh;
}

body.register-success-page
#mainContentContainer
> .content.my01 {
    background:
        #170004;
    box-sizing:
        border-box;
    min-height:
        calc(100vh - 50px);
    padding-bottom:
        64px;
}

body.register-success-page
.reg-success.container-wrapper {
    background:
        #170004;
    margin:
        0;
    min-height:
        calc(100vh - 114px);
}

body.register-success-page
.reg-success
.container {
    background:
        #170004;
    min-height:
        calc(100vh - 114px);
    top:
        0 !important;
}

body.register-success-page
.reg-success
.content {
    margin-bottom:
        0;
}



body.register-success-page
.register-success-footer
.flex-row {
    display:
        flex;
    width:
        100%;
}

body.register-success-page
.register-success-footer
.footericon-single {
    flex:
        1 1 33.333333%;
    max-width:
        33.333333%;
    width:
        33.333333%;
}



[data-member-wallet-refresh]
.icon-refresh-2 {
    display: inline-block;
    transform-origin: center;
}

[data-member-wallet-refresh]
.icon-refresh-2.is-refreshing {
    animation:
        member-wallet-refresh-spin
        0.7s
        linear
        infinite;
}

@keyframes member-wallet-refresh-spin {
    from {
        transform:
            rotate(0deg);
    }

    to {
        transform:
            rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    [data-member-wallet-refresh]
    .icon-refresh-2.is-refreshing {
        animation:
            none;
    }
}



#slot-game-modal .md-content {
    background: #321c0d;
    color: #fff;
}

#slot-game-modal .md-body {
    color: #fff;
}

#slot-game-modal .g-title {
    color: #fff;
    font-size: 22px;
    font-weight: 400;
    line-height: 1.45;
    margin: 0;
    white-space: normal;
}

#slot-game-modal [data-slot-game-modal-image] {
    display: block;
    width: 100%;
    height: auto;
}



body.mobile.slots-index-page {
    min-height: 100vh;
}

body.mobile.slots-index-page
.main-content {
    margin-bottom: 0;
    min-height: 0;
}

body.mobile.slots-index-page
#mainContentContainer
> .content.my01 {
    margin-bottom: 0;
    min-height: 0;
    padding-bottom: 0px;
}

body.mobile.slots-index-page
.games-category {
    height: auto !important;
    min-height: 0 !important;

    
    padding-bottom: 98px !important;
}




body.qris-payment-page {
    background: #ffffff;
    color: #222222;
    min-height: 100vh;
}




.qris-payment-page .qris-payment-layout {
    background: #ffffff;
    box-sizing: border-box;
    min-height: 100vh;
    padding:
        24px
        14px
        34px;
    width: 100%;
}

.qris-payment {
    margin: 0 auto;
    max-width: 520px;
    width: 100%;
}

.qris-payment__container {
    box-sizing: border-box;
    width: 100%;
}




.qris-payment__header {
    margin-bottom: 18px;
    text-align: center;
}

.qris-payment__title {
    color: #168bd2;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0;
}




.qris-payment__card {
    background: #ffffff;

    border:
        1px
        solid
        #d6eaf7;

    border-radius: 8px;
    box-sizing: border-box;
    color: #222222;

    padding:
        20px
        18px;

    width: 100%;
}




.qris-payment__amount-block {
    border-bottom:
        1px
        solid
        #e2eef6;

    margin-bottom: 18px;
    padding-bottom: 17px;
    text-align: center;
}

.qris-payment__amount-label {
    color: #7b8b96;
    font-size: 12px;
    line-height: 1.4;
    margin-bottom: 5px;
}

.qris-payment__amount {
    color: #168bd2;
    font-size: 29px;
    font-weight: 700;
    line-height: 1.2;
}




.qris-payment__qr {
    align-items: center;
    display: flex;
    justify-content: center;
    margin: 0 auto;

    padding:
        4px
        0;

    width: 100%;
}

.qris-payment__qr-frame {
    align-items: center;
    background: #ffffff;

    border:
        1px
        solid
        #d6eaf7;

    border-radius: 6px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    max-width: 276px;
    overflow: hidden;
    padding: 8px;

    width:
        min(
            78vw,
            276px
        );
}

.qris-payment__qr-image {
    background: #ffffff;
    display: block;
    height: auto;
    image-rendering: auto;
    margin: 0 auto;
    max-width: 260px;
    object-fit: contain;
    width: 100%;
}

.qris-payment__scan-note {
    color: #527487;
    font-size: 12px;
    line-height: 1.5;

    margin:
        13px
        0
        19px;

    text-align: center;
}




.qris-payment__details {
    border-top:
        1px
        solid
        #e2eef6;

    margin: 0;
    padding: 0;
}

.qris-payment__detail {
    align-items: flex-start;

    border-bottom:
        1px
        solid
        #e2eef6;

    display: flex;
    gap: 14px;
    justify-content: space-between;

    padding:
        13px
        0;
}

.qris-payment__detail dt {
    color: #7790a0;
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 400;
    margin: 0;
}

.qris-payment__detail dd {
    color: #1c2b33;
    font-size: 12px;
    font-weight: 600;
    margin: 0;
    max-width: 70%;
    text-align: right;
}

.qris-payment__reference {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.qris-payment__status {
    color: #168bd2;
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
}




.qris-payment__instructions {
    background: #f5faff;

    border:
        1px
        solid
        #d6eaf7;

    border-radius: 8px;
    box-sizing: border-box;
    color: #243944;
    margin-top: 16px;

    padding:
        17px
        16px;
}

.qris-payment__instructions-title {
    color: #168bd2;
    font-size: 15px;
    font-weight: 700;

    margin:
        0
        0
        12px;
}

.qris-payment__instructions-list {
    color: #304b5b;
    font-size: 12px;
    line-height: 1.6;
    margin: 0;
    padding-left: 20px;
}

.qris-payment__instructions-list li + li {
    margin-top: 8px;
}




.qris-payment__cancel-warning {
    color: #d93025;
    font-weight: 600;
}




.qris-payment__navigation {
    margin-top: 18px;
    text-align: center;
}

.qris-payment__back-link {
    border:
        1px
        solid
        #168bd2;

    border-radius: 5px;
    color: #168bd2;
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    min-width: 100px;

    padding:
        9px
        16px;

    text-align: center;
    text-decoration: none;
}

.qris-payment__back-link:hover,
.qris-payment__back-link:focus {
    background: #168bd2;
    color: #ffffff;
    text-decoration: none;
}




@media (max-width: 480px) {
    .qris-payment-page .qris-payment-layout {
        padding:
            20px
            12px
            28px;
    }

    .qris-payment__header {
        margin-bottom: 16px;
    }

    .qris-payment__title {
        font-size: 20px;
    }

    .qris-payment__card {
        padding:
            18px
            15px;
    }

    .qris-payment__amount {
        font-size: 26px;
    }

    .qris-payment__qr-frame {
        max-width: 266px;

        width:
            min(
                78vw,
                266px
            );
    }

    .qris-payment__qr-image {
        max-width: 250px;
    }

    .qris-payment__detail dd {
        max-width: 68%;
    }

    .qris-payment__instructions {
        padding:
            15px
            14px;
    }
}




@media (max-width: 360px) {
    .qris-payment-page .qris-payment-layout {
        padding-left: 9px;
        padding-right: 9px;
    }

    .qris-payment__card {
        padding-left: 12px;
        padding-right: 12px;
    }

    .qris-payment__qr-frame {
        max-width: 236px;

        width:
            min(
                76vw,
                236px
            );
    }

    .qris-payment__qr-image {
        max-width: 220px;
    }

    .qris-payment__instructions {
        padding-left: 12px;
        padding-right: 12px;
    }
}



.member-svc
[data-member-service-whatsapp][hidden],
.member-svc
[data-member-service-withdraw][hidden] {
    display: none !important;
}

.withdraw-activity {
    box-sizing: border-box;
    min-height: 300px;

    padding:
        18px
        18px
        20px;

    width: 100%;
}

.withdraw-activity__notice {
    color:
        rgba(
            255,
            255,
            255,
            0.62
        );

    font-size: 10px;
    line-height: 1.4;
    margin-bottom: 14px;
    text-align: left;
}

.withdraw-activity__viewport {
    height: 240px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.withdraw-activity__track {
    display: flex;
    flex-direction: column;
    gap: 8px;

    transform:
        translate3d(
            0,
            0,
            0
        );

    will-change: transform;
}

.withdraw-activity__row {
    align-items: center;

    border-bottom:
        1px
        solid
        rgba(
            255,
            255,
            255,
            0.08
        );

    display: flex;
    flex: 0 0 54px;
    justify-content: space-between;
    min-height: 54px;

    padding:
        8px
        6px;

    width: 100%;
}

.withdraw-activity__username,
.withdraw-activity__amount {
    min-width: 0;
}

.withdraw-activity__username {
    color:
        rgba(
            255,
            255,
            255,
            0.82
        );

    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.25px;
    overflow: hidden;
    padding-right: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.withdraw-activity__amount {
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-align: right;
    white-space: nowrap;
}

.withdraw-activity__empty {
    color:
        rgba(
            255,
            255,
            255,
            0.68
        );

    font-size: 12px;

    margin:
        36px
        0
        0;

    text-align: center;
}

@media (max-width: 480px) {
    .withdraw-activity {
        min-height: 290px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .withdraw-activity__viewport {
        height: 232px;
    }

    .withdraw-activity__row {
        flex-basis: 52px;
        min-height: 52px;
    }

    .withdraw-activity__username,
    .withdraw-activity__amount {
        font-size: 11px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .withdraw-activity__track {
        transition: none !important;
    }
}




.entry-popup[hidden] {
    display: none !important;
}

.entry-popup {
    align-items: center;

    background:
        rgba(
            8,
            5,
            4,
            0.74
        );

    display: flex;
    inset: 0;
    justify-content: center;
    opacity: 0;
    overscroll-behavior: contain;
    padding: 24px;
    position: fixed;
    touch-action: none;

    transition:
        opacity
        180ms
        cubic-bezier(
            0.4,
            0,
            1,
            1
        );

    -webkit-backdrop-filter:
        blur(9px)
        saturate(0.9);

    backdrop-filter:
        blur(9px)
        saturate(0.9);

    z-index: 2147483000;
}

.entry-popup.is-visible {
    opacity: 1;

    transition-duration:
        280ms;

    transition-timing-function:
        cubic-bezier(
            0.16,
            1,
            0.3,
            1
        );
}

.entry-popup__dialog {
    filter:
        blur(4px);

    max-height: 86vh;

    max-width:
        min(
            92vw,
            760px
        );

    opacity: 0;
    outline: none;
    position: relative;

    transform:
        translate3d(
            0,
            18px,
            0
        )
        scale(0.945);

    transform-origin:
        50%
        52%;

    transition:
        transform
        190ms
        cubic-bezier(
            0.4,
            0,
            1,
            1
        ),
        opacity
        150ms
        ease,
        filter
        150ms
        ease;

    width: fit-content;

    will-change:
        transform,
        opacity,
        filter;
}

.entry-popup.is-visible
.entry-popup__dialog {
    filter:
        blur(0);

    opacity: 1;

    transform:
        translate3d(
            0,
            0,
            0
        )
        scale(1);

    transition:
        transform
        320ms
        cubic-bezier(
            0.16,
            1,
            0.3,
            1
        ),
        opacity
        220ms
        ease-out,
        filter
        220ms
        ease-out;
}

.entry-popup__image {
    border-radius: 16px;

    box-shadow:
        0
        28px
        80px
        rgba(
            0,
            0,
            0,
            0.48
        ),
        0
        2px
        12px
        rgba(
            0,
            0,
            0,
            0.22
        );

    display: block;
    height: auto;
    max-height: 86vh;
    max-width: 100%;
    object-fit: contain;
    user-select: none;
    width: auto;

    -webkit-user-drag: none;
}

.entry-popup__close {
    align-items: center;

    -webkit-backdrop-filter:
        blur(12px);

    backdrop-filter:
        blur(12px);

    background:
        rgba(
            20,
            16,
            14,
            0.64
        );

    border:
        1px
        solid
        rgba(
            255,
            255,
            255,
            0.24
        );

    border-radius: 999px;

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

    color:
        rgba(
            255,
            255,
            255,
            0.92
        );

    cursor: pointer;
    display: flex;
    height: 34px;
    justify-content: center;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 12px;
    top: 12px;

    transition:
        background-color
        150ms
        ease,
        border-color
        150ms
        ease,
        box-shadow
        150ms
        ease,
        color
        150ms
        ease,
        transform
        150ms
        ease;

    width: 34px;
    z-index: 2;
}

.entry-popup__close
svg {
    height: 16px;
    pointer-events: none;
    width: 16px;
}

.entry-popup__close:hover {
    background:
        rgba(
            20,
            16,
            14,
            0.82
        );

    border-color:
        rgba(
            255,
            255,
            255,
            0.36
        );

    color: #fff;

    transform:
        translateY(-1px)
        scale(1.035);
}

.entry-popup__close:focus-visible {
    background:
        rgba(
            20,
            16,
            14,
            0.82
        );

    border-color:
        rgba(
            255,
            255,
            255,
            0.44
        );

    box-shadow:
        0
        0
        0
        3px
        rgba(
            255,
            255,
            255,
            0.14
        ),
        0
        6px
        18px
        rgba(
            0,
            0,
            0,
            0.3
        );

    color: #fff;
    outline: none;
}

.entry-popup__close:active {
    transform:
        scale(0.94);
}

@media (max-width: 480px) {
    .entry-popup {
        padding: 16px;
    }

    .entry-popup__dialog {
        max-height: 82vh;
        max-width: 94vw;
    }

    .entry-popup__image {
        border-radius: 12px;
        max-height: 82vh;
    }

    .entry-popup__close {
        height: 32px;
        right: 9px;
        top: 9px;
        width: 32px;
    }

    .entry-popup__close
    svg {
        height: 15px;
        width: 15px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .entry-popup,
    .entry-popup__dialog,
    .entry-popup__close {
        transition: none !important;
    }

    .entry-popup__dialog {
        filter: none !important;
        transform: none !important;
    }
}