serce-top-bar {
    cursor: pointer
}

serce-top-bar>div {
    height: 42px !important;
    min-height: unset !important;
    min-width: unset !important;
    background: linear-gradient(-38deg, #daddd8 0%, #eac1fb 100%)
}

serce-top-bar:hover>div {
    background-color: #e08784
}

serce-top-bar>div>img {
    height: 32px
}

.yoyo-toast-container {
    z-index: 1999999 !important
}

div.serce-modal * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Roboto,sans-serif
}

div.serce-modal .hidden {
    display: none !important
}

div.serce-modal button {
    border: none;
    cursor: pointer;
    background: none
}

div.serce-modal .accent-fg {
    color: #e4b000
}

div.serce-modal .accent-bg {
    background: #e4b000
}

div.serce-modal .accent-fill {
    fill: #e4b000
}

div.serce-modal .accent-stroke {
    stroke: #e4b000
}

div.serce-modal .accent-emphasis-fg {
    color: #ff9d05
}

div.serce-modal .accent-emphasis-bg {
    background: #ff9d05
}

div.serce-modal .accent-emphasis-fill {
    fill: #ff9d05
}

div.serce-modal .accent-emphasis-stroke {
    stroke: #ff9d05
}

div.serce-modal .grey-text {
    color: #b1bad3
}

div.serce-modal i.vi {
    pointer-events: none;
    stroke-width: 0;
    stroke: currentColor;
    fill: currentColor;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: block;
    color: #b1bad3;
    margin-left: .25rem
}

div.serce-modal i.vi-currency-try {
    background-image: url(../../common/img/currencies/try.svg)
}

div.serce-modal i.sm {
    width: 1rem;
    height: 1rem
}

div.serce-modal i.md {
    width: 1.25rem;
    height: 1.25rem
}

div.serce-modal i.lg {
    width: 1.5rem;
    height: 1.5rem
}

div.serce-modal i.xl {
    width: 2rem;
    height: 2rem
}

div.serce-modal i.xxl {
    width: 3rem;
    height: 3rem
}

div.serce-modal.visible {
    visibility: visible;
    opacity: 1
}

div.serce-modal {
    z-index: 999999;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0;
    background: rgba(0,0,0,.8);
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all .35s ease-in;
    transition: all .35s ease-in;
    font: 12px/1.5 Roboto,sans-serif;
    width: 100%
}

div.serce-modal #tab-page-calendar .title-text {
    color: #a2a9b9;
    font-weight: bold;
    margin-bottom: .5rem
}

div.serce-modal #tab-page-calendar .day-tabs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-color: auto
}

div.serce-modal #tab-page-calendar .day-tabs::-webkit-scrollbar {
    display: none
}

div.serce-modal #tab-page-calendar .day-tabs button.day-tab {
    text-transform: uppercase;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    color: #a2a9b9;
    background: #232935;
    padding: 9px 16px;
    border-radius: 3px;
    margin-right: .2rem;
    font-size: .7rem;
    font-weight: bold;
    width: 99px;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

div.serce-modal #tab-page-calendar .day-tabs button.day-tab:hover,div.serce-modal #tab-page-calendar .day-tabs button.day-tab.active {
    background: #e4b000;
    color: #1f242b
}

div.serce-modal div.vip-bonus-container {
    overflow-y: auto;
    padding-right: .6rem
}

div.serce-modal div.vip-bonus-container::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    border-radius: 10px;
    background-color: #282d36
}

div.serce-modal div.vip-bonus-container::-webkit-scrollbar {
    width: 8px;
    padding: 5px
}

div.serce-modal div.vip-bonus-container::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #e5b645
}

div.serce-modal div.vip-bonus-container.vip-bonus-tab {
    height: 300px;
    margin-top: 1rem
}

div.serce-modal div.vip-bonus-container.calendar-tab {
    height: 450px
}

div.serce-modal div.vip-bonus-container .vip-bonus {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: .6rem;
    border-radius: .6rem;
    background-image: url(../../common/img/bg-content.svg);
    background-repeat: no-repeat;
    padding: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 10px
}

div.serce-modal div.vip-bonus-container .vip-bonus i {
    width: 2.5rem;
    height: 2.5rem
}

div.serce-modal div.vip-bonus-container .vip-bonus button {
    background: #c59c6c;
    padding: 9px 15px;
    border-radius: 4px;
    margin: 0 auto;
    text-align: center;
    color: #181c24;
    font-size: 11px;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    font-weight: bold
}

