@charset "utf-8";
#panel ul {padding:20px;}
#panel ul li {display:block;}
#panel ul li a {display:block;position:relative;padding:0 20px;font-size:13px;line-height:34px;}
#panel ul li a .icon {display:inline-block;width:30px;color:#fff;font-size:14px;}
#panel ul li a .icon i {}
#panel ul li a .flag {display:inline-block;width:30px;}
#panel ul li a .flag img {width:20px;height:auto;}
#panel ul li a .arrow {display:block;position:absolute;right:0;top:0;line-height:34px;color:#999;font-size:10px;}
#panel ul li ul {display:none;padding:0 20px;}
#panel ul li ul li a {line-height:24px;}
#panel ul li a.active {color:var(--color);}
#panel ul li a.active .icon i {color:var(--color3);}
#panel ul li a.active:before {content:'';display:block;position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gradient180);}

#panel .btn_close_panel {display:block;position:absolute;right:0px;top:26px;width:40px;height:40px;color:#fff;background:none;border:none;}
#panel .btn_close_panel i {font-size:16px;}

.profile_side {padding:20px;}
.profile_side .profile_img {display:inline-block;position:relative;width:50px;height:50px;margin:0 auto;line-height:50px;text-align:center;background:var(--gradient135);border-radius:50%;z-index:2;}
.profile_side .profile_img:before {content:'';display:block;position:absolute;left:2px;top:2px;right:2px;bottom:2px;background:#222;border-radius:50%;overflow:hidden;z-index:-1;box-shadow:0 0 10px rgba(174,84,220,1);}
.profile_side .profile_img  img {width:100%;height:auto;}
.profile_side strong {display:inline-block;font-weight:400;}



.dashboard{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;margin:0 0 40px 0;}
.dashboard::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="circuit" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse"><path d="M 0 10 L 20 10 M 10 0 L 10 20" stroke="%23ffffff" stroke-width="0.1" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23circuit)"/></svg>') repeat;pointer-events:none}
.dashboard .header {margin:0 0 40px 0;text-align:center;z-index:3}
.dashboard .title {font-size:30px;font-weight:600;margin:0 0 10px 0;text-shadow:0 0 20px rgba(138,43,226,.8)}
.dashboard .subtitle {color:#debffb;font-size:18px;font-weight:300}

.dashboard .gauge-container {position:relative;z-index:1;margin:0 0 40px 0;}
.dashboard .gauge-container  label {display:block;position:absolute;left:0;right:0;top:100px;color:#b77fd9;font-family:'DS-Digital';font-size:18px;text-align:center;}
.dashboard .gauge-container::before {content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url(../img/gauge2.png) no-repeat 50% 50%;background-size:100% auto;z-index:1;border-radius:50%;animation:rotate_rev 3s linear infinite}

.dashboard .gauge-wrapper {position:relative;width:300px;height:300px;line-height:0;text-align:center;background:url(../img/gauge.png) no-repeat 50% 50% #000/*radial-gradient(circle,rgba(75,0,130,.3),rgba(25,0,50,.8))*/;background-size:98% auto;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 0 50px rgba(138,43,226,.5),inset 0 0 50px rgba(75,0,130,.3)}
.dashboard .gauge-wrapper::before {content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(45deg,#ff006e,#8338ec,#3a86ff,#06ffa5);border-radius:50%;z-index:-1;animation:rotate 3s linear infinite}

@keyframes rotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
@keyframes rotate_rev{0%{transform:rotate(0deg)}100%{transform:rotate(-360deg)}}

.dashboard .gauge {position:relative;}
.dashboard .stats {display:flex;justify-content:center;z-index:10}
.dashboard .stat-item {text-align:center;/*padding:20px 30px;background:rgba(138,43,226,.1);border-radius:15px;border:1px solid rgba(138,43,226,.3);backdrop-filter:blur(10px)*/}
.dashboard .stat-label {font-size:16px;color:#fff;margin-bottom:10px}
.dashboard .stat-value {margin:0 0 10px 0;font-size:24px;font-weight:700;color:#fff;/*text-shadow:0 0 6px rgba(164,68,251,0.6);*/}
.dashboard .stat-usd {color:#ccc;font-size:14px;font-weight:400;}

.dashboard .bitcoin-icon {display:inline-block;}
.dashboard .bitcoin-icon i {color:#fff;font-size:22px;/*background:linear-gradient(45deg,#f7931e,#ffb347);*/vertical-align:baseline;
background: #F7931E;
background: linear-gradient(to top right, #F7931E 0%, #FFB347 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.dashboard .floating-particles {position:absolute;width:100%;height:100%;overflow:hidden;pointer-events:none}
.dashboard .particle {position:absolute;width:2px;height:2px;background:rgba(138,43,226,.6);border-radius:50%;animation:float 6s infinite linear}

@keyframes float {0%{transform:translateY(100vh) rotate(0deg);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(-10px) rotate(360deg);opacity:0}}



#panel_mining {width:100%;max-width:960px;margin:0 auto;padding:80px 0px;overflow:hidden;}

ul.mcar_panel1 {margin:0 0 10px 0;background:rgba(33,40,50,0.8);border-radius:10px;}
ul.mcar_panel1:after {display:block;visibility:hidden;clear:both;content:""}
ul.mcar_panel1 li {display:block;float:left;width:25%;padding:10px 10px;border-right:solid 1px rgba(255,255,255,0.1);}
ul.mcar_panel1 li:last-child {border-right:none;}
ul.mcar_panel1 li .card {min-height:140px;padding:20px;}
ul.mcar_panel1 li label {display:block;margin:0 0 10px 0;font-size:14px;font-weight:600;}
ul.mcar_panel1 li label .sub {color:#bbb;font-size:13px;}
ul.mcar_panel1 li label a.tooltip {display:inline-block;position:relative;}
ul.mcar_panel1 li label i {color:#bbb;font-size:14px;}
ul.mcar_panel1 li .count {position:relative;margin:0 0 20px 0;color:#bbb;font-size:16px;font-weight:500;}
ul.mcar_panel1 li .count:after {display:block;visibility:hidden;clear:both;content:""}
ul.mcar_panel1 li .count i {color:#fa9214;font-size:20px;}
ul.mcar_panel1 li .count i.fa-tachometer-alt {color:#3489e8}
ul.mcar_panel1 li i.fa-bolt {color:#3489e8}
ul.mcar_panel1 li .count strong {color:#fff;font-size:20px;font-weight:600;}
ul.mcar_panel1 li .count .chk {display:block;position:absolute;right:0;top:5px;}
ul.mcar_panel1 li .slidebar_area {position:relative;width:100%;}
ul.mcar_panel1 li:first-child .slidebar_area {position:relative;padding:0 50px;}
ul.mcar_panel1 li .slidebar_area:after {display:block;visibility:hidden;clear:both;content:""}
ul.mcar_panel1 li .slidebar_area .label {display:block;position:absolute;left:0;top:0px;width:40px;color:#bbb;font-size:10px;line-height:20px;text-align:center;border:solid 1px #bbb;border-radius:20px;}
ul.mcar_panel1 li .slidebar_area .label.label_max {left:auto;right:0;}


.slidebar_area input {width:100%;height:5px;background:#444;border-radius:2px;}
.slidebar_area .rangeslider__handle {background:#ae54dc !important}


ul.mcar_panel2 {margin:0 0 10px 0;background:rgba(33,40,50,0.9);border-radius:10px;}
ul.mcar_panel2:after {display:block;visibility:hidden;clear:both;content:""}
ul.mcar_panel2 li {display:block;float:left;width:33.33%;padding:10px 10px;border-right:solid 1px rgba(255,255,255,0.1);}
ul.mcar_panel2 li:last-child {border-right:none;}
ul.mcar_panel2 li .card {padding:20px;}
ul.mcar_panel2 li label {display:block;margin:0 0 10px 0;font-size:14px;font-weight:600;}
ul.mcar_panel2 li label .icon {display:inline-block;width:24px;height:24px;text-align:center;line-height:24px;border-radius:50%;}
ul.mcar_panel2 li label i {color:#fff;font-size:14px;}
ul.mcar_panel2 li label .icon.bg1 {background:#7649ad;box-shadow:0 0 15px #7649ad;}
ul.mcar_panel2 li label .icon.bg2 {background:#3cb878;box-shadow:0 0 15px #3cb878;}
ul.mcar_panel2 li label .icon.bg3 {background:#e87a45;box-shadow:0 0 15px #e87a45;}
ul.mcar_panel2 li strong {display:block;margin:0 0 10px 0;color:#fff;font-size:20px;font-weight:500;}
ul.mcar_panel2 li p {color:#bbb;font-size:13px;}


ul.mcar_panel3 {margin:0 0 10px 0;background:rgba(33,40,50,0.8);border-radius:10px;}
ul.mcar_panel3:after {display:block;visibility:hidden;clear:both;content:""}
ul.mcar_panel3 li {display:block;float:left;width:25%;padding:10px 10px;border-right:solid 1px rgba(255,255,255,0.1);}
ul.mcar_panel3 li:last-child {border-right:none;}
ul.mcar_panel3 li .card {padding:20px;}
ul.mcar_panel3 li label {display:block;margin:0 0 10px 0;font-size:14px;font-weight:400;}
ul.mcar_panel3 li:nth-child(1) {color:#7649ad}
ul.mcar_panel3 li:nth-child(2) {color:#3cb878}
ul.mcar_panel3 li:nth-child(3) {color:#e87a45}
ul.mcar_panel3 li:nth-child(4) {color:#999}
ul.mcar_panel3 li .icon {display:inline-block;width:24px;height:24px;margin:0 4px 0 0;text-align:center;line-height:24px;border-radius:50%;}
ul.mcar_panel3 li i {color:#fff;font-size:14px;}
ul.mcar_panel3 li .icon.bg1 {background:#7649ad;box-shadow:0 0 15px #7649ad;}
ul.mcar_panel3 li .icon.bg2 {background:#3cb878;box-shadow:0 0 15px #3cb878;}
ul.mcar_panel3 li .icon.bg3 {background:#e87a45;box-shadow:0 0 15px #e87a45;}
ul.mcar_panel3 li .icon.bg4 {background:#999;box-shadow:0 0 15px #999;}
ul.mcar_panel3 li strong {color:#fff;font-size:16px;font-weight:400;}





@media screen and (max-width:1370px) {
ul.mcar_panel1 {margin:0 20px 10px 20px;}
ul.mcar_panel2 {margin:0 20px 10px 20px;}
ul.mcar_panel3 {margin:0 20px 10px 20px;}
}




@media screen and (max-width:960px) {
#panel_mining {padding:60px 20px}

ul.mcar_panel1 li {width:50%;}
ul.mcar_panel1 li:nth-child(2n) {border-right:none;}
ul.mcar_panel1 li:nth-child(1),
ul.mcar_panel1 li:nth-child(2) {border-bottom:solid 1px rgba(255,255,255,0.1);}
}




@media screen and (max-width:960px) {
#panel_mining {padding:60px 0px}

ul.mcar_panel1 li {width:100%;border-right:none;border-bottom:solid 1px rgba(255,255,255,0.1);}
ul.mcar_panel1 li:last-child {border-bottom:none;}
ul.mcar_panel1 li .card {min-height:auto;padding:10px;}
ul.mcar_panel1 li .card {}

ul.mcar_panel2 li {width:100%;border-right:none;border-bottom:solid 1px rgba(255,255,255,0.1);}
ul.mcar_panel2 li:last-child {border-bottom:none;}
ul.mcar_panel2 li .card {padding:10px;}

ul.mcar_panel3 li {width:50%;}
ul.mcar_panel3 li:nth-child(2n) {border-right:none;}
ul.mcar_panel3 li:nth-child(1),
ul.mcar_panel3 li:nth-child(2) {border-bottom:solid 1px rgba(255,255,255,0.1);}
ul.mcar_panel3 li .card {padding:10px;}
}



#container_wrap {min-height:100vh;}
#container_wrap.bg {background:url(../img/bg3.png) no-repeat center top;background-size:960px auto}


#header_wrap {display:block;position:relative;width:100%;max-width:960px;margin:0 auto;font-size:20px;font-weight:700;text-align:center;line-height:60px;z-index:999;}
#header_wrap a.btn_back {display:block;position:absolute;left:0px;top:0;color:#999;font-size:12px;line-height:60px;}
#header_wrap a.btn_back i {font-size:10px;}
#header_wrap a.btn_panel {display:block;position:absolute;right:0px;top:0;color:#fff;line-height:60px;}
#header_wrap a.btn_panel i {font-size:20px;}

#header_wrap .user {display:block;position:relative;padding:13px 0 13px 70px;font-size:16px;text-align:left;line-height:normal;}
#header_wrap .user .id {display:block;color:#999;font-size:12px;}
#header_wrap .user .profile_img {display:block;position:absolute;left:20px;top:50%;width:40px;height:40px;margin:-20px 0 0 0;line-height:40px;text-align:center;background:var(--gradient135);border-radius:50%;z-index:2;}
#header_wrap .user .profile_img:before {content:'';display:block;position:absolute;left:2px;top:2px;right:2px;bottom:2px;background:#222;border-radius:50%;overflow:hidden;z-index:-1;box-shadow:0 0 10px rgba(174,84,220,1);}
#header_wrap .user .profile_img  img {width:100%;height:auto;}

@media screen and (max-width:960px) {
#container_wrap.bg {background-size:100% auto}

#header_wrap a.btn_back {left:20px;}
#header_wrap a.btn_panel {right:20px;}
}


#user_panel {display:block;position:relative;width:100%;max-width:480px;min-height:calc(100vh - 180px);margin:120px auto 0 auto;padding:20px;background:#222;
-webkit-border-top-left-radius: 40px;
-webkit-border-top-right-radius: 40px;
-moz-border-radius-topleft: 40px;
-moz-border-radius-topright: 40px;
border-top-left-radius: 40px;
border-top-right-radius: 40px;
}
.user_info {display:block;position:relative;margin:0 20px 40px 20px;padding:0 0 0 100px;}
.user_info .btn_qr {display:block;position:absolute;right:0;top:50%;color:#999;
-webkit-transform:translate(0,-50%);
-moz-transform:translate(0,-50%);
-ms-transform:translate(0,-50%);
-o-transform:translate(0,-50%);
transform:translate(0,-50%);
}
.user_info .btn_qr i {font-size:20px;vertical-align:middle;}
.user_info .btn_qr i.fa-chevron-right {font-size:10px;}

.user_info .profile_img {display:block;position:absolute;left:0;top:-30px;width:80px;height:80px;line-height:80px;text-align:center;background:var(--gradient135);border-radius:50%;z-index:2;}
.user_info .profile_img:before {content:'';display:block;position:absolute;left:2px;top:2px;right:2px;bottom:2px;background:#222;border-radius:50%;overflow:hidden;z-index:-1;box-shadow:0 0 10px rgba(174,84,220,1);}
.user_info .profile_img img {width:100%;height:auto;}
.user_info strong {font-size:18px;font-weight:700;
background: #497CED;
background: linear-gradient(to right, #497CED 0%, #6BE9F4 50%, #AE54DC 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.user_info p {color:#999;font-size:13px;}

#user_panel ul {}
#user_panel ul li {display:block;border-bottom:solid 1px #333;}
#user_panel ul li a {display:block;position:relative;padding:0 10px;line-height:60px;}
#user_panel ul li a:hover {background:#333}
#user_panel ul li a i {color:var(--color);font-size:18px;margin:0 12px 0 0;}
#user_panel ul li a .arrow {display:block;position:absolute;right:0;top:0;font-size:12px;}
#user_panel ul li a .arrow i {color:#999;font-size:12px;}


@media screen and (max-width:480px) {
#user_panel {min-height:calc(100vh - 140px);margin:80px auto 0 auto;}
}








#noti_wrap {display:block;position:fixed;left:0;right:0;top:0;bottom:0;height:100vh;overflow:hidden;background:rgba(0,0,0,0.6);z-index:99999}
.noti {display:block;position:relative;width:100%;max-width:480px;min-height:100vh;overflow-y:auto;margin:0 auto;padding:40px;background:#222;}
.noti h2 {display:block;margin:0 0 24px 0;font-size:20px;font-weight:800;
background: #497CED;
background: linear-gradient(to right, #497CED 0%, #6BE9F4 50%, #AE54DC 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.noti .btn_noti_close {display:block;position:absolute;right:40px;top:40px;width:30px;height:30px;color:#fff;font-size:16px;text-align:center;background:none;border:none;}

.noti .noti_cont {margin:0 0 40px 0;line-height:160%;}


#remi_wrap {display:none;position:fixed;left:0;right:0;top:0;bottom:0;height:100vh;overflow:hidden;background:rgba(0,0,0,0.6);z-index:99999}
.remi {display:block;position:absolute;left:50%;top:50%;width:90%;max-width:480px;padding:20px;background:#222;border-radius:10px;
-webkit-transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
-o-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
}
.remi .btn_remi_close {display:block;position:absolute;right:20px;top:20px;width:30px;height:30px;color:#fff;font-size:16px;text-align:center;background:none;border:none;}

.remi .remi_icon {padding:40px;text-align:center;}
.remi .remi_icon img {width:100%;height:auto;}
.remi strong {display:block;margin:0 0 12px 0;color:#fff;font-weight:600;text-align:center;}
.remi p {margin:0 0 40px 0;color:#999;line-height:160%;text-align:center;}
.remi a.btn_act {display:block;width:100%;line-height:50px;}


#float {display:none;position:fixed;left:50%;bottom:0;width:100%;max-width:960px;background:#222;border-top:solid 1px #333;z-index:999;
-webkit-transform:translate(-50%,0);
-moz-transform:translate(-50%,0);
-ms-transform:translate(-50%,0);
-o-transform:translate(-50%,0);
transform:translate(-50%,0);
}
#float ul {}
#float ul:after {display:block;visibility:hidden;clear:both;content:""}
#float ul li {display:block;float:left;width:20%;}
#float ul li a {display:block;padding:12px 0;color:#999;text-align:center;}
#float ul li a .icon {display:block;margin:0 0 4px 0;}
#float ul li a .icon i {font-size:16px;}
#float ul li a p {font-size:12px;}
#float ul li a.active {color:var(--color);}


@media screen and (max-width:960px) {
#float {display:block;}
}