.mobile{display:none!important}
.left-menu-btn{width:45px;height:45px;float:left;background-color:transparent;border:none;float:left;padding:0;position:relative;z-index:99}
.left-menu-btn span{display:block;width:calc(100% - 10px);height:3px;background-color:#ffc318;margin:0 auto 8px}
.left-menu-btn span:first-child{position:relative;margin-top:0;top:0;transition:top .3s .3s,transform .3s 0s}
.left-menu-btn span:nth-child(2){opacity:1;transition:opacity .3s}
.left-menu-btn span:last-child{margin-bottom:0;position:relative;top:0;transition:top .3s .3s,transform .3s 0s}
.left-menu-btn.opened span:first-child{top:11px;transform:rotate(-45deg);transition:top .3s 0s,transform .3s .3s,color .3s .3s}
.left-menu-btn.opened span:nth-child(2){opacity:0}
.left-menu-btn.opened span:last-child{top:-11px;transform:rotate(45deg);transition:top .3s 0s,transform .3s .3s}
.mobile-btn{width:44px;height:44px;font-size:22px;background-color:#3ecaa6;background-image:linear-gradient(#3ecaa6,#1e997a);border:solid 1px #3ecaa6;box-shadow:0 3px 3px #000,inset 0 0 0 1px #696261;border-radius:8px;margin:19px 0 0 5px;position:relative;display:flex;align-items:center;justify-content:center;float:left;overflow:hidden;z-index:1}
.mobile-btn.logout-btn{background-color:#ff812d;background-image:linear-gradient(#ff812d,#e25124);border-color:#ff812d}
.right-menu-btn .normal-icon{transition:.3s;opacity:1;transform:scale(1)}
.right-menu-btn.opened .normal-icon{opacity:0;transform:scale(0)}
.right-menu-btn .open-icon{transition:.3s;opacity:0;transform:scale(1.5);position:absolute;left:0;right:0;margin:0 auto}
.right-menu-btn.opened .open-icon{opacity:1;transform:scale(1)}
.sn-overlay{width:100%;height:100%;position:fixed;z-index:96;background-color:rgba(0,0,0,.5);top:80px;left:0;pointer-events:none;opacity:0;transition:.3s}
.sn-overlay.active{opacity:1;pointer-events:auto}
@media(max-width:1380px){.cool-logo{width:280px;top:-18px;left:-60px}
.main-menu{margin:0 0 0 170px}
.main-menu li{padding:0 5px}
}
@media(max-width:1260px){.mobile{display:block!important}
.desktop{display:none!important}
.header-section{height:80px}
.header-section .container{padding:0 10px}
.cool-logo{width:140px;left:0;right:0;top:-10px;margin:0 auto;z-index:99}
.before-login{margin:0}
.before-login button{width:44px;border-width:1px;margin:0 0 0 5px;float:left}
.before-login button:before,.before-login button:after{display:none}
.before-login button i{margin:0;font-size:22px}
.sidebar-left{width:280px;height:100%;top:80px;left:-100%;background-color:#161616;border-right:solid 1px #252525;margin:0!important;padding:7px 5px 64px;display:block;overflow-y:auto;position:fixed;transition:.5s;z-index:98}
.sidebar-left.active{left:0}
.sidebar-left::-webkit-scrollbar{width:0;background:0 0}
.sidebar-left::-webkit-scrollbar-thumb{background:0 0}
.main-menu li{width:100%;height:auto;display:block;padding:0}
.main-menu li a{width:100%;height:45px;display:flex;align-items:center;justify-content:flex-start;padding:0 15px;color:#fff;text-shadow:none;border:solid 1px #3e3e3e;margin:3px 0}
.sidebar-right{width:280px;height:100%;top:80px;right:-100%;background-color:#161616;border-left:solid 1px #252525;margin:0!important;padding:0 0 64px;display:block;overflow-y:auto;position:fixed;transition:.5s;z-index:98}
.sidebar-right.active{right:0}
.sidebar-right::-webkit-scrollbar{width:0;background:0 0}
.sidebar-right::-webkit-scrollbar-thumb{background:0 0}
.sidebar-right .al-inner{flex-wrap:wrap}
.sidebar-right .al-cont{width:100%!important;height:50px;margin:0;padding:5px 10px;background-color:#1f1f1f;border-top:solid 1px #2f2f2f;border-bottom:solid 1px #040404}
.sidebar-right .al-cont .labels{width:36px;height:36px;border-radius:3px}
.sidebar-right .al-cont .info{width:calc(100% - 45px)}
.sidebar-right .btn-group{padding:0 5px;margin:10px 0 0;background-color:transparent;border:none}
.sidebar-right .btn-group a{width:calc(50% - 1px);height:40px;font-size:12px;margin:0 3px}
.progressbar-panel{width:auto;height:auto;overflow:hidden;position:relative;border:0;box-shadow:none;border-radius:0;background-image:none}
.banner-panel{height:auto;padding:25px 0}
.banner-carousel{width:100%;margin:0}
.banner-carousel .text-container{text-align:center;padding:0 0 20px}
.banner-carousel .carousel-indicators{justify-content:center}
.banner-background .casino-girl{width:192px}
.banner-background .goldrush{width:170px;left:auto;right:0}
.mobile .moal-inner{float:left;flex-wrap:wrap;align-items:center;justify-content:flex-start;position:relative}
.mobile .moal-cont{height:24px;display:flex;align-items:center;justify-content:flex-start;position:relative;margin:2px;padding:0 5px;color:#fff;text-decoration:none}
.mobile .moal-cont .labels{width:28px;height:25px;position:relative;z-index:1;color:#ff652b;font-size:10px;margin-right:3px;display:flex;align-items:center;justify-content:center;border-radius:3px;border:solid 1px rgba(255,255,255,.2);background-color:rgba(0,0,0,.15);box-shadow:0 1px 2px rgba(0,0,0,.5),inset 0 0 18px rgba(0,0,0,.75);transition:.3s;overflow:hidden}
.mobile .moal-cont .labels:before{content:'';width:140%;height:70%;position:absolute;left:0;top:0;background-color:rgba(251,251,251,.1);transform-origin:bottom left;transform:rotate(-30deg)}
.mobile .moal-cont:hover .labels{color:#fff156}
.mobile .moal-cont .info{width:calc(100% - 20px);height:100%;float:left;position:relative;display:flex;align-items:center;justify-content:flex-start;padding:0 5px;color:#fff;font-size:10px;white-space:nowrap;text-shadow:0 1px 1px #000;transition:.3s}
.mobile .moal-cont:hover .info{color:#b781ff}
.mobile .moal-cont .info .symbol{color:#ffb23f;margin-left:5px}
}
@media(max-width:1140px){.board-table{width:100%;max-width:600px;margin:10px auto}
.board-table:nth-child(1){order:2}
.board-table:nth-child(2){order:1;margin:0 auto 10px}
.board-table:nth-child(3){order:3}
.board-table table{max-width:96%}
}
@media(max-width:1080px){.jackpot-panel .icon-panel{width:10.97%}
.jackpot-panel .jackpot-text{width:28.85%}
.jackpot-panel .amount span{font-size:6.5vw}
.jackpot-panel .amount .text-sm{font-size:5.6vw}
.jackpot-panel .amount .currency{font-size:4.3vw}
}
@media(max-width:1000px){.customer-section .customer-panel{height:auto;border-radius:10px;padding:15px 10px}
.customer-panel .labels{width:100%;display:inline-block;margin:0 0 15px}
.customer-panel .bs-ul{width:100%}
.customer-panel .bs-ul li{padding:0}
}
@media(max-width:920px){.banner-background .casino-girl{width:21.72%}
.banner-background .goldrush{width:20.25%}
}
@media(max-width:600px){.container{padding:0 5px}
.banner-panel{padding:15px 0}
.banner-carousel .text-container{padding:0 0 10px}
.banner-carousel .text-container h1{font-size:7vw}
.banner-carousel .text-container h2{font-size:5vw}
.banner-carousel .text-container h6{font-size:3vw}
.banner-carousel .carousel-indicators li{width:10px;height:10px}
.banner-carousel .carousel-indicators li.active{width:12px;height:12px}
.jackpot-panel{height:auto}
.jackpot-panel:before{left:0}
.jackpot-panel:after{right:0}
.slot-container{padding:12px 10px}
.slot-container{justify-content:flex-start}
.company-btn{width:calc(33.33% - 14px)}
.banner-board .recommended-games{width:100%;border-radius:10px;margin:5px 0;padding:10px 12px}
.banner-board .recommended-games .header:before{max-width:100%}
.banner-board .recommended-games .bs-ul{width:100%}
.banner-board .big-win{width:100%;margin:0;border-radius:10px;padding:10px}
.banner-board .big-win .header{max-width:100%}
.banner-board .big-win .bs-ul{width:100%}
.company-btn.preparing{display:none}
}
@media(max-width:500px){.jackpot-panel .inner-panel{flex-wrap:wrap}
.jackpot-panel .icon-panel{width:16%}
.jackpot-panel .jackpot-text{width:48%}
.jackpot-panel .amount{width:100%;margin:-3% 0 0}
.jackpot-panel .amount span{font-size:10vw}
.jackpot-panel .amount .text-sm{font-size:9.1vw}
.jackpot-panel .amount .currency{font-size:7.8vw;top:0}
.company-btn{width:calc(50% - 14px)}
.customer-panel .bs-ul li .icon-img{margin-right:0}
.customer-panel .bs-ul li .account{width:100%;display:inline-block;text-align:center;margin:5px 0 0}
.board-table table td{max-width:180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media(max-width:1160px){.modal-header{flex-wrap:wrap}
.modal-header .cool-logo{width:140px;margin:0 auto}
.modal-header .btn-group{width:100%;position:relative;right:0;top:0;justify-content:center}
.modal-header .btn-group button:nth-last-child(2):before{display:none}
.modal-header .btn-group .modal-close-btn{width:40px;margin:0;position:absolute;right:0;top:-80px}
.game-btn{width:calc(20% - 16px)}
}
@media(max-width:1024px){.level-information .container{width:25%}
.level-information .container:first-child{width:20%}
.level-information .container span{font-size:12px}
.level-information .container .labels{margin-right:0}
.level-information .container .amount{font-size:14px}
.level-information .point-form{width:55%;padding:0 5px}
.level-information .point-form input{width:58%;border-radius:5px 0 0 5px}
.level-information .points-btn{width:40%;position:relative;right:0;font-size:8px;border-radius:0 5px 5px 0}
.level-information .points-btn:hover{background-color:#86e8df}
}
@media(max-width:1000px){.modal-banner .panel{width:100%}
.modal-menu{min-width:100%}
.modal-menu button{width:100%;margin:0}
}
@media(max-width:920px){.game-btn{width:calc(25% - 16px)}
}
@media(max-width:767px){
.modal-dialog{box-shadow:inset 0 -30px 250px 100px #0e0e0e}
.modal-menu{padding:10px 0;flex-wrap:wrap}
.modal-menu button{width:33.33%;margin:4px 0}
.modal-menu button span{display:inline-block;min-width:75px;text-align:left}
.gamelist-container{overflow-y:auto;max-height:initial;padding:0}
.game-btn{width:calc(33.33% - 16px)}
.transferModal .bs-table td:nth-child(odd){padding:0 5px}
.transferModal .bs-table td:nth-child(even){padding:0 5px}
.message-content{overflow:hidden}
.message-content img{width:100%;height:auto}
.popup{width:90%}
}
@media(max-width:500px){.transferModal .bs-table td{font-size:10px}
.modal-dialog{box-shadow:inset 0 0 200px 50px #0e0e0e}
.modal-header .btn-group{display:flex}
.modal-header .btn-group button{width:100%;font-size:12px;padding:0}
.modal-banner .title-panel .title{font-size:30px}
.modal-menu button{font-size:10px}
.modal-menu button .icon-panel{margin-right:5px}
.modal-menu button span{min-width:58px}
.bs-table thead th{font-size:12px}
.bs-table tr .count-td{width:initial}
.bs-table tr .title-td{max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bs-table tr .title-td img{max-width:100%;height:auto}
.bs-table tr .date-td{width:initial;font-size:10px;max-width:80px}
.bs-table tr .nav-td{width:30px}
.bs-table td .level-txt{width:100%;text-align:center}
.gamelistModal .modal-body{padding:0 5px 50px}
.gamelistModal .modal-panel{background-color:transparent;border:none;border-radius:0;padding:0}
.game-btn{width:calc(33.33% - 8px);margin:7px 4px}
.game-btn .play-btn{max-width:70px;font-size:8px;top:2px;left:2px}
.game-btn .play-btn.practice{top:32px}
.game-btn .play-btn .icon-panel{width:16px;min-width:16px;height:16px}
.game-btn .footer{height:30px;font-size:10px;padding:0 3px}
.search-form{width:100%}
.cool-logo{}
}