div.serce-modal div.vip-bonus-container .vip-bonus button.silver {
    background: #a2a9b9;
    color: #1e2229
}

div.serce-modal div.vip-bonus-container .vip-bonus>.bonus-name {
    width: 100%;
    font-size: 1rem;
    color: #fff
}

div.serce-modal div.vip-bonus-container .vip-bonus div.countdown {
    zoom:75%;padding: .6rem;
    border-radius: .6rem;
    background: #303643;
    justify-self: end;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    gap: 1px
}

div.serce-modal div.vip-bonus-container .vip-bonus div.countdown>span {
    display: none;
    font-size: .8rem
}

div.serce-modal div.vip-bonus-container .vip-bonus div.countdown-timer {
    gap: 2px
}

div.serce-modal .mobile-height::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    border-radius: 10px;
    background-color: #282d36
}

div.serce-modal .mobile-height::-webkit-scrollbar {
    width: 8px;
    padding: 5px
}

div.serce-modal .mobile-height::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #e5b645
}

@media screen and (max-width: 560px) {
    div.serce-modal .mobile-height {
        height:220px;
        overflow-y: scroll;
        padding: 1rem 0
    }
}

div.serce-modal .modal-dialog {
    margin: 0;
    padding: 0;
    background: #303643;
    border-radius: .6rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Roboto,sans-serif;
    width: 100%
}

@media screen and (min-width: 700px) {
    div.serce-modal .modal-dialog {
        width:580px
    }
}

div.serce-modal .modal-dialog>header {
    margin-top: unset;
    -webkit-box-shadow: unset;
    box-shadow: unset;
    background-color: unset;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: .6rem .6rem
}

div.serce-modal .modal-dialog>header h2 {
    font-size: 1rem;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0
}

div.serce-modal .modal-dialog>header h2 img {
    width: 2rem;
    height: 2rem;
    margin-right: .6rem;
    display: block
}

div.serce-modal .modal-dialog>header button.close-modal {
    width: 1rem;
    height: 1rem;
    background: url(../../common/img/close.svg) center center no-repeat;
    color: #b1bad3
}

div.serce-modal .modal-dialog>content {
    display: block;
    overflow-y: auto;
    overflow-x: auto;
    min-height: 550px;
    max-height: 550px;
    height: 550px
}

div.serce-modal .modal-dialog>footer {
    padding: .6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: #232935;
    border-radius: 0 0 .6rem .6rem;
    font-size: .875rem;
    color: #fff
}

div.serce-modal .modal-dialog>footer a {
    text-decoration: none;
    color: #b1bad3;
    font-size: .875rem
}

div.serce-modal .modal-dialog content .flex-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

div.serce-modal .modal-dialog content .flex-center>div {
    color: #a2a9b9;
    text-align: center;
    width: 100%;
    font-size: .9rem
}

div.serce-modal .modal-dialog content .flex-center>div>i {
    display: inline-block !important;
    margin-bottom: -1px
}

div.serce-modal .modal-dialog content .flex-center>div.error {
    color: #deb887;
    font-size: 1rem
}

div.serce-modal .modal-dialog content .flex-center>div.bakiye {
    font-size: 1.3rem;
    font-weight: 600
}

div.serce-modal .modal-dialog content .flex-center>div.countdown {
    zoom:75%;margin: 0 !important;
    padding: 0 !important
}

div.serce-modal .modal-dialog content .flex-center>div.countdown div>div.countdown-timer_time {
    background-color: #1a2c38
}

div.serce-modal .modal-dialog content .flex-center>* {
    margin: .15rem 0 !important
}

div.serce-modal .modal-dialog content button.claim {
    background-color: #e4b000;
    color: #000;
    width: 150px;
    height: 40px;
    text-align: center
}

div.serce-modal .modal-dialog content button.claim.disabled {
    background: #2c332c !important;
    color: #fff !important;
    cursor: default
}

div.serce-modal .modal-dialog content button.claim:hover:not(.disabled) {
    background: #12a112
}

div.serce-modal .modal-dialog content .countdown {
    padding: 1rem;
    gap: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center
}

div.serce-modal .modal-dialog content .countdown span {
    font-size: 1rem;
    color: #fff
}

div.serce-modal .modal-dialog content .countdown-timer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 10px
}

div.serce-modal .modal-dialog content .countdown-timer_time {
    background: #0f212e;
    height: 50px;
    width: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 4px
}

