@charset "UTF-8";

/**
Copyright 2022
**/

.color-55vp,
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #FF6500 !important;
}

.bg-55vp {
    background-color: #FF6500 !important;
}

.color-55vp2 {
    color: #FFCC00 !important;
}

.bg-55vp2 {
    background-color: #FFCC00 !important;
}

.color-55vp3 {
    color: #161616 !important;
}

.bg-55vp3 {
    background-color: #161616 !important;
}

.color-55vp4 {
    color: #515151 !important;
}

.bg-55vp4 {
    background-color: #515151 !important;
}

.btn-55vp, .btn-check:checked+.btn, .nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: #FFF !important;
    border: 1px solid #ffd900 !important;
    background: #fae992; /* Old browsers */
    background: -moz-linear-gradient(top,  #fae992 0%, #ad7715 27%, #855b0c 78%, #d1903f 100%);
    background: -webkit-linear-gradient(top,  #fae992 0%,#ad7715 27%,#855b0c 78%,#d1903f 100%);
    background: linear-gradient(to bottom,  #fae992 0%,#ad7715 27%,#855b0c 78%,#d1903f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fae992', endColorstr='#d1903f',GradientType=0 );
}

.btn-outline-55vp, .btn-check+.btn:hover {
    background-color: #FFF;
    color: #FE7620;
    border-color: #FFF;
}

header, .offcanvas {
    background-color: #161616;
}

/* .nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: #161616 !important;
    background-color: #FF6500 !important;
} */

.nav-pills .nav-link {
    color: #fccd4d !important;
}

.dropdown-menu {
    background-color: #111;
}

.dropdown-menu a {
    color: #a2aabd;
}

.form-mini {
    width: 50%;
    margin: 0 auto;
    padding: 3% 0;
}

.active>.page-link, .page-link.active {
    z-index: 3;
    color: #FFF;
    background-color: #FF6500;
    border-color: #FF6500;
}

.page-link {
    color: #FF6500;
}

.page-link:hover {
    color: #161616;
}

/*
Common
*/

.sideNav-profile > li {
    margin-bottom: .5rem;
}

.sideNav-profile > li > a {
    color: #000;
    font-weight: 300;
}

.sideNav-profile > li > a:hover, .sideNav-profile > li > a.active {
    color: #FF6500;
}

/*
Main Nav
*/

.header-login {
    /*color: #121212 !important;*/
    font-weight: 600;
    /*background-color: #FFCC00;*/
    /*border: 1px solid #FFCC00;*/
    text-transform: uppercase;
    padding: .3rem .5rem;
    font-size: .8rem;
    color: #FFF !important;
    border: 1px solid #ffd900 !important;
    background: #fae992; /* Old browsers */
    background: -moz-linear-gradient(top,  #fae992 0%, #ad7715 27%, #855b0c 78%, #d1903f 100%);
    background: -webkit-linear-gradient(top,  #fae992 0%,#ad7715 27%,#855b0c 78%,#d1903f 100%);
    background: linear-gradient(to bottom,  #fae992 0%,#ad7715 27%,#855b0c 78%,#d1903f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fae992', endColorstr='#d1903f',GradientType=0 );
}

#mainNav > li {
    margin-right: .28rem;
    margin: 0 1rem;
}

#mainNav > li > a {
    color: #a2aabd;
    height: 100%;
    white-space: nowrap;
    padding-top: .2rem;
    position: relative;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    padding: 2rem 0;
}

#mainNav > li > a:hover, #mainNav > li > a:active, #mainNav > li > a:focus, #mainNav > li > a:focus:active {
    color: #fccd4d;
}

#mainNav > li > a:hover::after {
    content: "";
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    height: .15rem;
    background: #fccd4d;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}

#mainNav > li > a:hover {
    color: #fccd4d;
}

.second-header {
    background-color: #252525;
    box-shadow: 0 0 3px rgba(0,0,0,1);
}

.second-header .btn-join {
    /*color: #121212 !important;*/
    font-weight: 600;
    /*background-color: #FFCC00;*/
    /*border: 1px solid #FFCC00;*/
    text-transform: uppercase;
    /* padding: .5rem .8rem; */
    color: #FFF !important;
    border: 1px solid #575757 !important;
    background: #212121;
    background: -moz-linear-gradient(top,  #212121 0%, #474747 49%, #212121 51%, #2e2e2e 100%); 
    background: -webkit-linear-gradient(top,  #212121 0%,#474747 49%,#212121 51%,#2e2e2e 100%); 
    background: linear-gradient(to bottom,  #212121 0%,#474747 49%,#212121 51%,#2e2e2e 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#212121', endColorstr='#2e2e2e',GradientType=0 ); 
}

.second-header .btn-login, header .btn-login {
    /*color: #121212 !important;*/
    font-weight: 600;
    /*background-color: #FF6500;*/
    /*border: 1px solid #FF6500;*/
    text-transform: uppercase;
    /* padding: .5rem 1rem; */
    /* border-right: 1px solid #252525; */
    color: #FFF !important;
    border: 1px solid #ffd900 !important;
    background: #fae992; /* Old browsers */
    background: -moz-linear-gradient(top,  #fae992 0%, #ad7715 27%, #855b0c 78%, #d1903f 100%);
    background: -webkit-linear-gradient(top,  #fae992 0%,#ad7715 27%,#855b0c 78%,#d1903f 100%);
    background: linear-gradient(to bottom,  #fae992 0%,#ad7715 27%,#855b0c 78%,#d1903f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fae992', endColorstr='#d1903f',GradientType=0 );
}

.second-header .btn-logout {
    font-weight: 600;
    /*background-color: transparent;*/
    /*border: 1px solid #FFF;*/
    padding: .5rem .8rem;
    text-transform: uppercase;
    color: #FFF !important;
    border: 1px solid #575757 !important;
    background: #212121;
    background: -moz-linear-gradient(top,  #212121 0%, #474747 49%, #212121 51%, #2e2e2e 100%); 
    background: -webkit-linear-gradient(top,  #212121 0%,#474747 49%,#212121 51%,#2e2e2e 100%); 
    background: linear-gradient(to bottom,  #212121 0%,#474747 49%,#212121 51%,#2e2e2e 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#212121', endColorstr='#2e2e2e',GradientType=0 ); 
}

/*.second-header .right > li {
    border-right: 1px solid #121212;
}*/

.second-header .right > li > a, .second-header .right > li > .dropdown {
    color: #a2aabd;
    padding: 0 1rem;
    margin: .5rem 0;
    text-decoration: none;
}

.second-header .right > li > a.btn-join, .second-header .right > li > a.btn-login, .second-header .right > li > a.btn-logout {
    margin: 0;
    padding: .5rem .8rem;
}

.second-header .left #clock {
    color: #a2aabd;
    font-size: .8rem;
    display: inline-block;
    border-right: 1px solid #121212;
    width: 185px;
}

#mainNavCanvas a {
    color: #a2aabd;
    text-transform: uppercase;
    padding: .5rem 1rem;
    border-bottom: 1px solid rgba(255,255,255,.13);
}

.mobile-footer {
    background-color: #252628;
    padding: .5rem 0;
}

.mobile-footer ul > li > div > a,
.mobile-footer ul > li > a {
    font-size: .6rem;
    text-decoration: none;
    text-align: center;
    display: block;
}

.mobile-footer ul > li > div > a i,
.mobile-footer ul > li > a i {
    display: block;
    width: 35px;
    height: 35px;
    margin: auto;
    background: url('../../assets/img/icons/home.png') no-repeat center center;
    background-size: contain;
    filter: grayscale(1);
    -webkit-filter: grayscale(100%);
}

.mobile-footer ul > li > a[data-page="promo"] i {
    background: url('../../assets/img/icons/promotion.png') no-repeat center center;
    background-size: contain;
}

.mobile-footer ul > li > a[data-page="account"] i {
    background: url('../../assets/img/icons/user.png') no-repeat center center;
    background-size: contain;
}

/*.mobile-footer ul > li > a[data-page="support"] i {
    background: url('../../assets/img/icons/livechat.png') no-repeat center center;
    background-size: contain;
}*/

.mobile-footer ul > li > div > a[data-page="support"] i {
    background: url('../../assets/img/icons/livechat.png') no-repeat center center;
    background-size: contain;
}

.mobile-footer ul > li > a[data-page="deposit"] i {
    filter: grayscale(0);
    -webkit-filter: grayscale(0);
    background: url('../../assets/img/en/btn_deposit.gif') no-repeat center center;
    background-size: 100%;
    width: 60px;
    height: 60px;
    margin-top: -40px;
}

.mobile-footer ul > li > a[data-page="deposit"] i.my {
    filter: grayscale(0);
    -webkit-filter: grayscale(0);
    background: url('../../assets/img/my/btn_deposit.gif') no-repeat center center;
    background-size: 100%;
}

.mobile-footer ul > li > a[data-page="deposit"] i.cn {
    filter: grayscale(0);
    -webkit-filter: grayscale(0);
    background: url('../../assets/img/cn/btn_deposit.gif') no-repeat center center;
    background-size: 100%;
}

.mobile-footer ul > li > a.active {
    color: #FFCC00;
}

.mobile-footer ul > li > a.active i {
    filter: grayscale(0);
    -webkit-filter: grayscale(0);
}

.mobile-footer ul > li .dropup .dropdown-item {
    font-size: 1rem;
}

/*
Home
*/

.stepInfo::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: url('../../assets/img/instruction/step.png') no-repeat top center;
    background-size: 100%;
}

.stepInfo img {
    width: 4rem;
    height: auto;
    display: inline-block;
}

.stepInfo p {
    font-size: 1.3rem;
    font-weight: 400;
    letter-spacing: .05rem;
}

/*
Footer
*/

.homeContact {
    background-color: #00204D;
}

.homeContact a {
    font-size: 1.3rem;
    color: #a2aabd;
    text-decoration: none;
}

.homeContact .contact img {
    width: 2.3rem;
    height: 2.3rem;
    display: inline-block;
}

.footer-link a {
    color: rgba(162,170,189,.4);
    text-decoration: none;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
}

.footer-link a:hover {
    color: #a2aabd;
}

.footer-link-header {
    color: #fccd4d;
}