.footer,body,html{
    display:flex;
    width:100%
}
*{
    touch-action:manipulation
}
.toast-error,.toast-info,.toast-success,.toast-warning{
    background-image:none
}
.toast-bottom-full-width{
    bottom:68px
}
.footer,.footer .center .nav-link{
    bottom:0
}
body,html{
    height:100%;
    overflow:hidden;
    background:#000;
    font-family:Roboto,sans-serif;
    z-index:0
}
.header{
    height:60px;
    border-top:0;
    border-bottom:0;
    border-width:1px;
    border-style:solid;
    border-image:linear-gradient(to left,#fff 1%,#5a5a5b 50%,#fff 100%) 100% 0 100% 0/0 0 1px 0 stretch;
    background:#000;
    background:-webkit-linear-gradient(to bottom,#3c3c5e,#1b1a3f);
    background:linear-gradient(to bottom,#3c3c5e,#1b1a3f);
    color:#fff;
    -webkit-box-shadow:7px 7px 50px 7px rgba(0,0,0,.75);
    -moz-box-shadow:7px 7px 50px 7px rgba(0,0,0,.75);
    box-shadow:7px 7px 50px 7px rgba(0,0,0,.75)
}
.header .dropdown-menu-dark{
    padding:8px
}
.header .dropdown-menu-dark .dropdown-item{
    padding:.2rem .25rem
}
.header .dropdown .icon{
    margin-right:8px
}
.header .nav-link{
    font-size:24px;
    min-width:44px
}

#sidebar,.footer .center .nav-link,.header .container-fluid,.offline{
    position:absolute
}
.footer .block{
    height:100%;
    width:20%
}
.footer .block:first-child{
    border-left:none
}
.footer .block:last-child{
    border-right:none
}
.footer .nav-link{
    cursor:pointer;
    font-size:24px;
    text-align:center;
    padding:0;
    margin:0
}
.footer .nav-link .icon{
    height:100%;
    width:100%;
    max-width:90px
}
.footer .title{
    display:block;
    font-size:12px
}
.default_color{
    background-color:#f3ec78;
    background-image:linear-gradient(45deg,#f3ec78,#af4261);
    background-size:100%;
    -webkit-background-clip:text;
    -moz-background-clip:text;
    -webkit-text-fill-color:transparent;
    -moz-text-fill-color:transparent
}
.wrapper{
    width:450px;
    height:100%;
    margin:auto;
    display:block;
    position:relative;
    overflow:auto
}
.bg-image-1,.bg-image-2{
    position:fixed;
    width:100%;
    max-width:450px;
    z-index:-100;
    height:100%
}
.wrapper::-webkit-scrollbar{
    display:none
}
#content{
    width:100%;
    min-height:100vh;
    color:#fff;
    -ms-overflow-style:none;
    scrollbar-width:none;
    padding-bottom:150px
}
#content::-webkit-scrollbar{
    display:none
}
#sidebar{
    display:none;
    width:255px;
    height:100%;
    top:0;
    left:0;
    z-index:9999;
    background-color:#100e31
}
#overlay,.offline{
    background:rgba(255,255,255,.7);
    transition:all .5s ease-in-out;
    max-width:450px;
    height:100%
}
#sidebar .icon{
    width:25px
}
#sidebar .text{
    margin-top:4px
}
#sidebar.active{
    display:block
}
#sidebar .sidebar_container{
    display:none
}
#sidebar.active .sidebar_container{
    display:block
}
#overlay{
    display:none;
    width:100%
}
.offline{
    width:100%;
    align-items:center;
    justify-content:center;
    z-index:15
}
.offline img{
    width:100%;
    padding-top:50%
}
.preloader{
    height:100%;
    width:100%;
    max-width:450px;
    background:rgba(0,0,0,1);
    position:fixed;
    z-index:200;
    opacity:.8;
    top:0
}
.preloader .center{
    display:flex;
    height:100%;
    width:100%;
    align-items:center;
    justify-content:center
}
.preloader img{
    width:300px
}
#overlay.active{
    display:block;
    position:fixed;
    z-index:10
}
.sidebar_container{
    padding:8px
}
#sidebar .close{
    padding:8px 16px 8px 8px;
    position:absolute;
    font-size:28px;
    right:0;
    color:#fff
}
#sidebar .title{
    padding:6px
}
#sidebar .links{
    display:flex;
    justify-content:start;
    align-items:center;
    padding-top:8px;
    padding-bottom:4px;
    color:#fff;
    text-decoration:none;
    text-transform:uppercase
}
#sidebar .links .icon{
    margin-right:12px
}
#sidebar .divider{
    display:block;
    border:1px solid;
    margin:8px -24px
}
#pages{
    display:block;
    position:fixed;
    height:100%;
    width:100%;
    max-width:450px;
    background:#000;
    z-index:100;
    overflow:auto
}
.tab-item.active{
    color:#f5c27e;
    border-bottom:3px solid
}
.tab-item{
    color:#9fafeb;
    font-weight:600;
    padding:.5rem .3rem;
    margin-left: .3rem;
    margin-right: .3rem;
    cursor:s
}
.page_container{
    min-height:100%
}
.page_container .content{
    padding:16px 10%
}
.page_container .input-group-prepend .input-group-text{
    background:0 0;
    border:0;
    height:100%
}
.page_container .form-control{
    background:0 0;
    border:0;
    padding:0;
    box-shadow:unset;
    color:#fff
}
.page_container .form-control::placeholder{
    color:#a8a8a8
}
.page_container .form-control:focus{
    box-shadow:unset
}
.page_container .input-group .icon{
    width:28px
}
.page_container .logo{
    height:100px
}
.bg-transparent{
    background-color:transparent
}
.login_button:focus{
    outline:0
}
.header_back_button img{
    width:16px
}
.header_menu_button{
    text-align:center;
    margin-top:auto;
    margin-bottom:auto
}
.page_container a.text-muted{
    color:#fff;
    text-decoration:none;
    font-size:12px
}
.invalid-feedback{
    display:block;
    color:red;
    width:225px;
    text-align:start
}
.carousel-indicators{
    margin-bottom:.5rem
}
.carousel-indicators li{
    width:5px;
    height:5px;
    border-radius:100%
}
.four_step{
    width:100%
}
.announcement .icon{
    width:14px;
    margin-top:-10px
}
.announcement .marquee{
    display:inline-block;
    overflow:hidden;
    position:relative;
    height:25px;
    width:calc(100% - 28px)
}
.announcement .text{
    word-break:break-all;
    white-space:nowrap;
    display:inline-block;
    position:absolute;
    width:100%;
    height:100%;
    margin:0;
    text-align:center;
    line-height:32px;
    -moz-animation:scroll-left 45s linear infinite;
    -webkit-animation:scroll-left 45s linear infinite;
    animation:scroll-left 45s linear infinite;
    font-size:12px
}
@-moz-keyframes scroll-left{
    0%{
        -moz-transform:translateX(100%)
    }
    100%{
        -moz-transform:translateX(-900%)
    }
}
@-webkit-keyframes scroll-left{
    0%{
        -webkit-transform:translateX(100%)
    }
    100%{
        -webkit-transform:translateX(-900%)
    }
}
@keyframes scroll-left{
    0%{
        -moz-transform:translateX(100%);
        -webkit-transform:translateX(100%);
        transform:translateX(100%)
    }
    100%{
        -moz-transform:translateX(-900%);
        -webkit-transform:translateX(-900%);
        transform:translateX(-900%)
    }
}
.category{
    display:grid;
    height:32px;
    margin-top:.5rem;
    padding:0 16px
}
.category_container::-webkit-scrollbar{
    display:none
}
.products{
    display:flex;
    padding:0 16px;
    flex-wrap:wrap
}
.products .product_list{
    flex:0 0 33.3333%;
    cursor:pointer;
    position:relative
}
.products .product_list.normal_image{
    padding:5px
}
.products .product_list img{
    width:120%;
    display:block;
    margin:0 -10%
}
.products .product_list.normal_image img{
    width:100%;
    height:100%;
    display:block;
    margin:0
}
.dropdown .dropdown-menu-dark .icon,.title img{
    width:25px
}
.dropdown .dropdown-menu-dark{
    background:#0d0c29
}
.dropdown .dropdown-menu-dark .text{
    margin-top:4px
}
.dropdown .dropdown-menu-dark .dropdown-item{
    display:flex;
    justify-content:start;
    align-items:center
}
.title{
    margin-bottom:1rem;
    padding:1rem 0;
    background:#242345;
    text-align:center;
    font-weight:900;
    display:flex;
    align-items:center;
    justify-content:center
}
.title img{
    margin-right:8px
}
.page-container{
    padding:0 16px
}
.page-container .tabs{
    display:flex;
    align-items:center!important;
    justify-content:center!important;
    padding:0 16px;
    margin-bottom:16px
}
.page-container .tabs .tab-items{
    flex:0 0 30%
}
.page-container .tabs .tab-items img{
    width:100%;
    padding:0 2px
}
.page-container .card .card-body{
    min-height:50px;
    padding:1rem 1.5rem 2rem
}
.page-container .lists{
    display:flex;
    justify-content:space-between!important;
    align-items:center
}
.page-container .lists .item{
    font-size:12px;
    width:75%
}
.page-container .lists .value{
    font-size:12px;
    width:25%
}
.page-container .ranking img{
    width:100%
}
.page-container .page-container_ranking{
    font-size:12px;
    padding:0 8px
}
.text-bold{
    font-weight:900
}
.text-light{
    font-weight:100
}
.page-container .qrcode .image_container{
    max-width:150px;
    margin:1rem auto
}
.page-container .card .d-flex{
    justify-content:center;
    align-items:center;
    font-size:12px
}
.page-container .qrcode .card-body{
    min-height:50px;
    padding:1rem 1.5rem
}
.balance,.profile{
    padding:0 16px
}
.page-container .card .icon{
    width:18px;
    margin-right:8px
}
.page-container a{
    text-decoration:none;
    color:#fff
}
.page-container .image_container img{
    width:150px
}
.avatar,.box .method_icon{
    width:50px
}
.page-container .share_my_code{
    margin-left:auto;
    margin-right:auto;
    position:relative
}
.page-container .share_my_code img{
    height:36px;
    position:absolute;
    left:50%;
    top:-10px;
    transform:translate(-50%,-50%)
}
.qr_code_container{
    margin:0 24px
}
.avatar{
    border-radius:50%;
    border:2px solid #fff;
    height:50px;
    background:#282728;
    float:left
}
.profile .info{
    display:flex;
    justify-content:start
}
.profile .description{
    margin-left:16px;
    width:100%;
    display:inline-grid
}
.profile .name{
    display:block;
    color:#fddeb7;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    margin-bottom:0
}
.profile .username{
    display:block;
    font-size:12px
}
.progress_bar{
    display:flex;
    align-items:center;
    vertical-align:middle
}
.bg-progress-bar{
    margin-left:8px;
    display:inline-flex;
    width:75%;
    height:18px
}
.bg-progress-bar::-webkit-progress-value{
    background:#069a83;
    background:linear-gradient(0deg,rgba(6,154,131,1) 0,rgba(10,102,84,1) 100%)
}
.balance{
    display:flex;
    justify-content:space-between;
    margin-top:16px
}
.balance .money .text{
    font-size:12px;
    width:100%;
    text-align:center
}
.balance .money .icon{
    width:30px;
    position:absolute;
    left:-8px
}
.balance .money .deposit{
    width:30px;
    position:absolute;
    right:-8px
}
.chips{
    display:flex;
    padding:0 16px
}
.balance .chips .text{
    font-size:12px;
    width:100%;
    text-align:center
}
.balance .chips .icon{
    width:30px;
    position:absolute;
    left:-8px
}
.logout,.modal-container,.p-relative{
    position:relative
}
.box{
    padding:16px;
    margin:16px;
    border:1px solid #fff;
    border-radius:15px;
    background:#1b1a3f
}
.box .box-amount input,.box .box-bank .form-control,.box .receipt{
    background:0 0;
    color:#fff
}
.logout img{
    width:150px;
    position:absolute;
    margin-left:auto;
    margin-right:auto;
    left:0;
    right:0;
    text-align:center;
    cursor:pointer
}
.box .box-title{
    color:#ecb977;
    text-align:center;
    margin-top:8px;
    margin-bottom:16px
}
.box .box-amount{
    display:flex;
    justify-content:center;
    align-items:center
}
.box .box-text{
    font-size:10px;
    text-align:center;
    align-items:center
}
.box .box-amount input{
    outline:0;
    font-size:26px;
    width:100%;
    text-align:center;
    overflow:hidden;
    border:1px solid #fff;
    border-radius:5px;
    margin:1.5%
}
.box .box-amount-select{
    display:flex;
    flex-wrap:wrap
}
.box .box-amount-select .select-box{
    cursor:pointer;
    flex-wrap:wrap;
    flex:0 0 25%;
    flex-grow:1;
    margin:1.5%;
    border:1px solid #fff;
    padding:5px 10px;
    border-radius:5px;
    display:grid;
    align-items:center
}
.box .box-amount-select .select-box .small{
    display:block;
    font-size:.5em
}
.box .box-amount-select .select-box .big{
    display:block;
    font-size:1.4em
}
.box .box-method{
    border:1px solid;
    text-align:center;
    padding:8px 16px;
    border-radius:5px;
    margin-bottom:16px
}
.box .deposit_button,.box .withdraw_button{
    width:100%;
    margin-top:16px;
    text-align:center
}
.box .withdraw_button img,.deposit_button img{
    width:100%;
    max-width:150px
}
.box-amount .input-group{
    align-items:center;
    justify-content:center
}
.box-amount .input-group-text{
    background:0 0;
    border:none;
    color:#fff
}
.box .box-method-selections{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    text-align:center
}
.box .bank_details{
    margin-bottom:16px
}
.box .bank_detail{
    display:block
}
.box .box-method-selection{
    cursor:pointer;
    flex:0 0 40%;
    margin-left:8px;
    margin-right:8px;
    margin-bottom:16px
}
.box .box-method-selection img{
    width:100%;
    max-width:90px
}
.box .box-method-selection span {
    margin-top:10px;
    display:block;
}
.box .withdraw_helper{
    text-align:center;
    font-size:12px
}
.box .box-bank-select{
    display:flex;
    flex-wrap:wrap
}
.box .box-bank{
    cursor:pointer;
    flex-wrap:wrap;
    flex:0 0 100%;
    flex-grow:1;
    margin:1.5%;
    border:1px solid #fff;
    padding:10px 0 15px 15px;
    border-radius:5px;
    display:grid;
    align-items:center
}
.box .box-bank .form-control{
    outline:0;
    border:0;
    border-bottom:1px solid #a8a8a8;
    border-radius:0;
    height:24px;
    box-shadow:none
}
.box .box-bank .form-control::placeholder{
    color:#a8a8a8
}
.box .d-flex .d-flex-70{
    flex:0 0 70%
}
.box .d-flex .d-flex-30{
    flex:0 0 30%
}
.box .method{
    justify-content:center;
    align-items:center;
    display:flex
}
.products .product_list .product_new{
    position:absolute;
    top:12%;
    left:3%
}
.products .product_list .product_hot{
    position:absolute;
    top:12%;
    right:3%
}
.products .product_list .product_maintain{
    position:absolute;
    top:12%;
    right:3%
}
.products .product_list .product_new img{
    width:40%;
    margin:0
}
.products .product_list .product_maintain img{
    width:40%;
    margin:0
}
.products .product_list .product_maintenance{
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%)
}
.products .product_list .product_maintenance img{
    width:40%;
    margin:0 0 0 auto;
    z-index:99999
}
.products .product_list .maintenance{
    filter:grayscale(100%)
}
.products .product_list .product_hot img{
    width:40%;
    margin:0 0 0 auto
}
.progress_bar .icon{
    margin-left:8px;
    width:16px
}
.modal-container{
    padding:16px
}
.custom-modal .close{
    position:absolute;
    right:16px;
    top:18px;
    font-size:26px
}
.custom-modal .modal-header{
    padding:8px 0;
    border:0
}
.from_icon img,.to_icon img{
    width:100%
}
.arrow{
    position:relative
}
.arrow_text{
    position:absolute;
    color:#000;
    font-size:11px;
    top:16%;
    left:38%
}
@media screen and (max-width:374px){
    .arrow_text{
        top:14%
    }
}
.arrow_img img{
    width:100%;
    padding:0 16px
}
.arrow_description{
    padding:4px 8px 0;
    font-size:10px;
    text-align:center
}
.badge_list .badge img{
    width:100%
}
.font-smaller{
    font-size:12px
}
.flex-50{
    flex:0 0 50%
}
.product_image{
    width:100%;
    max-width:200px
}
.flex-40{
    flex:0 0 40%
}
.flex-20{
    flex:0 0 20%
}
.nav-banner.logo{
    width:100%
}
.ranking_body .table-td,.ranking_header .table-thead{
    text-align:center;
    width:16.6666%
}
.ranking_info{
    margin-top:12px;
    border:1px solid #fff;
    border-radius:10px;
    font-size:10px
} 
.ranking_body .table-tr{
    align-items:center;
    margin-bottom:4px
}
.ranking_body .table-td img{
    max-width:25px
}
.feedback{
    max-width:225px;
    word-break:break-word;
    display:inline-block;
    margin-top:0;
    text-align:start
}
.agent_ranking{
    padding:0 24px
}
#tawkchat-minified-wrapper{
    display:none
}