div.serce-modal .modal-dialog content .countdown-timer_time .digit {
    font-size: .875rem;
    color: #fff;
    font-weight: bold
}

div.serce-modal .modal-dialog content .countdown-timer_time .unit {
    font-size: .7rem;
    color: #b1bad3
}

div.serce-modal .modal-dialog content .countdown-description {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem
}

div.serce-modal .modal-dialog content .countdown-description a {
    text-decoration: none;
    color: #fff
}

div.serce-modal .modal-dialog content .countdown-description a svg {
    color: #b1bad3;
    width: 1.2rem;
    height: 1.2rem
}

div.serce-modal .modal-dialog content i.ico {
    height: 50px;
    width: 50px;
    display: block;
    background-size: contain;
    background-repeat: no-repeat
}

div.serce-modal .modal-dialog content i.ico.star-up {
    background-image: url("../../common/img/star-up.png")
}

div.serce-modal .modal-dialog content i.ico.star-up-muted {
    background-image: url("../../common/img/star-up-muted.png")
}

div.serce-modal .modal-dialog content i.ico.star-highlight {
    background-image: url("../../common/img/star-highlight.png")
}

div.serce-modal .modal-dialog content i.ico.star-highlight-muted {
    background-image: url("../../common/img/star-highlight-muted.png")
}

div.serce-modal .modal-dialog content i.ico.star-medal {
    background-image: url("../../common/img/star-medal.png")
}

div.serce-modal .modal-dialog content i.ico.star-medal-muted {
    background-image: url("../../common/img/star-medal-muted.png")
}

div.serce-modal .modal-dialog content i.ico.box {
    background-image: url("../../common/img/box.png")
}

div.serce-modal .modal-dialog content i.ico.box-muted {
    background-image: url("../../common/img/box-muted.png")
}

div.serce-modal .modal-dialog content .popup-cta,div.serce-modal .modal-dialog content .popup-cta-inline {
    background: #e4b000;
    cursor: pointer;
    padding: 10px 16px;
    border-radius: 4px;
    margin: 0 auto;
    text-align: center;
    font-weight: bold;
    color: #181c24;
    text-decoration: none;
    font-size: .7rem
}

div.serce-modal .modal-dialog content .popup-cta:hover,div.serce-modal .modal-dialog content .popup-cta-inline:hover {
    background: #feda6d
}

div.serce-modal .modal-dialog content .popup-cta.disabled,div.serce-modal .modal-dialog content .popup-cta-inline.disabled {
    cursor: default;
    background: #485062;
    color: #181c24
}

div.serce-modal .modal-dialog content .popup-cta {
    min-width: 130px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background-color: #303643
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-header {
    background: #232935;
    padding: .4rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: clip;
    position: relative
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-header>button {
    background: rgba(0,0,0,0);
    text-transform: uppercase;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    font-weight: 400;
    font-size: .875rem;
    border-bottom: 2px rgba(0,0,0,0) solid;
    margin-bottom: -2px;
    padding: .6rem .2rem;
    color: #fff;
    text-align: center;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    font-weight: bold
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-header>button:not(:first-child) {
    margin-left: 5px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-header>button:hover {
    color: #e4b000
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-header>button.active {
    color: #e4b000
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-header>button.active:after {
    content: "";
    position: absolute;
    bottom: -3px;
    left: 0;
    width: calc(100% - 10px);
    height: 3px;
    z-index: 4;
    right: 0;
    margin: 0 auto;
    background: #e4b000;
    border-radius: 0px 0px 5px 5px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content {
    margin: 6px 0 0 0;
    padding-bottom: .6rem;
    display: block;
    overflow-y: auto;
    overflow-x: auto;
    height: 100%
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content h2 {
    font-size: 1.2rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page {
    display: none;
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 1.2rem;
    padding-bottom: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page table td svg {
    -webkit-transform: translate(0px, 2px);
    transform: translate(0px, 2px)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page table thead th:first-child {
    border-radius: 5px 0 0 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page table thead th:last-child {
    border-radius: 0 5px 0 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page-active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card {
    width: 100%;
    height: 100%;
    background-image: url(../../common/img/bg-content.svg);
    background-repeat: no-repeat;
    border-radius: .6rem;
    padding: 1.2rem;
    position: relative
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card svg.wallet {
    position: absolute;
    top: 4px;
    right: 10px;
    width: 2rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card {
    text-align: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card button {
    background: #e4b000;
    padding: 10px 20px;
    border-radius: 4px;
    margin: 0 auto;
    text-align: center;
    font-weight: bold;
    color: #181c24
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0rem 0 .5rem 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: bold
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier-label i {
    margin-right: 5px;
    width: 2.5rem;
    height: 2.5rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier-label span {
    color: #b1bad3;
    font-size: .875rem;
    line-height: 1rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card .balance {
    color: #a2a9b9;
    font-size: 3rem;
    font-weight: 600;
    text-align: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card .balance i {
    font-size: 2rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card .error {
    color: #deb887;
    font-size: .7rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card .countdown {
    zoom:75%;margin: 0;
    padding: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card .countdown div>div.countdown-timer_time {
    background-color: #1a2c38
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    color: #b1bad3;
    font-size: .875rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_label .percentage {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_label .percentage span.percent {
    font-size: .875rem;
    line-height: .775rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_label .percentage span.tooltip {
    position: relative;
    display: inline-block;
    margin-left: 5px;
    z-index: 999
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_label .percentage span.tooltip svg {
    width: 1rem;
    height: 1rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_label .percentage span.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: .5rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer i>svg {
    width: 1rem;
    height: 1rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-bar {
    width: 100%;
    height: 1.8rem;
    background: #303643;
    border-radius: 22px;
    margin: .5rem 0;
    position: relative;
    overflow: hidden
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-bar .bar {
    position: absolute;
    left: 0;
    width: 100%;
    background: #e4b000;
    height: 100%;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-bar>div {
    height: 100%
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-bar .animated-bar {
    width: 100%;
    background: #e4b000;
    height: 100%;
    -webkit-animation: progressBar 3s ease-in-out;
    animation: progressBar 3s ease-in-out
}

@-webkit-keyframes progressBar {
    0% {
        width: 0
    }

    100% {
        width: 100%
    }
}

@keyframes progressBar {
    0% {
        width: 0
    }

    100% {
        width: 100%
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-title {
    color: #fff;
    margin-bottom: 1rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-items {
    display: grid;
    gap: 1rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-items>.faq-item {
    display: grid;
    gap: .75rem;
    grid-template-columns: repeat(8, minmax(0, 1fr))
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-items>.faq-item i.text {
    color: #b1bad3;
    font-style: normal;
    font-size: 1.2rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-items>.faq-item i {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 5px;
    background-color: #1e2229
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-items>.faq-item i {
        width:3rem;
        height: 3rem
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-items>.faq-item i>svg,div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-items>.faq-item i>img {
    pointer-events: none;
    stroke-width: 0;
    stroke: currentColor;
    fill: currentColor;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: inline-block;
    width: 1rem;
    height: 1rem;
    color: #b1bad3
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-items>.faq-item i>svg,div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq-items>.faq-item i>img {
        width:1.5rem;
        height: 1.5rem
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq .faq-text {
    grid-column: span 7/span 7
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq .faq-text span {
    display: block;
    font-size: .775rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq .faq-text span:first-child {
    color: #fff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .faq .faq-text span:nth-child(2) {
    color: #b1bad3
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section {
    margin-top: .75rem;
    background: #1e2229;
    border-radius: 10px;
    padding: .625rem .75rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: .5rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-header .streak-title {
    color: #fff;
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .01em
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-header .streak-badge {
    font-size: .7rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
    line-height: 1.4
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-header .streak-badge.active {
    background: rgba(228,176,0,.15);
    color: #e4b000;
    border: 1px solid rgba(228,176,0,.3)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-header .streak-badge.inactive {
    background: hsla(0,0%,100%,.06);
    color: #b1bad3;
    border: 1px solid hsla(0,0%,100%,.08)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: .375rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress .streak-day {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 3px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
    position: relative
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress .streak-day:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 13px;
    left: calc(50% + 14px);
    width: calc(100% - 28px);
    height: 2px;
    background: hsla(0,0%,100%,.06)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress .streak-day:not(:last-child).completed::after {
    background: rgba(228,176,0,.35)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress .streak-day .day-circle {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: .65rem;
    font-weight: 600;
    background: hsla(0,0%,100%,.06);
    color: hsla(0,0%,100%,.3);
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    position: relative;
    z-index: 1
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress .streak-day .day-circle {
        width:28px;
        height: 28px;
        font-size: .7rem
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress .streak-day .day-multiplier {
    font-size: .6rem;
    color: hsla(0,0%,100%,.25);
    font-weight: 500
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress .streak-day.completed .day-circle {
    background: #e4b000;
    color: #fff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress .streak-day.completed .day-multiplier {
    color: #e4b000;
    font-weight: 600
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-progress .streak-day.current .day-circle {
    -webkit-box-shadow: 0 0 0 2px rgba(228,176,0,.5),0 0 8px rgba(228,176,0,.2);
    box-shadow: 0 0 0 2px rgba(228,176,0,.5),0 0 8px rgba(228,176,0,.2)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-info {
    text-align: center;
    font-size: .7rem;
    color: hsla(0,0%,100%,.4);
    padding-top: .125rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .deposit-streak-section .streak-info strong {
    color: #e4b000
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-header {
    margin: .6rem;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-header>svg {
    margin-right: .2rem;
    height: 24px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-header>span {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    margin-top: 6px;
    font-size: .825rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-content {
    background-color: #252a3a;
    border-radius: .6rem;
    padding: 1.2rem;
    font-family: Roboto,sans-serif;
    background-image: url(../../common/img/bg-content.svg);
    background-repeat: no-repeat
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-content .statistic {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: .6rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-content .statistic>.icon {
    margin-right: .6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 35px;
    width: 35px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-content .statistic>.info {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: #fff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-content .statistic>.info>.title {
    font-size: .775rem;
    color: #b0b5c3
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-content .statistic>.info>.value {
    font-size: .825rem;
    font-weight: bold
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-content .statistic:last-child {
    margin-bottom: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-footer {
    font-size: 13px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1.2rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-footer>.icon {
    margin-right: .6rem;
    font-size: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 20px;
    width: 20px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .progression-tab-content .progression-statistics-footer>.warn {
    color: #fff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content.tab-page-active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .75rem;
    padding: 1rem 1rem 1.25rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-description {
    color: #fff;
    font-size: .95rem;
    text-align: center;
    font-weight: 500;
    line-height: 1.4
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 12px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    -webkit-transition: opacity .15s ease,-webkit-transform .15s ease;
    transition: opacity .15s ease,-webkit-transform .15s ease;
    transition: transform .15s ease,opacity .15s ease;
    transition: transform .15s ease,opacity .15s ease,-webkit-transform .15s ease;
    color: #fff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-btn:hover {
    -webkit-transform: scale(1.08);
    transform: scale(1.08)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-btn:active {
    -webkit-transform: scale(0.95);
    transform: scale(0.95)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-btn svg {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-msg-wa {
    background: #25d366
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-msg-tg {
    background: #08c
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-msg-fb {
    background: linear-gradient(135deg, #0695FF 0%, #A334FA 50%, #FF6968 100%)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-msg-sms {
    background: hsla(0,0%,100%,.15)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-copy-link {
    background: hsla(0,0%,100%,.15)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-copy-link .icon-check {
    display: none
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-copy-link.copied {
    background: #25d366
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-copy-link.copied .icon-copy {
    display: none
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .affiliate-invite-actions .invite-copy-link.copied .icon-check {
    display: block
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .progress-container .affiliate-hero .affiliate-link-section .create-affiliate-link {
    min-width: 180px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section {
    margin-top: 1rem;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-height: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-section-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .5rem;
    padding: 0 .6rem;
    margin-bottom: .75rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-section-header svg {
    stroke: #b1bad3
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-section-header span {
    color: #fff;
    font-size: .9rem;
    font-weight: 500
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content {
    background: rgba(37,42,58,.8);
    border-radius: .6rem;
    padding: .6rem;
    background-image: url(../../common/img/bg-content.svg);
    background-repeat: no-repeat;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow-y: auto
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .5rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .75rem;
    background: rgba(0,0,0,.2);
    border-radius: 6px;
    -webkit-transition: background .2s ease;
    transition: background .2s ease
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item:hover {
    background: rgba(0,0,0,.3)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .75rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-info .invitation-avatar {
    width: 36px;
    height: 36px;
    background: #1e2229;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-info .invitation-avatar svg {
    stroke: #b1bad3
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-info .invitation-details {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 2px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-info .invitation-details .invitee-username {
    color: #fff;
    font-size: .85rem;
    font-weight: 500
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-info .invitation-details .invited-date {
    color: #b1bad3;
    font-size: .7rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 6px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .popup-cta {
    padding: 8px 14px;
    font-size: .65rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .countdown {
    zoom:60%;padding: 2px 4px;
    gap: 1px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .countdown .countdown-title {
    display: none
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .countdown .countdown-timer {
    gap: 2px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .status-badge {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: .7rem;
    font-weight: 500
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .status-badge.claimed {
    background: rgba(34,197,94,.15);
    color: #22c55e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .status-badge.claimed svg {
    stroke: #22c55e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .status-badge.pending {
    background: rgba(251,191,36,.15);
    color: #fbbf24
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .status-badge.pending svg {
    stroke: #fbbf24
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .status-badge.expired {
    background: rgba(239,68,68,.15);
    color: #ef4444
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .invitations-list .invitation-item .invitation-action .status-badge.expired svg {
    stroke: #ef4444
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .no-invitations {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
    text-align: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .no-invitations .empty-state-icon {
    width: 64px;
    height: 64px;
    opacity: .4
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .no-invitations .empty-state-icon svg {
    stroke: #b1bad3
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .no-invitations .empty-title {
    color: #fff;
    font-size: .9rem;
    margin: 0 0 .25rem 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .affiliate-tab-content .affiliate-invitations-section .affiliate-invitations-content .no-invitations .empty-subtitle {
    color: #b1bad3;
    font-size: .8rem;
    margin: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content {
    width: 100%;
    color: #fff;
    height: 470px;
    overflow-y: scroll
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    border-radius: 10px;
    background-color: #282d36
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content::-webkit-scrollbar {
    width: 8px;
    padding: 5px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #e5b645
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content h2 {
    font-size: 1.2rem;
    font-weight: bold
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table {
    width: 100%;
    text-align: left;
    border-collapse: collapse
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table thead {
    border-bottom: none !important
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table thead th {
    padding: 1rem;
    font-size: .8rem;
    font-weight: bold;
    background-color: #191c22;
    height: 61px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table .vip-star {
    width: 21px;
    padding: 6px 6px 0 0px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table tbody td {
    padding: .75rem 1rem;
    font-size: .75rem;
    border-bottom: 5px solid #303643
}

@media screen and (max-width: 700px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table tbody td {
        font-size:.63rem
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table tbody td svg {
    width: 1rem;
    -webkit-transform: translate(-2px, 3px);
    transform: translate(-2px, 3px);
    display: unset !important;
    vertical-align: unset !important
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table tbody td strong {
    max-width: 85%;
    display: inline-block;
    overflow: clip
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table tbody td:last-child {
    font-weight: bold
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table tbody tr {
    -webkit-box-shadow: 0 1px 3px 0 rgba(0,0,0,.2),0 1px 2px 0 rgba(0,0,0,.12),inset 0 1px hsla(0,0%,100%,.04);
    box-shadow: 0 1px 3px 0 rgba(0,0,0,.2),0 1px 2px 0 rgba(0,0,0,.12),inset 0 1px hsla(0,0%,100%,.04);
    border-radius: .25rem;
    background-image: url(../../common/img/bg-content.svg)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table tbody span {
    font-weight: bold;
    padding: 10px 15px;
    border-radius: 50%
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table tbody tr:first-child span {
    background: #1e2229
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .winners-tab-content table tbody tr span {
    background: #262626;
    color: #1e2229
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content {
    padding: .6rem .6rem 0 .6rem;
    width: 100%;
    color: #fff;
    font-size: 1.2rem;
    text-align: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content h2 {
    font-size: 1.7rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card {
    background-image: url("../../common/img/kick-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center right;
    padding: 1.2rem 1.2rem .6rem 1.2rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card header {
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card header span {
    color: #a2a9b9;
    text-transform: uppercase;
    font-weight: bold;
    margin-left: .4rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card ul.content {
    display: grid;
    text-align: left;
    padding-left: 0;
    margin: .6rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card ul.content li {
    list-style-type: none
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card ul.content li span svg {
    width: 41px;
    height: auto
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card ul.content li span:first-child {
    width: 96px;
    display: inline-block;
    font-size: .9rem;
    color: #a2a9b9;
    position: relative;
    margin-right: 4px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card ul.content li span:first-child:after {
    content: ":";
    position: absolute;
    right: 0;
    font-weight: bold;
    bottom: 0px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card ul.content li span:nth-child(2) {
    font-size: .9rem;
    color: #c2c8d5
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card ul.content li span a {
    text-decoration: none;
    color: #fff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content>.progress-container .progress-card ul.content li span a i {
    color: #e4b000
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content .description {
    text-align: center;
    font-size: .9rem;
    word-break: break-word
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content .description p span {
    color: #e4b000
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content .footer-raffle {
    margin-top: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content .footer-raffle h3 {
    margin: 0;
    font-size: .9rem;
    opacity: .5
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content .footer-raffle p {
    font-size: .8rem;
    margin-top: .2rem;
    opacity: .5
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .raffle-tab-content .cta-container {
    text-align: center;
    margin: 1.2rem 0 0 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content {
    width: 100%;
    color: #fff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-column button {
    margin: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-column>* {
    height: initial;
    border-radius: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-column>*:first-child {
    border-radius: .6rem 0 0 .6rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-column>*:last-child {
    border-radius: 0 .6rem .6rem 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-column>div.countdown.rounded {
    border-radius: .6rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-card {
    padding: .6rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-card_header {
    gap: .6rem;
    margin: 0 0 1.2rem 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-card_header>span {
    font-size: 1.2rem;
    color: #fff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-card div.countdown {
    padding: .6rem;
    background: #303643;
    justify-self: end;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    gap: 1px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-card div.countdown>span {
    display: none;
    font-size: .8rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-card div.countdown-timer {
    gap: 2px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .freespin-tab-content .progress-container .progress-card {
    width: 100%
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content {
    overflow-y: auto
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks {
    display: grid;
    gap: 10px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk {
    padding: 1rem;
    background-image: url("../../common/img/bg-content.svg");
    background-repeat: repeat-y;
    border-radius: .6rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk.no-border,div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk.no-border.active {
    border: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk.active {
    border: 1px solid #e4b000
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk.active .content {
    display: block
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk.active .header div:first-child svg {
    stroke: #e4b000
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk.active .header .icon-container {
    width: unset;
    height: unset;
    background-color: unset;
    border-radius: unset;
    display: unset
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk.active .header .icon-container i:first-child {
    display: none
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk.active .header .icon-container i:last-child {
    display: block
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk.active .header .popup-cta {
    display: none
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header {
    margin-top: unset;
    display: grid;
    text-align: left;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    grid-template-columns: repeat(24, minmax(0, 1fr))
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header span {
    color: #fff;
    font-size: .7rem
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header span {
        font-size:1rem
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header .icon-container {
    width: unset;
    height: unset;
    background-color: unset;
    border-radius: unset;
    display: unset
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header .icon-container i:first-child {
    display: block
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header .icon-container i:last-child {
    display: none
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header .stretch {
    grid-column: span 21 !important
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header.has-countdown div:nth-child(2) {
    grid-column: span 8/span 8
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header.has-countdown div:nth-child(2) {
        grid-column:span 10/span 10
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header.has-countdown div:nth-child(3) {
    grid-column: span 13/span 13
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header.has-countdown div:nth-child(3) {
        grid-column:span 11/span 11
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header.has-countdown div.countdown {
    zoom:75%;padding: .6rem;
    border-radius: .6rem;
    background: #485062;
    justify-self: end;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    gap: 1px;
    font: 12px Roboto,sans-serif
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header.has-countdown div.countdown>span {
    display: none;
    font-size: .8rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header.has-countdown div.countdown-timer {
    gap: 2px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header.has-countdown div.countdown-timer_time span {
    color: #b1bad3;
    font-size: .7rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header.has-countdown div.countdown-timer_time span.digit {
    color: #fff;
    font-size: .875rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header div:first-child {
    grid-column: span 3/span 3
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header div:first-child svg {
    stroke: #485062;
    width: 30px;
    height: 30px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header div:nth-child(2) {
    grid-column: span 8/span 8
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header div:nth-child(2) {
        grid-column:span 14/span 14
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header .popup-cta {
    grid-column: span 13/span 13
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .header .popup-cta {
        grid-column:span 7/span 7
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content {
    display: none
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 15px 19px;
    background: #303643;
    margin-top: 1rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 6px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div:first-child {
    text-align: center;
    margin: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div:nth-child(2) {
    grid-column: span 8/span 8
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div:nth-child(2) {
        grid-column:span 10/span 10
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div:nth-child(3) {
    grid-column: span 13/span 13
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div:nth-child(3) {
        grid-column:span 11/span 11
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div.countdown {
    zoom:75%;padding: .6rem;
    border-radius: .6rem;
    background: #485062;
    justify-self: end;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    gap: 1px;
    font: 12px Roboto,sans-serif
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div.countdown>span {
    display: none;
    font-size: .8rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div.countdown-timer {
    gap: 2px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div.countdown-timer_time span {
    color: #b1bad3;
    font-size: .7rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.has-countdown div.countdown-timer_time span.digit {
    color: #fff;
    font-size: .875rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.button-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.button-group button {
    border-radius: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.button-group button.red {
    background-color: #952323
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.button-group button.red:hover {
    background-color: #d44949
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.button-group button:first-child {
    border-radius: 4px 0 0 4px
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus .action.button-group button:last-child {
    border-radius: 0 4px 4px 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus div.form-element-container {
    width: 100%;
    margin-right: .6rem !important
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus div.form-element-container label {
    display: block;
    font-size: .7rem
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus div.form-element-container label {
        font-size:1rem
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus div.form-element-container input {
    background-color: #fff;
    color: #000;
    text-align: center;
    font-size: 1.2rem;
    width: 100%
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus div:first-child {
    text-align: left;
    margin: .6rem 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .bonus div span {
    display: block;
    font-size: 14px;
    line-height: 1rem;
    color: #fff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .countdown {
    background: #303644;
    border-radius: .5rem;
    padding: 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .countdown .countdown-timer_time {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    gap: 0
}

@media screen and (max-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .countdown .countdown-timer_time {
        width:30px;
        height: 30px
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .countdown .countdown-timer_time .digit {
    font-size: .675rem
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .countdown .countdown-timer_time .digit {
        font-size:.675rem
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .countdown .countdown-timer_time .unit {
    font-size: .475rem
}

@media screen and (min-width: 560px) {
    div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content .vip-perks .perk .content .countdown .countdown-timer_time .unit {
        font-size:.675rem
    }
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .vip-tab-content p.warn {
    color: #fff
}

div.serce-modal i.ti {
    pointer-events: none;
    stroke-width: 0;
    stroke: currentColor;
    fill: currentColor;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: block;
    color: #b1bad3;
    background: center no-repeat no-repeat
}

div.serce-modal i.ti-none {
    background-image: url(../../common/img/tiers/tier-0-none.svg)
}

div.serce-modal i.ti-bronze {
    background-image: url(../../common/img/tiers/tier-1-bronze.svg)
}

div.serce-modal i.ti-silver {
    background-image: url(../../common/img/tiers/tier-2-silver.svg)
}

div.serce-modal i.ti-gold {
    background-image: url(../../common/img/tiers/tier-3-gold.svg)
}

div.serce-modal i.ti-platinum {
    background-image: url(../../common/img/tiers/tier-4-platinum.svg)
}

div.serce-modal i.ti-diamond {
    background-image: url(../../common/img/tiers/tier-5-diamond.svg)
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background-color: #303643
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0rem 0 .5rem 0
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier {
    padding: 7px 10px;
    border-radius: 5px;
    font-weight: bold;
    text-transform: uppercase
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier.ti-none {
    background: #b1bad3;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier.ti-bronze {
    background: #c59c6c;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier.ti-silver {
    background: #b7cbcc;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier.ti-gold {
    background: #f7d347;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier.ti-platinum {
    background: #e5e4e2;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_header .tier.ti-diamond {
    background: #bde9ff;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: .5rem
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer .tier-label--sm {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer .tier-label--sm.ti-none {
    color: #b1bad3
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer .tier-label--sm.ti-bronze {
    color: #c59c6c
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer .tier-label--sm.ti-silver {
    color: #b7cbcc
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer .tier-label--sm.ti-gold {
    color: #f7d347
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer .tier-label--sm.ti-platinum {
    color: #e5e4e2
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .tab-page .progress-card_footer .tier-label--sm.ti-diamond {
    color: #bde9ff
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .benefits-tab-content .accordion-item_label .tier-badge {
    padding: 7px 10px;
    border-radius: 5px;
    font-weight: bold;
    text-transform: uppercase
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .benefits-tab-content .accordion-item_label .tier-badge.ti-none {
    background: #b1bad3;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .benefits-tab-content .accordion-item_label .tier-badge.ti-bronze {
    background: #c59c6c;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .benefits-tab-content .accordion-item_label .tier-badge.ti-silver {
    background: #b7cbcc;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .benefits-tab-content .accordion-item_label .tier-badge.ti-gold {
    background: #f7d347;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .benefits-tab-content .accordion-item_label .tier-badge.ti-platinum {
    background: #e5e4e2;
    color: #0e212e
}

div.serce-modal .modal-dialog content>div.serce-vip-tabs>div.tab-content .benefits-tab-content .accordion-item_label .tier-badge.ti-diamond {
    background: #bde9ff;
    color: #0e212e
}
