body{
  color: var(--color-text-1);
  --cardHover:#F2F7FF;
}
body.classic-dark{
  --cardHover:#0F1F4D;
}
.dark-body .future-main .tr-row:hover{background-color: #23282E!important;}
.classic-dark .future-main .tr-row:hover{background-color: #23282E!important;}
.b-unit{color: var(--color-text-2);font-weight: 400;font-family: inherit;}

.rate_down,.green,.rise-green-body .rate_up,.rise-green-body .red,body.classic-dark.rise-green-body  #future-main-root  .rate_up{color: var(--color-funct-2) !important;}
.rate_up,.red,.rise-green-body .rate_down,body.classic-dark.rise-green-body #future-main-root .rate_down{color: var(--color-funct-3) !important}

.rate_down,.rate_up,.red,.green{font-family: inherit;font-weight: 400;}

.com-font{color: var(--color-text-1);}
.mt14{margin-top: 14px;}

.content{padding:0;position:relative}
.top-divi{height: 4px;width: auto;}
.dark-body .top-divi{background-color: #0C0E0F;}
.classic-dark .top-divi{color: #0C0E0F;}
.bottom-divi{height: 4px;width: auto;}
.dark-body .bottom-divi{background-color: #0C0E0F;}
.classic-dark .bottom-divi{color: #0C0E0F;}
.future-main{display:flex;background-color:#F7F7F7;}
.future-main-content{flex:1 auto;width: 1px;margin-top: 4px;}
.future-main-content-top{display:flex;}
.mb32{margin-bottom: 32px;}
.mb8{margin-bottom: 8px;}
.fs12{font-size: 12px!important;}
.fs14{font-size: 14px!important;}
.fs16{font-size: 16px!important;}
.fs20{font-size: 20px!important;}
.pb16{padding-bottom: 16px;}
.pt16{padding-top: 16px;}
.fw500{font-weight: 500;}

.primary-color-007980{
  color: #007980;
}
.color-E64E62{
  color: var(--brandColor);
}
.classic-dark .color-E64E62{
  color:var(--brandColor)
}
.dark-body .color-E64E62{
  color:var(--brandColor)
}
.classic-dark .primary-color-007980{
  color: #0BBA80
}
.dark-body .primary-color-007980{
  color:#0BBA80
}
.icon-arrow_down_noodle{
  width: 20px;
  height: 20px;
  line-height: 20px;
  transform:scale(0.5, 0.5);
}
.interval-edit .icon-arrow_down_noodle,.interval-edit .icon-arrow_up_noodle{color: var(--color-text-1);}
.favors-bar-container{display:flex;padding-left:20px;align-items:center;border-bottom:1px solid #c8dae2;height:60px;line-height:60px;overflow:hidden}
.favors-select-bar-container{flex:1;overflow:scroll;height:77px;line-height:77px;overflow-y:hidden}
.favors-select-bar{overflow:hidden;width:max-content;display:flex}
.favors-select-item{width:130px;height:50px;cursor:pointer;display:flex;flex-direction:column;padding-left:10px;border:1px solid #d8d8d8;border-radius:4px;margin-left:10px;margin-top:12px;position:relative;overflow:hidden;transition:all .3s}
.favors-select-item:hover{transform:translateY(-2px)}
.rt-triangle{width:0;height:0;position:absolute;right:0;border-width:22px 0 0 25px;border-style:solid;border-color:#de595a transparent transparent transparent}
.rt-triangle:after{content:'✓';position:absolute;top:-23px;left:-11px;height:20px;line-height:20px;color:#fff;font-size:12px}
.favors-select-name{color:#888;height:25px;line-height:30px}
.favors-select-value{height:20px;line-height:20px;display:flex;justify-content:space-between;padding-right:10px;font-size:12px;margin-top:5px}
.favors-select-value span:first-child{color:#888}
.dark-body .favors-select-name{color:#fff}
.favors-ctrl{width:16px;height:50px;margin-left:10px;border:1px solid #c8dae2;border-radius:2px;cursor:pointer;position:relative}
.left-arrow{width:0;height:0;border-right:5px solid #5a5959;border-top:5px solid transparent;border-bottom:5px solid transparent;position:absolute;top:50%;margin-top:-5px;left:6px}
.right-arrow{width:0;height:0;border-left:5px solid #5a5959;border-top:5px solid transparent;border-bottom:5px solid transparent;position:absolute;top:50%;margin-top:-5px;left:6px}
.favors-star{background-image:url(/images/star.svg);width:25px;height:25px;background-size:25px;background-position-y:-25px}
.smalll-favors-star{display:inline-block;background-image:url(/images/star.svg);width:16px;height:16px;background-size:16px;background-position-y:0;transition:all 0.3s}
.smalll-favors-star.active{background-position-y:-16px}
.hover-dahsed-border:hover{border-bottom:1px dashed #ccc}
#contract-info-container{height:64px;background: var(--color-bg-3)}
#contract-info{padding:5px;padding-left:0;position:relative;height:50px;border-radius:0;display:flex}
.contract-info-content{flex:auto;padding: 0 10px;display: flex;flex-direction: row;align-items: center;}
.top-bar-right{display:flex;flex:1;}
.area-expand-active{width:380px;box-shadow:0 2px 4px 0 rgba(0,0,0,.5);padding-bottom:10px;z-index:2;}
.drop-down-container{background:#fff;width:580px;box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.08);z-index:2;position:absolute;border-radius:5px;top:60px;left: 16px;}
.contracts-drop-down{padding:10px 0px;padding-bottom:5px;}
.index-contract{padding:0 8px;border:1px solid var(--brandColor);border-radius: 2px;margin: 0 5px 0;color:var(--brandColor);font-size:12px;height: 20px;line-height: 21px;position:relative;}
.index-contract::after{content:'';position:absolute;width:90%;height:0;border-bottom:1px dashed #8c92a6;bottom:0;left:0;}
.select-navs{position:absolute;right:20px;}
.select-navs li{padding:3px 8px;position:relative;cursor:pointer;margin-left:8px;background:#f8f8f8;color: #666;border-radius:4px;}
.select-navs li.active{color: var(--brandColor);background: var(--branColorOpacityDark)} 
.contract-clickable span.is-index{border:1px solid;color:var(--brandColor);font-size:12px;border-radius:2px;padding:2px 3px;margin-left:2px;transform: scale(0.8);}
.popup-jump-main{z-index:1;position:absolute;padding:16px;box-sizing:border-box;background:#fff;color:#3a3a3a;box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.15);left: 0;top: 24px;width: 213px}
.dark-body .popup-jump-main{background-color: #161A1E;color: #E6E6E6;}
.classic-dark .popup-jump-main{background-color: #161A1E;color: #E6E6E6;}
.popup-jump-content{justify-content:flex-start;font-size:14px;}
.popup-jump-content i{display:inline-block;width:14px;min-width:14px;height:14px;background-image:url(/images/ic_warning.png?v=0526);background-size:100%;margin-right:4px;}
.jump-btn-grounp{justify-content:flex-end;margin-top:12px;}
.jump-btn-grounp button{border:none;outline:none;height:24px;line-height:24px;box-sizing:border-box;padding:0 10px;cursor:pointer;}
.jump-btn-grounp .jump-btn-cancel{color:rgba(0,0,0,.65);border:1px solid #d9d9d9;background:#fff;}
.jump-btn-grounp .jump-btn-primary{color:#fff;background:var(--brandColor);margin-left:8px;cursor: pointer;}
.contracts-drop-down-table{width:100%;font-size:12px;}
.header-protips-content{width:auto!important;padding:8px!important;font-size:12px;color:#fff;background:#000!important;opacity:0.7;cursor:auto;}
.header-protips-arrow{background:#000!important;}
.header-protips-content a{color:var(--brandColor);cursor:pointer;margin-left:8px;}
.contracts-drop-down-table__container{height:240px;padding : 0px 25px 0px 20px;margin-top:10px;}
.contract-clickable{display: flex;cursor: pointer;}
.contract-clickable>div{display: flex;align-items: center;}
.contract-clickable:hover{background:#efefef}
.contract-name-top-line{font-size:20px;display:flex;align-items:center;cursor:pointer; padding-left:20px;color: var(--color-text-1);}
.contract-name-bottom-line{font-size:12px;color:#8491a8}

.contracts-drop-down-table-head>div:first-child,.contracts-drop-down-table .contract-clickable>div:first-child{width: 25%;}
.contracts-drop-down-table-head>div:nth-child(2),.contracts-drop-down-table .contract-clickable>div:nth-child(2){width: 30%;}
.contracts-drop-down-table-head>div:nth-child(3),.contracts-drop-down-table .contract-clickable>div:nth-child(3){width: 20%;}
.contracts-drop-down-table-head>div:last-child,.contracts-drop-down-table .contract-clickable>div:last-child{justify-content: flex-end;width: 24%;text-align: right;}

.contracts-drop-down-table-head>div{font-size: 12px;color: #a6a6a6;}
.dark-body .settlecoin-nav-button{border-color: #31373D;}
.classic-dark .settlecoin-nav-button{border-color: #31373D;}
.settlecoin-nav-button{justify-content:flex-start;position:relative;border-bottom:1px solid #F0F0F0;padding: 0 20px;height: 40px;}
.settlecoin-nav-button .btn-item{margin-right:15px;cursor:pointer;max-width: 150px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;height:40px;border-bottom:2px solid transparent;height: 40px;font-size: 12px;display: flex;align-items: center;justify-content: center;}
.settlecoin-nav-button .btn-item.active{position: relative;}
.settlecoin-nav-button .btn-item.active::after{
  content: '';
  width: 24px;
  height: 3px;
  background: var(--brandColor);
  border-radius: 2px;
  position: absolute;
  left: calc(50% - 12px);
  bottom: 0px;
}
.settlecoin-nav-button img{width:14px;}
.name-after-border{border-radius:4px;display:flex;align-items:center;justify-content:center;width:20px;height:20px;margin-left:4px;;}


.area-expand-active .name-after-border::after{transform:rotate(180deg)}
.contract-info-title{color:var(--color-text-3);margin:5px 0;text-transform: capitalize;}
.contract-info-lastprice{font-size:20px;height:50px;line-height:50px;}
.contract-info-indicator>div{text-align:left;font-size:12px}
.contract-info-indicator{margin-left: 32px;}
.future-transfer-title{padding-left:25px;font-size: 16px;}
.future-transfer-title span{padding:5px;cursor:pointer;margin-left:0!important;position: relative;}
.future-transfer-title span.active{color:var(--brandColor);}
.future-transfer-title span.active::after{
  content: '';
  width: 24px;
  height: 3px;
  background: var(--brandColor);
  border-radius: 2px;
  position: absolute;
  left: calc(50% - 12px);
  bottom: -10px;
}
.moneyTransferIco{width:18px;height:18px;margin-bottom:10px;margin-top:-10px;margin-left:-2px;cursor:pointer}
.inlineBlock{display:inline-block}
.common-title{font-size:14px;}
.common-title-text{color: var(--color-text-1);}

.dealbox .inputRate{text-align:right;height:40px;padding-right:50px}
.dealbox{margin: 0 auto;}
.inputRate[disabled]{background:#ddd}
.input-title{font-size:14px}
.order-type-sw{display:flex;margin:18px 0;flex-direction: row;font-size: 14px;}
.order-type-sw>div{display: flex;justify-content: center;align-items: center;color:var(--color-text-4);position: relative;padding-bottom: 5px;}
.order-type-sw span{cursor: pointer;}
.order-type-sw .active{
  color: var(--color-text-1);
}
.trigger-price{display:flex}
.trigger-price-sel-contain{padding-left:10px;border-right:1px solid #ccc;align-items:center;display:flex;padding-right:5px}
.trigger-price-sel-contain select{font-size:14px;padding-right:9px;z-index:10}
.trigger-price-sel-contain .select-arrow-down{position:static;margin-left:-6px}
.trigger-price-input-contain{flex:1 auto}
#trigger-price-input{width:100%;height:100%;border:none;outline:0;text-align:right;background:0 0}
.order-right-select{padding-right:20px;width:auto!important;direction:rtl!important;z-index:1}
.order-conditions{background:#f7f7f7;border-radius:4px;padding:10px;margin-top:10px;font-size:12px}
.order-conditions label{font-size:12px;}
.order-conditions-cbox{margin-left:10px}
.order-conditions-checkbox-container{display:flex}
.en-body .order-conditions-checkbox-container{flex-direction:column}

.order-conditions-checkbox_stop { flex-direction: column;  }
.order-conditions-checkbox_stop .ml10, .order-conditions-checkbox_stop .order-conditions-cbox { margin-left: 0 !important; }

.en-body .order-conditions-cbox{margin-left:0}
#order-tif-container .inputRate{background:#fff;}
#order-tif-container{position: relative;}
.btn-group>div{width:126px;color: var(--color-text-2);}
.btn-group .number{color: var(--color-text-1);}
.common-select,.common-select:focus{appearance:none;-webkit-appearance:none;border:none;outline:0;background:0 0}
.order-right-position{position:absolute;right:0;top:17px;width:40px;font-size:12px}
.dark-body .order-right-position{color:#aaa}
.mt10{margin-top:10px}
.mt16{margin-top:16px}
.mt5{margin-top: 5px;}
.ml4{margin-left: 4px;}
.ml10{margin-left:10px}
.ml16{margin-left:16px}
.ml32{margin-left:32px}
.poup_slider_container{background:#f8f8f8;border-radius:2px;padding:10px}
.poup_subtitle{font-size:18px;margin-bottom:10px}
.poup_subtitle .side{padding:0 5px}
.poup_msg_table{width:100%;margin-top:10px;border:1px solid #e4ebf0;border-bottom:none;font-size:12px}
.poup_msg_table_lable{background:#f8f8f8;color:#a6a6a6;width:90px}
.poup_msg_table td{padding:8px;border-right:1px solid #e4ebf0;border-bottom:1px solid #e4ebf0}
.contract-select-arrow-down{content:"";width:0;height:0;border-width:4px 4px 0;border-style:solid;border-color:#000 transparent transparent;position:absolute;right:7px;top:21px}
.select-arrow-down{content:"";width:0;height:0;border-width:4px 4px 0;border-style:solid;border-color:#000 transparent transparent;position:absolute;right:7px;top:23px;display:inline-block}
.pos-size-arrowdown{top:7px!important}
.dark-body .select-arrow-down{border-color:#aaa transparent transparent}
.funds_transfer_icon{font-size: 14px;cursor:pointer!important;position:relative;top:1px;margin-right:5px;color: var(--color-text-2);}
.tools-future{font-size:12px;cursor:pointer;display:flex;color: var(--color-text-2);}
.tools-future:hover{color:var(--brandColor)}
.future_jiaoyi_btn{border:none;margin-bottom:5px;height: 32px;width: 48%;font-size:14px;border-radius: 5px;color: white;}
.order-value-rest{margin-top:10px;font-size:12px}
.flex-between{display:flex;justify-content:space-between}
.flex-around{display:flex;justify-content:space-around}
#position-info-container{margin-top:30px}
.font-color{color:#999999}
.contract-detail-info{font-size:12px}
.contract-detail-info>div{color:var(--color-text-2);margin-top:10px}
.dark-body .contract-detail-info>div a{color:var(--color-text-2);}
.classic-dark .contract-detail-info>div a{color:var(--color-text-2);}
.postion-text{text-align:center;margin-top:10px;font-size:12px}
.postion-value{text-align:center;margin-top:0;font-size:12px}
.left-position-info-container .gradient-bar{margin-top:10px}
.left-position-info-row{display:flex}
.left-position-info-row>div{width:50%}
.gradient-bar{background:linear-gradient(to right,#25796a,#d45858);position:relative;height:30px;line-height:30px}
.gradient-bar-numer{position:absolute;padding-left:5px;transition:all .5s;color:#fff;font-size:.8rem;border-bottom:none!important}
.gradient-bar-line{height:100%;border-left:2px solid #fff;position:absolute;transition:all .5s}
.gradient-bar-left-ico{width:15px;position:absolute;left:5px;top:8px}
.gradient-bar-right-ico{width:15px;position:absolute;right:5px;top:8px}
.lever-bar-container{position:relative;height:55px;display: flex;flex-direction: column;align-items: center;}
.leverbar-line{border-bottom:2px solid #ccc;position:absolute;top:19px;}
.leverbar-marker:first-child .leverbar-marker-before{position: relative;left: 0;} 
.leverbar-marker-container{position:relative;top:15px;color:#8f95a8;width: 100%;}
.leverbar-marker-before{content: '';width: 6px;height: 6px;background: #fff;border-radius: 10px;display: block;color: #8f95a8;position: relative;border: 2px solid #8f95a8;}
.leverbar-marker{text-align:center;font-size:12px;cursor:pointer;font-weight:300}
.leverbar-marker.active{color:var(--brandColor)}
.leverbar-marker.active .leverbar-marker-before{border-color:var(--brandColor)}
.risk-limit-val{color:#d45858;padding:0 5px}
.risk_limit_change{font-size:12px}
.risk_limit_change_btn{cursor:pointer!important}
.risk_limit_seprator{padding:0 3px}
.risk_limit_change_btn .margin-edit-ico{position:relative;top:1px;margin-left:3px}
#contract-detail-info-container{padding: 16px;height: 100%;box-sizing: border-box;}
#ul-ask-list,#ul-bid-list{/**height:500px;*/height: 100%; z-index:1!important}
.tradingview-container{height:654px;flex:1 auto;overflow:hidden;margin-right:4px;position: relative;padding: 20px 16px 16px 16px;}
#kline_tradingView_Indicator { width: calc(100% - 104px) !important; margin-left: 52px; border-top: 1px solid rgba(51,51,51,.3); background: transparent !important; color: rgba(0, 0, 0, 0.65);  display: block;}
.future-com-back1{
  position: absolute; bottom: 0px;
  width: 100%;
  background-color: #FFFFFF;
}
.dark-body .future-com-back1 {
  background: #161A1E;
}
.classic-dark .future-com-back1 {
  background: #161A1E;
}
#kline{padding:0;height: calc(100% - 35px) ;}
#right-top-container{width:300px;}
#ask-list,#bid-list{height:calc((100% - 121px)/2)}
.list-all-height{height:calc((100% - 121px)) !important;}
#ask-list.ask-list-show{display: block;}
#ask-list.ask-list-hidden{display: none;}
#bid-list.bid-list-show{display: block;}
#bid-list.bid-list-hidden{display: none;}
#ask-list{margin-top:10px}
#bid-list{margin-top:0}
.orderbook-rect{position:absolute}
#ask-list li,#bid-list li{line-height:26px;overflow:hidden;padding-right: 0px;height: 22px;line-height: 22px;color: var(--color-text-2);}
#trade-list li:hover, #ulGlobalMarkets li:hover, #ulRace li:hover{background-color:var(--cardHover);}
#ask-list li:hover, #bid-list li:hover{background-color:var(--cardHover);}
/* #ask-list li:nth-child(even), #bid-list li:nth-child(even), #trade-list li:nth-child(even){background: inherit !important} */
.over-shadow{background-color:var(--cardHover);}
.classic-dark .over-shadow,.classic-dark #future-main-root #ask-list li:hover, .classic-dark #future-main-root #bid-list li:hover,.classic-dark #future-main-root #trade-list li:hover, .classic-dark  #ulGlobalMarkets li:hover,.classic-dark  #ulRace li:hover{background-color:var(--color-card-3) !important}
.rect{transform:translateZ(0)}
#order_last_price.rate_up:after{border-width:0 6px 6px;border-color:transparent transparent#d45858}
.rise-green-body #order_last_price.rate_up:after{border-color:transparent transparent #25796a}
.rise-green-body #order_last_price.rate_down:after{border-color:transparent transparent#d45858}
.order-book-top-center{
  padding: 4px 0;
}
.order-book-center{padding: 16px 0px 8px 0px;}
.order-book-center-show{display: flex;}
.order-book-center-hidden{display: none;}
.dark-body .order-book-center{border-color:#343a48}
.order-book-center .curr-price{font-size:17px;font-weight: 500;}
.order-book-center .index-mark-price{font-size:12px;position:relative}
.mk-price-tip{line-height: 16px;}
/* #adl_ranking_ul{cursor:pointer;position:absolute;right:-37px;top:1px} */
#adl_ranking_ul li{background:#ccc;height:10px;width:3px;display:inline-block;margin-right:2px}
#adl_ranking_ul .rank_safe.active{background:var(--color-funct-2)}
#adl_ranking_ul{min-width: 30px;}
.position-adl_ranking_ul li{height:10px;width:3px;display:inline-block;margin-right:2px}
.position-adl_ranking_ul .rank_safe.active{background:var(--color-funct-2)}
.position-adl_ranking_ul{min-width: 30px;}
#order_mark_price{margin-right: 4px;line-height: 12px;}
.dataTables_empty{text-align:center!important;padding-top:10px}
#trade-list-future li>span,.orderBook-table-li>span{width:30%}
#trade-list-future li>span:last-child,.orderBook-table-li>span:nth-child(3){text-align:right;width:50%}
#trade-list-future li>span:nth-child(2),.orderBook-table-li>span:nth-child(2),.orderbook-table-header span:nth-child(2){text-align:right !important;}

#trade-list{height: calc(100% - 86px);overflow:hidden;font-size: 12px;flex: 1;}
.trade-list-container .common-title svg{transform: rotate(90deg);font-size:20px;cursor:pointer;transition: all 0.3s;}
.trade-list-container .common-title svg.icon-rotate{transform: rotate(-90deg);}
.trade-list-container .common-title,.orderbook-container .common-title{display:flex;justify-content:space-between;padding: 12px 16px;border-bottom: 1px solid var(--color-divider-2);}
.trade-list-wrap{display: flex;flex-direction: column;overflow: hidden;justify-content: space-between;padding: 0 16px;flex: 1;}
#trade-list:hover{overflow-y: scroll;}
#trade-list:hover li{padding-right:0;}
/* #trade-list li{padding-right: 8px;} */
.trade-list-container{box-sizing: border-box;height: 100%;display: flex;flex-direction: column;}
.close-list{margin-top: 4px;background-color: white;padding: 16px;min-height:63px}
.trade-list-container.close-list .orderbook-table-header,.trade-list-container.close-list #trade-list{display: none;}
.orderbook-container.expand-list #ask-list,
.orderbook-container.expand-list #bid-list{height: 230px;}
.orderbook-container{height: 100%;box-sizing: border-box;display: flex;flex-direction: column;}
.order-book-wrap{padding: 0px 16px;font-size: 12px;flex: 1;overflow: hidden;}
.orderbook-table-header{color: var(--color-text-3);font-size: 12px;}
#loan_situation_div{margin-top:10px}
.not-login-container{min-height:200px;text-align:center;line-height:200px;height:100%;font-size:14px;color:#fff;position:absolute;width:100%;display:block!important}
.not-login-container a{color:#fff;border-bottom:1px dashed #ccc}

.bottom-position-table tr:hover{background:0 0}
.future-bottom-table-title{position:relative;font-size: 14px;padding-left: 16px;}
.dark-body .future-bottom-table-title{border-color:#343a48}
.usd-trans-col{font-size:12px;color:#8f95a8}
.order-right-trans-container{display:flex;flex-direction:column}
.order-right-trans-container span{text-align:right;color: var(--color-text-1);}
.table-title-back{background: var(--color-card-1);}
.classic-dark .table-title-back{background: #151926;}
.future-bottom-table-title li{height:40px;line-height:40px;display:inline-block;padding-right:24px;cursor:pointer;color: var(--color-text-3);font-weight: 500;}
.future-bottom-table-title li.active{display:inline-block;color: var(--color-text-1);}
#future-main-root .future-bottom-table-title li.active{border-bottom: none !important;}
.future-bottom-table-title li:hover{color:var(--color-text-1);}
.table-title-back .hide-other-pairs-checkbox {color: var(--color-text-2);font-size: 12px;}


.even,.odd{height:56px}
.position-table td{display: flex;align-items: center;}
.position-table td:last-child,.future-bottom-table th:last-child{padding-right:15px;justify-content: flex-end;}
.future-bottom-table td:first-child,.future-bottom-table th:first-child{padding-left:15px;text-align:left}
.future-bottom-table td:last-child,.future-bottom-table th:last-child{padding-right:15px;text-align:right}

.position-table td:first-child{padding-left:15px;text-align:left;}
.classic-dark .position-table td:first-child,.classic-dark .position-table th:first-child{background-color: #11141E;}
.position-scroll-shadow{box-shadow: 0px 0px 24px 1px rgba(0,0,0,0.0800);}
.position-table thead{position: sticky;top: 0px;z-index: 2;background-color: #FFFFFF}
.classic-dark .position-table thead{background-color: #11141E;}
/* .position-table th:first-child{z-index: 2;position: sticky;top: 0px;left: 0px;background-color: #FFFFFF} */

.future-bottom-table #center-align{text-align:center}
.bottom-table-container{padding-right:16px;height: calc(100% - 39px);box-sizing: border-box;overflow: auto;}
.bottom-table-container table{font-size:12px;min-width: 900px;border-collapse:collapse}
.table-scroll-con{overflow-y: scroll;}
.table-scroll-con::-webkit-scrollbar { width: 0}
.bottom-table-container table{border-collapse:collapse}
.bottom-table-container table td:last-child{text-align:right;justify-content: flex-end;}
.bottom-table-container table td{text-align:left;padding: 21px 0px;}
.bottom-table-container .position-table td{padding-top: 17px;padding-bottom: 17px;}
.bottom-table-container table th{font-size: 12px; color: var(--color-text-3);font-weight:400;text-align:left;padding: 16px 0px;border-bottom: 1px solid var(--color-divider-2);}
/* .classic-dark .bottom-table-container table th{border-color: #342e2e; background-color: #11141E;} */
/* .bottom-table-container table th:hover{color: #333333;} */
/* .classic-dark .bottom-table-container table th{color: #91979E;} */
/* .classic-dark .bottom-table-container table th:hover{color: #E6E6E6;} */
.dark-body .bottom-table-container table tr{border-color: #31373D;}
.classic-dark .bottom-table-container table tr{border-color: #31373D;}
.bottom-table-container table tr:last-child{border:none;}
.cancle-close-btn{display:inline-block;background:var(--brandColor);color:#fff;width:25px;height:14px;font-size:12px;line-height:14px;text-align:center;position:relative;top:2px;margin-left:5px;cursor:pointer!important;border-bottom:none!important}
.poup_margin_msg_title{color:#a6a6a6}
.force-close-color{color:gray}
.main-font-color{color:var(--brandColor)}
.close-position-group{display:flex;position:relative;justify-content:center}
.common-table-button{background:var(--brandColor);border:none!important;color:#fff;font-size:12px;padding:3px 8px;cursor:pointer!important;border-radius:4px;}
.close-position-group .common-table-button:last-child{margin-left:6px}
.close-position-price-unit{position:absolute;right:2px;top:3px;font-size:12px}
.close-position-input-group{position:relative}
.close-position-input-group input{height:21px;width:80px;cursor:text;padding:0;padding-left:10px}
.protip{border-bottom:1px var(--color-text-4) dashed ;cursor:help}
.no-border{border-bottom:none}
.margin-edit-td{color:#4d8fc1;cursor:pointer;display:inline-block;}
.margin-edit-ico{width:12px;height:12px;display:inline-block;cursor:pointer!important;border-bottom:none!important}
.bottom-position-table .margin-edit-ico{margin-right:4px;position:relative;top:-1px}
.dark-body .close-position-input-group input{background:#4b535f!important;border:1px solid #5d708c!important}
.table-close-btn{width:10px;height:10px;cursor:pointer;transform:rotate(90deg);position:relative;top:1px}
.line-type .choosen{margin-left:10px}
#noty_center_layout_container{top:50%!important;left:50%!important;transform:translate(-50%,-50%)}
#noty_center_layout_container .noty_buttons{
  height:auto;margin-top:18px!important;margin-bottom:9px;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;  
}
#noty_center_layout_container .noty_title span{margin-left:10px}
#order_poup_box{min-height:460px}
#notyClose{cursor:pointer}
.leverage_poup_react_container .leverbar-marker{cursor:default}
.leverage-input-container{font-size:12px;}
.leverage-input-container .leverage-value{margin-right:4px;}
.leverage-input-right{cursor:pointer;}
.one-white .noty_buttons{padding-bottom:0}

.radio-beauty-container .radio-name{font-size:12px}
.noty_body{min-height:100px;margin:55px 25px 0}
.noty_title{font-size:12px;border-bottom: 1px solid #F0F0F0;padding-bottom: 0px!important;}
.noty_title img{width:20px}
#exchanged_container .unit{line-height:30px;position:absolute;right:55px;top:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
#button-0.btn-cancel{background:#D8D8D8;width:130px;margin:0}
.btn-cancel+#button-1{background:#D45858;width:130px}
.btn-red{background:#d45858!important}
.one-white .radio-beauty-container{margin-bottom:10px}
#chatFrameCon{width:270px!important;min-width:270px!important;height:500px;bottom:-500px!important;left:20px!important}
#chatFrameCon[mode=full]{left:0;bottom:-100vh!important;border-radius:0;height:100%;border:none}
#chatFrameCon.chat-on[mode=full]{border:1px solid #b0b5be;border-left:none;border-right:none;top:0 !important;bottom:0 !important; position: fixed;}
#chatFrameCon.chat-on{transform: translate(0,0) !important;top: 284px !important;position: absolute;}
div .previewPicDiv{height:330px}
div .show-uptip .previewPicDiv:before{margin:110px auto 15px}
div .modal .btn-default,div .modal .btn-primary,div .modal button,div .muteModal .btn-default,div .muteModal button{padding:8px 2em}
.p-to-p-area{width:1670px!important;right:-1670px!important}

.en-body #chatFrameCon.chat-on{width:275px!important;min-width:275px!important}
.right-top-tools{z-index:1;font-size:12px;display:flex;color: var(--color-text-4);position: relative;}
.right-top-tools>div{margin-left:24px;display:flex;align-items:center;cursor:pointer}
.right-top-tools>div:first-child{margin-left: 0px;}
.right-top-tools.iconfont{margin-right: 4px;}
#unit_set_btn{position:relative;display:flex}
#unit_set_btn .select-arrow-down{top:8px}
.setting_noty_body .radio-beauty-container{margin:0}
.btcUnits-container{display:flex}
.btcUnits-item{border:1px solid #eee;padding:3px;margin-left:10px;font-size:12px;cursor:pointer;width:42px;text-align:center}
.btcUnits-item.active{border-color:#d45858}
.noty_row{display:flex;align-items:center;margin-bottom:10px}
.noty_row_lable{width:100px;font-size:12px}
.setting_noty_body{padding-top:10px;min-height:60px}
.setting_noty_body.usdt-setting{min-height:20px}
.radio-beauty{margin-left:10px}
.time-tip{display:none;position:fixed;top:0;z-index:9998;width:100%;height:100%;background:rgba(0,0,0,.8)}
.time-tip-con{width:780px;margin:0 auto;margin-top:11%;background:#fff;line-height:26px;height:350px;border-radius:10px}
.gotoTrade{position:relative;width:200px;text-align:center;top:bo;display:inline-block;left:279px;top:23px}
.countdown{width:100%;margin:0 auto;margin-top:20px;height:220px;padding-top:34px;background-image:url(/images/bg_red.png);border-radius:10px}
.countdown .bloc-time{float:left;margin-right:45px;text-align:center;margin-left:15px}
.countdown .bloc-time:last-child{margin-right:0}
.countdown .count-title{display:block;margin-bottom:15px;font:normal .94em Lato;color:#fff;text-transform:uppercase}
.countdown .figure{position:relative;float:left;height:110px;width:100px;margin-right:10px;background-color:#fff;border-radius:8px;-moz-box-shadow:0 3px 4px 0 rgba(0,0,0,.2),inset 2px 4px 0 0 rgba(255,255,255,.08);-webkit-box-shadow:0 3px 4px 0 rgba(0,0,0,.2),inset 2px 4px 0 0 rgba(255,255,255,.08);box-shadow:0 3px 4px 0 rgba(0,0,0,.2),inset 2px 4px 0 0 rgba(255,255,255,.08)}
.countdown .figure:last-child{margin-right:0}
.countdown .figure>span{position:absolute;left:0;right:0;margin:auto;font:normal 5.94em/107px Lato;font-weight:600;color:#de4848}
.countdown .figure .bottom-back:after,.countdown .figure .top:after{content:"";position:absolute;z-index:-1;left:0;bottom:0;width:100%;height:100%;border-bottom:1px solid rgba(0,0,0,.1)}
.countdown .figure .top{z-index:3;background-color:#f7f7f7;transform-origin:50% 100%;-webkit-transform-origin:50% 100%;-moz-border-radius-topleft:10px;-webkit-border-top-left-radius:10px;border-top-left-radius:10px;-moz-border-radius-topright:10px;-webkit-border-top-right-radius:10px;border-top-right-radius:10px;-moz-transform:perspective(200px);-ms-transform:perspective(200px);-webkit-transform:perspective(200px);transform:perspective(200px)}
.countdown .figure .bottom{z-index:1}
.countdown .figure .bottom:before{content:"";position:absolute;display:block;top:0;left:0;width:100%;height:50%;background-color:rgba(0,0,0,.02)}
.countdown .figure .bottom-back{z-index:2;top:0;height:50%;overflow:hidden;background-color:#f7f7f7;-moz-border-radius-topleft:10px;-webkit-border-top-left-radius:10px;border-top-left-radius:10px;-moz-border-radius-topright:10px;-webkit-border-top-right-radius:10px;border-top-right-radius:10px}
.countdown .figure .bottom-back span{position:absolute;top:0;left:0;right:0;margin:auto}
.countdown .figure .top,.countdown .figure .top-back{height:50%;overflow:hidden;-moz-backface-visibility:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.countdown .figure .top-back{z-index:4;bottom:0;background-color:#fff;-webkit-transform-origin:50% 0;transform-origin:50% 0;-moz-transform:perspective(200px) rotateX(180deg);-ms-transform:perspective(200px) rotateX(180deg);-webkit-transform:perspective(200px) rotateX(180deg);transform:perspective(200px) rotateX(180deg);-moz-border-radius-bottomleft:10px;-webkit-border-bottom-left-radius:10px;border-bottom-left-radius:10px;-moz-border-radius-bottomright:10px;-webkit-border-bottom-right-radius:10px;border-bottom-right-radius:10px}
.countdown .figure .top-back span{position:absolute;top:-100%;left:0;right:0;margin:auto}
.cal_noty_body{margin-bottom:36px}
.cal_noty_tabtitle{border-bottom:1px solid #c8dae2;display:flex}
.cal_noty_tabtitle>div{margin-right:20px;font-size:14px;color:#111;padding-bottom:5px;cursor:pointer}
.cal_noty_tabtitle>div.active{color:var(--brandColor);border-bottom:1px solid var(--brandColor)}
.cal_noty_content{display:flex;font-size:12px;padding-top:30px}
.cal_noty_content>div{width:50%}
.poup_form_row{display:flex;justify-content:flex-start;font-size:12px;padding:0;height:30px;border:1px solid #ccc!important;border-radius:2px;margin-top:10px}
.poup_form_row .poup_form_label{width:30%;align-items:center;display:flex;justify-content:flex-start;padding-left:5px}
.cal_result_container{background:#f8f8f8;border-radius:2px;padding:0 20px 20px 20px;margin-left:10px}
.long-short-radio{display:flex;border:1px solid #ccc;border-radius:3px}
.long-short-radio>div{width:50%;height:28px;line-height:28px;cursor:pointer;text-align:center;border-radius:2px}
.active-long{background:#d45858;color:#fff}
.active-short{background:#25796a;color:#fff}
.rise-green-body .active-long{background:#25796a}
.rise-green-body .active-short{background:#d45858}
.long-short-radio>.active{background:#d45858;color:#fff}
.poup_form_input{margin-left:10px;width:200px;position:relative;overflow:hidden}
.poup_form_input_right_icon{width:auto!important;margin-right:5px}
.poup_form_input>*{width:100%}
.poup_form_input>.inputRate{border:none!important;text-align:right;color:#888}
.cal_btn{background:var(--brandColor);color:#fff;height:36px;line-height:36px;border:none;cursor:pointer;width:120px;margin-top:20px;border-radius:2px}
.cal_res_label{color:#a6a6a6;margin-top:10px}
.ws-quality-container img{border:none!important;height:14px;margin-top:-5px}
#show_close_pos_table{width:100%;border:1px solid #e4ebf0}
#show_close_pos_table th{color:#8f95a8;font-weight:400;text-align:center;text-transform: capitalize;}
#show_close_pos_table td{text-align:center}
#show_close_pos_table td:first-child,#show_close_pos_table th:first-child{text-align:left}
#show_close_pos_table td:last-child,#show_close_pos_table th:last-child{text-align:right}
#show_close_pos_table tbody tr{height:30px;line-height:30px}
.dark-body .cal_noty_tabtitle{border:none}
.available-wrap {color: var(--color-text-2);}
.flex-center-align{display:flex;align-items:center;color: var(--color-text-1);}
.f-usdt-total-sw{width:12px;transform:rotate(90deg);cursor:pointer}
.f-usdt-orderbook-total{display:flex;justify-content:flex-end;align-items:center}
.order-sum-triangle-future{width:0;height:0;border-right:10px solid rgba(0,0,0,.8);border-top:10px solid transparent;border-bottom:10px solid transparent;position:absolute;left:-10px;top:25px}
.warning-msg{border-radius:5px;padding:10px;background:#fff5f5;-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;color:#d45858;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;font-size:12px}
.warning-msg .common-tags{margin-right:2px}
.estimate-close-price{margin-bottom:10px}
.estimate-close-price .price-value{font-weight:600}
.estimate-close-price span{margin-right:5px}
.futures-input-container{border-radius: 5px;padding:0 8px;}
.futures-input-container .b-unit{flex:none}
#order-position-container{margin:10px 0;position: relative;}
#order-position-container .gate-select{min-width: auto;}
.futures-input-container span{font-size:14px;color: var(--color-text-2); }
.close-type-select span{border-bottom:2px solid transparent;line-height:30px;cursor:pointer}
.close-type-select .active{color:var(--brandColor);border-color:#949494}
.futures-input-container{display:flex;justify-content:space-between;border-radius:2px;height:40px;box-sizing:border-box;align-items:center;font-size:12px;background: var(--color-card-1);position: relative;border: 1px solid transparent;}
.futures-input-container:focus{border:1px solid var(--brandColor)}
.futures-input-container.disabled .disabled-span,.futures-input-container.disabled input{color:#ccc}
.futures-input-container input{flex:auto;border:none;outline:0;padding-right:2px;text-align:right;min-width:80px;background-color: transparent;}
.dark-body #left-bar .futures-input-container {
  background-color: #23282E!important;
  border-color:transparent!important
}
.classic-dark #left-bar .futures-input-container{
  background: var(--color-card-1) !important;
  border-color:transparent!important
}
.classic-dark .futures-input-container, .classic-dark .futures-input-container input{
  background: transparent!important;
}
.plus-minus-btn{margin-left:4px;height:36px;border-left:1px solid #ccc;align-items:center;display:flex}
.plus-minus-btn span{padding:2px;cursor:pointer;font-size:20px;padding:0;height:20px;line-height:20px;width:36px;display:inline-block;text-align:center}
.plus-minus-btn span:last-child{border-left:1px solid #ccc}
.percent-choose-btn-future{margin-left:4px}
.percent-choose-btn-future span{border-left:1px solid #ccc;line-height:38px;width:36px;text-align:center;display:inline-block;padding:0 4px;cursor:pointer}
.percent-choose-btn-future span.active{border:1px solid var(--brandColor)!important;color: var(--brandColor);}
.percent-choose-btn-future span.active+span{border-left:none}
.percent-choose-btn-future span:last-child{border-bottom-right-radius: 6px;border-top-right-radius: 6px;}
.close-confirm-btn{border:none;outline:0;background:var(--brandColor);color:#fff;padding:0 10px;cursor:pointer;border-radius:2px;height:36px;line-height:36px;min-width:120px}
.mt20{margin-top:20px}
.pos-reducible{color:#a6a6a6;margin-top:6px}
.pos-reducible span{margin-right:4px}
.close-position-detail-row{display:flex;justify-content:space-between;margin-top:10px}
.close-position-detail-row .label{color:#a6a6a6}
#stop-order-noty-container .futures-input-container{padding:0 8px}
#stop-order-noty-container .noty_body{margin:46px 9px 0}
#stop-order-noty-container .noty_title {padding-left: 22px;}
#stop-order-noty-container .m_con,#stop-order-noty-container 
#stop-order-noty-container .dealbox{margin-bottom:0}
.double-container .futures-input-container{width:calc((100% - 8px)/ 2)}
.double-container{display:flex;justify-content:space-between}
.compare-flag{border-right:1px solid #ccc;height:100%;line-height:36px;padding-left:6px;padding-right:12px;margin-right:4px}
.noty_close{cursor:pointer}
.mt24{margin-top:24px}
.mt8{margin-top:8px}
.mt18{margin-top:18px}
.tleft{text-align:left}
#close-position-noty-container .futures-input-container input{text-align:left;padding-left:8px}
#close-position-confirm-noty-container .noty_body,#close-position-noty-container .noty_body{margin:55px 9px 0}
#close-position-noty-container .noty_title{padding-left:16px}
.check-box-group-settings{display:flex;margin-top:18px}
.check-box-group-settings>div{margin-right:10px}
.icon-refresh{display: inline-block;}
.common-tags.redbg{background-color: #e64e62 !important;}
.refresh-table-icon{width: 16px;position: relative;top: -1px;}
.animation-rotate{animation:turn 1s linear infinite;}
 @keyframes turn{
      0%{-webkit-transform:rotate(0deg);}
      25%{-webkit-transform:rotate(90deg);}
      50%{-webkit-transform:rotate(180deg);}
      75%{-webkit-transform:rotate(270deg);}
      100%{-webkit-transform:rotate(360deg);}}
#calculator_btn img{width:14px;margin-right:3px;}

#f-settings img{width:24px;}
.full-pos-set{color:var(--brandColor);font-size: 12px;cursor: pointer;}
.adjust-levergage{padding:0 !important;margin: 10px 0;}
.adjust-levergage span{font-size: 20px;cursor: pointer;height: 100%;line-height: 36px;padding: 0px 12px;}
.adjust-levergage .minus-btn{border-right: 1px solid #ccc}
.adjust-levergage .add-btn{border-left: 1px solid #ccc}
.adjust-levergage input{text-align: center;}
 
/* .delivery-page .contracts-drop-down-table td:first-child{padding-right: 10px;min-width: 140px;}
.delivery-page .contracts-drop-down-table th:last-child{min-width: 30px;} */
.delivery-page .top-bar-right{left:250px}
.en-body .delivery-page .top-bar-right{left: 316px}
/* .en-body .delivery-page .contracts-drop-down-table td:first-child{min-width: 152px;} */
.noty_row_button_row{width: 210px;display: flex;flex-direction: row;justify-content: space-between;}
.noty_row_button{width: 80px;height: 20px;border: 1px solid #CCCCCC; border-radius: 4px;display: flex;justify-content: center;align-items: center;cursor: pointer;line-height: 10px;}
.noty_row_button_row .active{color: var(--brandColor);border-color: var(--brandColor);}
#double-content{width: 100%;border-radius: 6px;margin-top: 16px;display: flex;flex-direction: row;font-size: 16px;font-weight: 400;height: 32px;line-height: 13px;}
.double-content-open{cursor: pointer; border: none; outline: none;width: 50%;border-top-left-radius: 6px;border-bottom-left-radius: 6px;background: #F7F7F7;display: flex;justify-content: center;align-items: center;}
.dark-body .double-content-open{background-color: #23282E;color: #E6E6E6;}
.classic-dark .double-content-open{background-color: #23282E;color: #E6E6E6;}
.double-content-open-active{cursor: pointer;border: none; outline: none;width: 50%;border-top-left-radius: 6px;border-bottom-left-radius: 6px;background:  #E64E62 ;color: white;}
.double-content-close{cursor: pointer;border: none;outline: none;width: 50%;border-top-right-radius: 6px;border-bottom-right-radius: 6px;background: #F7F7F7;display: flex;justify-content: center;align-items: center;}
.dark-body .double-content-close{background-color: #23282E;color: #E6E6E6;}
.classic-dark .double-content-close{background-color: #23282E;color: #E6E6E6;}
.double-content-close-active{cursor: pointer;border: none;outline: none;width: 50%;border-top-right-radius: 6px;border-bottom-right-radius: 6px;background:  #007980 ;color: white;}
.rise-green-body .double-content-open-active{background-color: #007980;}
.rise-green-body .double-content-close-active{background-color: var(--brandColor);}
#position-info-select{font-size: 14px;border:none;outline:0}
#position-info-select-content:after{content:"";width:0;height:0;border-width:4px 4px 0;border-style:solid;border-color:#000 transparent transparent;position: absolute;right:0;top:calc(50% - 2px);box-sizing:border-box;margin-left: 3px;}
#position-info-select-content select{outline: 0;-webkit-appearance: none;-webkit-tap-highlight-color: #fff;}
#position-info-select-react{position: absolute;right: 0px;padding-right: 10px;}
.no-data-container{width: 527px;height: 200px;display: flex;flex-direction: column;justify-content: center;align-items: center;color: #A2B4B7;font-size: 16px;}
.no-data-container img{width: 72px;height: 48px;margin-bottom: 14px;}
.contracts-search{height: 32px;border-radius: 4px;margin: 20px;padding: 0 10px;}
.contracts-search img{color:black;width: 20px;height: 20px;}
.contracts-search input{width: calc(100% - 20px) ;height: 100%;border: none;font-size: 13px;}
.contracts-search input{background-color: transparent;}
/* .dark-body input{background-color: #23282E!important;}
.classic-dark input{background-color: #23282E!important;} */
select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;}
select option{color: #000;}
#restoration div{
  width: 100%;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  cursor: pointer;
  white-space: nowrap;
}
#restoration div:hover{
  background-color:#ebf7fc;
}
.ftotal-rect-fenlv-down{
  height: 16px; background: var(--color-funct-2); 
  height: 27px;position: absolute;right: 0;z-index: 0;opacity: 0.08;filter: alpha(opacity=10);transition: all 0.1s;
  overflow: hidden;
}

.ftotal-rect-fenlv-up{
  height: 16px; 
  background: var(--color-funct-3); 
  height: 27px;position: absolute;right: 0;z-index: 0;opacity: 0.08;filter: alpha(opacity=10);transition: all 0.1s;
  overflow: hidden;
}

.rise-green-body #future-main-root .ftotal-rect-fenlv-down{background:var(--color-funct-3) !important; }
.rise-green-body #future-main-root .ftotal-rect-fenlv-up{background:var(--color-funct-2) !important;}

@keyframes downKeyframes {
  0% { background-color: rgb(0,121,128,0.2);}
  100% { background-color: none;}
}
@keyframes upKeyframes {
  0% { background-color: rgb(233,58,61,0.2);}
  100% { background-color: none;}
}
.upAnimation{
  animation: upKeyframes 0.5s linear 
}
.downAnimation{
  animation: downKeyframes 0.5s linear 
}
.en-body .upAnimation{
  animation: downKeyframes 0.5s linear 
}
.en-body .downAnimation{
  animation: upKeyframes 0.5s linear 
}

#ftotal-with-bid{
  overflow: hidden;
}
.hiddenScrollY{
  overflow-y: hidden!important;
}
.hiddenScrollY:hover{
  overflow-y: scroll!important;
}
#window-list-bid>div::-webkit-scrollbar { width: 0!important;}
#ask-list::-webkit-scrollbar { width: 0}
#bid-list::-webkit-scrollbar { width: 0}
#window-list-ask,#window-list-ask li{transform:rotate(180deg);-ms-transform:rotate(180deg);-moz-transform:rotate(180deg);-webkit-transform:rotate(180deg);-o-transform:rotate(180deg);z-index: 3;direction: ltr}
/* #bid-list:hover{ overflow-y: hidden} */
#bid-list li{ padding-right: 0}

.sorting-icon{position:relative;}
.sorting-icon i{display:inline-block;width:0;height:0;border-style:solid;border-width:4px;position:absolute;left:3px}
i.sorting-icon-up{border-color:transparent transparent #B0AFB1 transparent;}
i.sorting-icon-down{border-color:#B0AFB1 transparent transparent transparent;top:7px}
i.sorting-icon-up.active{border-color:transparent transparent var(--brandColor) transparent}
i.sorting-icon-down.active{border-color:var(--brandColor) transparent transparent transparent}
.cp{cursor: pointer;}

.common-popup-wrapper {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1001;
  display: flex;
  overflow-y: scroll;
  height: 100%;
  background: rgba(0, 0, 0, .7)
}

.common-popup-main-adjust-leverage {
  box-sizing: border-box;
  margin: auto;
  padding: 24px;
  width: 350px;
  border-radius: 5px;
  background: #fff
}
.common-popup-main-confirm-leverage{
  margin: auto;
  padding: 24px;
  border-radius: 5px;
  background: #fff
}
.confirm-leverage-subtitle{font-size: 14px;margin-bottom:10px}
.confirm-leverage-body{min-height:100px;margin-top: 20px;}
.confirm-leverage-title{display: flex;flex-direction: row;justify-content: space-between;font-size: 18px;}
.stop-popup-main {
  box-sizing: border-box;
  margin: auto;
  padding: 24px;
  width: 384px;
  border-radius: 5px;
  background: #fff
}
.popup-btn{
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  text-align: center;
  margin-top: 20px;
}
.popup-btn button{
  border: 0;
  outline: none;
  cursor: pointer;
}
.popup-primary{
  padding: 0px 16px ;
  min-width: 28px;
  color: white;
  background: var(--brandColor);
  border-radius: 5px;
  margin-left: 16px;
  cursor: pointer;
  height: 32px;
  line-height: 32px;
}
.popup-cancel{
  padding: 6px 16px ;
  min-width: 28px;
  color: #333333;
  border-radius: 5px;
  cursor: pointer;
  border:1px solid #E6E6E6 !important;
  background-color: transparent;
}
.dark-body .popup-cancel{color: #E6E6E6;}
.classic-dark .popup-cancel{color: #E6E6E6;}
.popup-header {
  color: #111;
  font-size: 18px;
  justify-content: space-between
}

.popup-header img {
  width: 18px;
  height: 18px;
  cursor: pointer;
  object-fit: cover
}

.no-scroll {
  overflow: hidden;
  width: 100%;
  height: 100%
}
.leverage-model-item{
  padding: 5px 9px;
  background: #EEEEEE;
  border-radius: 4px;
}
.leverage-model .active{
  background: var(--brandColorOpacity);
  border: 1px solid var(--brandColor);
  color: var(--brandColor);
}
.ml8{
  margin-left: 8px;
}
#progress-input{background-color: white;position: absolute;left: -10px;}
.common-popup-main-adjust-leverage .btn-primary{width: 100%!important;border-radius: 4px!important;}
.popup-common-main{padding: 10px;}
.progress-buy-sell{font-size: 12px; color: #999999;}
.leverage-set-right{margin-left: 25px;display: flex;align-items: center;}
.leverage-set{display: flex;flex-direction: row;align-items: center;justify-content: space-between;padding: 3px 8px; background: #FCEDEF;margin: auto 0;color:var(--brandColor);font-size: 12px;border-radius: 4px;}
.upside-triangle{width: 0;height: 0;border-right: 5px solid transparent;border-left: 5px solid transparent;border-top: 5px solid var(--brandColor);}
.progress-bar-wrapper{padding-top:12px}
.progress-outer{display:flex;width:100%;height:4px;border-radius:2px;background:var(--color-card-1);cursor:pointer;align-items:center}
.dark-body .progress-outer{background-color: #2D333B;}
.classic-dark .progress-outer{background-color: #2D333B;}
.progress-inside{height:4px;background:var(--brandColor) }
.progress-dots{position:relative;top:-8px;pointer-events:none}
.dot-item{display:inline-block;box-sizing:border-box;width:10px;height:10px;border-radius:50%;background:var(--brandColor);border: 1px solid #ffffff;}
.dot-item.no-cover{border:2px solid var(--color-card-1);background:var(--color-card-1)}
.dark-body .dot-item.no-cover {background-color: #2D333B;border-color: #2D333B;}
.classic-dark .dot-item.no-cover {background-color: #2D333B;border-color: #2D333B;}
.progress-point-future{position:relative;left:-4px;z-index:1;margin-right:-6px;width:14px;height:14px;border:2px solid var(--brandColor) ;border-radius:50%;background:#fff;cursor:move}
.leverage-mode-item{}
.asset-row{display: flex;flex-direction: row;justify-content: space-between;margin-top: 8px;font-size:12px ;align-items: center;color: var(--color-text-2);}
.order-position-percent{position: absolute;height: 100%;right: 8px;width: 100%;display: flex;flex-direction: row;align-items: center;justify-content: flex-end;font-size: 12px;}
/* .dark-body .order-position-percent{background-color: #23282E;}
.classic-dark .order-position-percent{background-color: #23282E;} */
.order-poup-body{
  width: 350px;
  margin: auto;
  padding: 24px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  background: #fff;
}
.order-poup-name{font-size: 14px;color: rgba(102, 102, 102, 1);}
.red-text{color:rgba(224, 58, 55, 1)}
.order-popup-confirm-btn{width: 100%;color: white;padding: 10px 0;text-align: center;font-size: 14px;background-color: rgba(222, 89, 89, 1);border-radius: 2px;margin-top: 20px;}
.remind-row{margin-top: 20px;color: rgba(153, 153, 153, 1);}
.stop-price-row{display: flex;flex-direction: row;justify-content: space-between;font-size: 12px;align-items: center;color:var(--color-text-1)}
.mantine-ryylig .protip{color:var(--color-text-1)}
.stop-price-row .gate-select{height: 15px;}
.stop-price-row .gate-select-slot{height: 15px;line-height: 15px;}
.stop-price-row input{margin-right: 4px;}
.predict-type{display: flex;flex-direction: row;align-items: center;}
.predict-type>div>div{padding-top: 0px!important;margin: 0px!important;}
.predict-type>div>div>div{margin: 0px;margin-right: 8px;}
.predict-type input{border-color: #cccccc;}
.fz12{font-size: 12px;}
.fz18{font-size: 18px;}
.risk-noty-main{
  margin: auto;
  padding: 24px;
  width: 700px;
  border-radius: 5px;
  background: #fff
}
.risk-noty-main .noty_title{font-size: 18px;border-bottom: none;}
.cloum-divi{width: 1px;height: 12px;background-color: rgba(221, 221, 221, 1);margin:0 5px}
.gray-color{color: rgba(128, 139, 136, 1);}
.auto-price-row{display: flex;justify-content: space-between;height: 32px;margin-top: 10px;}
.auto-price-item{display: flex;justify-content: center;align-items: center;font-size: 12px;height: 100%;width: 45%;border-radius: 6px;color:#333333 ;border: 1px solid #E6E6E6;}
.auto-price-item.active{color:var(--brandColor);border-color: var(--brandColor);}
.dark-body .auto-price-item{background-color: #23282E; color: #E6E6E6;border-color: #23282E;}
.classic-dark .auto-price-item{background-color: #23282E; color: #E6E6E6;border-color: #23282E;}
.dark-body .auto-price-item.active{color:var(--brandColor);border-color: var(--brandColor);}
.classic-dark .auto-price-item.active{color:var(--brandColor);border-color: var(--brandColor);}
.bottom-position-table{width: 100%;}
.options-pagination{height:32px;text-align:center;line-height:32px;position: relative;}
.options-pagination-btn{display:inline-block;margin-right:8px;padding:0 12px;height:32px;border-radius:6px;line-height:33px;cursor:pointer}
.options-pagination-btn.active{border-radius:4px;background:#f2f2f2;color:var(--brandColor)}
.dark-body .options-pagination-btn.active{color: var(--brandColor);background-color: #2D333B;}
.classic-dark .options-pagination-btn.active{color: var(--brandColor);background-color: #2D333B;}
.position-fast-close{display: flex;position: relative;}
.fast-close-input{border-radius: 2px;height: 26px;position: relative;}
.fast-foucs-tips{
  position: absolute;
  padding: 8px;
  background-color: #000;
  color: #fff;
  white-space: nowrap;
  font-size: 12px;
  border-radius: 4px;
  bottom: 31px;
  left: 50%;
  transform: translate(-50%,0%);
  display: none;
  z-index: 3;
}
.fast-close-input:focus-within .fast-foucs-tips{display: block;}
.fast-foucs-tips::after{
  display: block;
  content: '';
  position: absolute;
  border: solid 5px;
  border-top-color: #000;
  border-left-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  right: 50%;
  transform: translateX(50%);
  bottom: -10px;
}
.percent-popup{position: absolute;top:55px;width: 252px;height: 42px;display: flex;flex-direction: row;justify-content: space-around;align-items: center;background-color: #FFFFFF;z-index: 10;border-radius: 4px;box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);}
.percent-popup div{
  cursor: pointer;
  border-radius: 2px;
  width: 56px;height: 26px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
  background-color: #F7F7F7;
}
.percent-popup div:hover{
  background: rgb(35,84,230,0.1);
  color: var(--brandColor);
}
.dark-body .percent-popup{background-color: #2D333B;}
.classic-dark .percent-popup{background-color: #2D333B;}
.dark-body .percent-popup div{background-color: #23282E;}
.classic-dark .percent-popup div{background-color: #23282E;}

.fast-close-input input{
  background:none;  
	outline:none;  
	border:none;
  height: 100%;
  width: 42px;
  padding: 0 4px;
  text-align: center;
  background-color: var(--color-bg-1);
}
.dark-body .fast-close-input input{background-color: var(--color-bg-1) !important;}
.classic-dark .fast-close-input input{background-color: var(--color-bg-1) !important;}
.fast-close-btn{ 
  border-radius: 4px;
  border:none;
  cursor: pointer;
  padding: 0px 4px;
  height: 24px;
  display: flex;
  flex-direction: row;
  align-items: center;
  line-height: 13px;
  background-color: rgb(35, 84, 230,0.1);
}
.fast-close-header{
  display: inline-flex;
  flex-direction: row;
  justify-content: flex-start;
}
.ml24{margin-left: 24px;}
.position-stop-body{
  width: 520px;
  margin: auto;
  padding: 24px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  background: #fff;
  font-size: 12px;
}
.position-stop-type{
  border-radius: 6px;
  border: 1px solid #DDDDDD;
  margin-right: 10px;
  padding: 0 10px;
  min-width: 60px;
}
.delete-row{
  display: flex;
  flex-direction: row;
  align-items: center;
}
.position-stop-type:after{
  margin-right: 10px;
}
.position-stop-input{
  background:transparent;
	outline:none;  
	border:none;
  flex: auto;
}
.classic-dark .position-stop-input{background:transparent!important;}
.dark-body .position-stop-input{background:transparent!important;}
.position-stop-input-container{
  border: 1px solid #DDDDDD;
  border-radius: 6px;
  flex: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0 10px;
  height: 36px;
}
.stop-popup-tips{
  border-radius: 6px;
}
.stop-popup-red-tips{
  background: rgba(222, 89, 89, 0.1);
  border-radius: 6px;
  padding: 10px;
  display: flex;
  justify-content: flex-start;
  color: var(--warningColor);
  font-size: 12px;
}
.tips-red-back{background: rgba(222, 89, 89, 0.1);padding: 10px;}
.br6{border-radius: 6px;}
.padding010{padding: 0 10px;}
.black-color{color: #111111;}
.delete-icon{width: 20px;}
.common-popup-title{display: flex;flex-direction: row;justify-content: space-between;font-size: 18px;}
.disabled-back{display: flex;flex: auto;padding:0 10px;height: 34px;line-height: 34px;border-top-left-radius: 6px;border-bottom-left-radius: 6px;}
.auto-stop-row{padding-right: 10px; flex: auto;}
.auto-stop-row input{background-color: transparent;}
.auto-stop-row .cloum-divi{margin-left: 0;}
.force-close-body{
  width: 350px;
  margin: auto;
  padding: 24px;
  border-radius: 5px;
  background: #fff;
  font-size: 12px;
  color: #666666;
}
.force-close-item{
  display: flex;
  margin-top: 10px;
  justify-content: space-between;
}
.close-all-position-btn{
  padding: 0 16px;
  border-radius: 4px;
  height: 24px;
  font-size: 12px;
  cursor: pointer;
  color: var(--brandColor);
  font-family: none;
  display: flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
}
.en-body .close-all-position-btn{margin-left: 16px;}
.set-popup-body{
  box-sizing: border-box;
  height: 100%;
  padding-bottom: 150px;
  overflow-y: scroll;
}
.set-popup-body::-webkit-scrollbar {
  width: 0px;

}
.set-popup-title{
  padding: 24px;
  border-bottom: 1px solid #F0F0F0;
  font-size: 18px;
  display: flex;flex-direction: row;justify-content: space-between;
}
.set-tab{
  width: 122px;
  border-right: 1px solid #f0f0f0;
}
.dark-body .set-tab{border-color: #31373D;}
.classic-dark .set-tab{border-color: #31373D;}
.set-tab-item{
  width: calc(100% - 24px) ;
  height: 50px;
  display: flex;
  align-items: center;
  padding-left: 24px;
  cursor: pointer;
}
.set-tab-item:hover{
  background: #F7F7F7;
}
.dark-body .set-tab-item:hover{background-color: #23282E;}
.classic-dark .set-tab-item:hover{background-color: #23282E;}
.set-tab .active{
  background: #F7F7F7;
}
.dark-body .set-tab .active{background-color: #23282E;}
.classic-dark .set-tab .active{background-color: #23282E;}
.set-content{
  position: relative;
}
.set-popup-detail{
  padding: 16px 0px;
}

/* .set-content .stop-popup-red-tips{
  width: 100%;

} */
.set-content .styled-checkbox+label span{
  font-size: 14px;
}
.set-btn-row{
  position: absolute;
  right: 24px;
  bottom: 24px;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.set-cancel-btn{
  background-color: #FFFFFF;
  padding: 9px 32px ;
  border-radius: 5px;
  border: 1px solid #E6E6E6;
  cursor: pointer;
  font-size: 16px;
  margin-left: 16px;
}
.dark-body .set-cancel-btn{background-color: transparent; border-color: #4F555C;color:#E6E6E6}
.classic-dark .set-cancel-btn{background-color: transparent; border-color: #4F555C;color:#E6E6E6}
.set-primary-btn{
  padding: 9px 32px ;
  color: white;
  background: var(--brandColor);
  border-radius: 5px;
  border:none;
  cursor: pointer;
  font-size: 16px;
  margin-left: 16px;
}
.dark-body .set-switch-row{
  color: #E6E6E6;
}
.classic-dark .set-switch-row{
  color: #E6E6E6;
}
.set-switch-row{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.set-switch-row .trade-second-showall:checked+.vr-btn:after{ content: ' '; font-size: 1.5em; position: absolute; background: var(--brandColor)!important}
.set-switch-row .trade-second-showall:disabled+.vr-btn:after{ background: rgb(233, 236, 239)!important;cursor: not-allowed;}
.set-switch-row .vr-btn{margin: 0!important;background: #bbc8cb !important}
.stop-popup-body{
  width: 650px;
  margin: auto;
  padding: 24px;
  border-radius: 5px;
  background: #fff;
  font-size: 12px;
}
.stop-order-content{
  width: 261px;
  height: 147px;
  background: #F8F8F8;
  border-radius: 8px;
  padding: 16px;
  display: flex;
  flex-direction:column;
  justify-content: space-between;
  color: rgba(128, 139, 136, 1)
}
.stop-row-flex-between{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.stop-row-flex-center{
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.main-order{
  margin: 0 auto;
}
.fork-png{
  display: block;
  width: 337px;
  margin: 0 auto;
}
.stop-order-content>div{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.stop-input-content{
  background: rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  height: 28px;
  display: flex;
  align-items: center;
  width: 70px;
  padding: 0 5px;
}
.stop-order-type-content .gate-select{
  height: 28px;
  line-height: 28px;
}
.stop-order-type-content .gate-select-slot{
  height: 28px;
  line-height: 28px;
}
.stop-input-content input{
  flex: 1;
  overflow: hidden;
}
.input-no-css{
  background-color: transparent;
  border:none;
  outline: 0;
}
.stop-order-type-content{
  background: rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  min-width: 70px;
  display: block!important;
  /* flex-direction: row;
  justify-content: flex-end !important; */
  height: 28px;
  padding: 0 5px;
}
.row-divi{
  height: 1px;
  background: #F0F0F0;
  margin-top: 24px;
  margin-bottom: 24px;
}
.classic-dark .row-divi{
  background: #31373D
}
.position-stop-auto{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
}
.position-table-auto{
  height: 24px;
  padding: 0px 8px;
  background: var(--brandColor);
  margin-left: 5px;
  color: white;
  font-size: 12px;
  border-radius: 4px;
  white-space: nowrap;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 13px;
}
.close-all-row{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-top: 10px;
  margin-bottom: 10px;
}
.close-all-name{
  width: 35%;
}
.close-all-size{
  width: 20%;
}
.close-all-error{
  width: 35%;
  text-align: right;
}
.close-all-table{
  width: 100%;
  max-height: 200px;
  overflow: auto;
}
.one-fork{
  height: 20px;
  width: 5px;
  background: #F8F8F8;
  margin: 0 auto;
}
.tright{text-align:right;}
.disabled-color{
  
  background: #F7F7F7;
}
.order-conditions-checkbox-container div:first-child{
  margin-left: 0px !important;
}
.no-table-data{color:#999999;text-align:center;font-size:14px;margin-top: 40px;}
.dark-body .no-table-data{ color: #91979E;}
.classic-dark .no-table-data{ color: #91979E;}
.auto-order-left{
  display: flex;
  align-items: center;
  flex-direction: row;
}
.auto-input{max-width: 115px;}

.auto-order-divi{
  width: 1px;
  height: 16px;
  background-color: #E6E6E6;
  margin: 8px;
}
.dark-body .auto-order-divi{background-color: #4F555C;}
.classic-dark .auto-order-divi{background-color: #4F555C;}
.price-type-select-right{
  padding-right: 20px;
  cursor: pointer;
  white-space: nowrap;
  position: relative;
}
.price-type-select-right span{
  height: 16px;
  width: 16px;
  position: absolute;
}
.tac{
  text-align: center;
}
.position-stop-number{
  text-align: right;
}
.position-close-header{
  width: 250px; 
}
.position-stop-header{
  width: 190px;
}
.pr20{padding-right: 20px;}
.pad5{
  padding-top: 5px;
  padding-bottom: 5px;
}
.noorder{
  width: 120px;
  height: 120px;
  margin: 0 auto;
  background: url('/images/noorder.svg') center center no-repeat;
  background-size: cover;
  margin-top: 10px;
}
.tar{text-align: right!important;}

.trade-second-showall{display: none;}
.trade-second-showall  + .vr-btn{background-color: #bbc8cb;padding:5px;border-radius: 50px;display: inline-block;position: relative;margin: 6px 2px 0 0;float: left;-webkit-transition: all 0.1s ease-in;transition: all 0.1s ease-in;width: 20px;height: 5px;cursor:pointer;}
.trade-second-showall + .vr-btn:after{ content: ' '; position: absolute; top: 0; -webkit-transition: box-shadow 0.1s ease-in; transition: box-shadow 0.1s ease-in; left: 0; width: 100%; height: 100%; border-radius: 100px}
.trade-second-showall + .vr-btn:before{content: ' ';position: absolute;background: white;top: 1px;left: 1px;z-index: 3;width: 13px;-webkit-transition: all 0.1s ease-in;transition: all 0.1s ease-in;height: 13px;border-radius: 100px;}
.trade-second-showall:active + .vr-btn:before{ width: 15px}
.trade-second-showall:checked:active + .vr-btn:before{ width: 15px; left: 16px}
.trade-second-showall:checked + .vr-btn:before{ content: ' '; position: absolute; left: 16px; border-radius: 100px}
.trade-second-showall:disabled + .vr-btn:before{ cursor: not-allowed;}
.trade-second-showall:checked + .vr-btn:after{content: ' ';font-size: 1.5em;position: absolute;background: #26999e;}
.trialfund-back{
  background-image: url(/images/trialfund.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  height: 88px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  margin-bottom: 20px;
  font-weight: bold;
}
.trialfund-left{
  
}
.trialfund-title{
  font-size: 14px;
  display: flex;
  flex-direction: row;
  align-items: center;
  color: #462008;
  margin-bottom: 5px;
}
.trialfund-title img{
  display: inline;
  margin-bottom: 1px;
}
.trialfund-money{
  margin-top: 2px;
  font-size: 22px;
  color: #E64E62;
  text-shadow: 0px 1px 1px rgba(94, 87, 88, 0.3);
}
.trialfund-go-draw{
  height: 23px;
  background: #FFFFFF;
  border-radius: 13px;
  padding: 3px 8px 0px 12px;
  cursor: pointer;
  font-size: 16px;
  color: #462008;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.trialfund-go-draw img{
  height: 6px;
  margin-left: 5px;
  margin-bottom: 2px;
}
.faq-text{
  text-align: right;
}
.ul-width{
  /* width: 284px; */
  display: flex;
  flex-direction: row;
  /* justify-content: space-between; */
  align-items: center;
  padding-right: 16px;
}
.future-bottom-table.cur_tab0 .ul-width{margin-right: 42px;}

.en-body .ul-width{width: auto;justify-content: flex-end;}
.ru-body .ul-width{width: auto;justify-content: flex-end;}
#received-future-btn{
  display: flex;
  position: relative;
  cursor: pointer;
  height: 40px;
  background-image: url(/images/rewards/receive_contract.png);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 100%;
  align-items: center;
  text-align: center;
  margin-top: 20px;
  border-radius: 4px;
}

#received-future-btn .received-future-text{
  width: 100%;
  box-sizing: border-box;
  padding: 0px 5px 0 80px;
  font-size: 14px;
  color: #FFF;
  line-height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cn-body #received-future-btn .received-future-text{
  padding-right: 25px;
}

#received-future-btn .received-future-text span{
  display: inline-block;
  max-width: calc(100% - 10px);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-top: 4px;
}

#received-future-btn .received-future-text span b{
  font-size: 22px;
}

#received-future-btn .received-future-text i{
  font-style: normal;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  line-height: 16;
  padding-top: 4px;
  margin: 2px 2px 4px 3px;
  border-radius: 50%;
  box-sizing: border-box;
  border: 1px solid #91281E;
  font-size: 12px;
}

#received-future-btn .received-future-desc{
  padding: 11px 17px;
  width: unset;
  max-width: 400px;
  min-height: 48px;
  background: rgba(0, 0, 0, 0.6);
  border-radius: 3px;
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  position: absolute;
  min-width: 315px;
  top: 50px;
  right: 0;
  display: none;
  text-align: left;
}

#received-future-btn .received-future-desc::before{
  content: '';
  width: 100%;
  height: 15px;
  top: -15px;
  right: 0;
  position: absolute;
}

#received-future-btn:hover .received-future-desc{
  display: block;
}

#received-future-btn .received-future-desc p{
  margin: 0;
}

#received-future-btn .received-future-desc a {
  color: #fff;
  border-bottom: 1px dashed #fff;
  padding-bottom: 2px;
}

#bonus-rule-popup-shade{
  display:none;
  position: fixed;
  top:0;
  left:0;
  z-index: 99998;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.8);
}

.bonus-rule-popup{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.bonus-rule-popup-content{
  width: 730px;
  background-color: #fff;
  border-radius: 6px;
  padding: 22px 25px;
  box-sizing: border-box;
}

.classic-dark .bonus-rule-popup-content,.dark-body .bonus-rule-popup-content{
  background-color: #1a1a1a;
}

.classic-dark .bonus-popup-container table,.classic-dark .bonus-popup-container table tr th,.classic-dark .bonus-popup-container table tr td,
.dark-body .bonus-popup-container table,.dark-body .bonus-popup-container table tr th,.dark-body .bonus-popup-container table tr td{
  border-color: #333;
}

.bonus-popup-header{
  font-size: 18px;
  font-weight: bold;
  line-height: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}

.close-popup-btn{
  width: 17px;
  height: 17px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  top: -60px;
  right: 3px;
}

.close-popup-btn::before, .close-popup-btn::after{
  position: absolute;
  content: '';
  display: block;
  width: 24px;
  height: 2px;
  background: #959595;
  transform: rotateZ(-45deg);
}

.close-popup-btn::after{
  transform: rotateZ(45deg);
}

.bonus-popup-container table,
.bonus-popup-container table tr th,
.bonus-popup-container table tr td { border:1px solid #E4EBF0; }

.bonus-popup-container table { 
  width: 680px; 
  min-height: 200px; 
  line-height: 18px; 
  text-align: center; 
  border-collapse: collapse;
  font-size: 14px;
  font-weight: bold;
}

.bonus-popup-container table .bonus-num,.bonus-popup-footer a{
  color: #DC5567;
}

.bonus-popup-container table tr td:last-child:not(.table-header-title){
  width: 75%;
  text-align: left;
  padding: 5px 15px 5px 15px;
  font-weight: normal;
  color: #797A7F;
}

.bonus-popup-footer{
  text-align: center;
  margin-top: 23px;
}
.buysell{
  padding: 16px;
  height: 100%;
  box-sizing: border-box;
  overflow: auto;
}
#sellButton{
  background-color: var(--color-funct-2);
  cursor: pointer;
}

.rise-green-body #sellButton{
  background-color:  var(--color-funct-3);;
  cursor: pointer;
  font-weight: 600;
}

#buyButton{
  background-color: var(--color-funct-3);
  cursor: pointer;
  font-weight: 600;
}

.rise-green-body #buyButton{
  background-color: var(--color-funct-2);;
  cursor: pointer;
}

.asset-container{
  padding: 16px;
  height: 100%;
  box-sizing: border-box;
}

#future-main-root input[type="checkbox"]{
  border:1px solid var(--color-divider-1) !important;
  border-radius: 2px;
  background-color:  var(--color-card-2) !important;
}

#future-main-root input[type="checkbox"]:hover{
  border-color: var(--brandColor);
}

#future-main-root input[type="checkbox"]:checked{
  background-color: var(--brandColor)!important;
  border:none!important;
}
.mantine-checkbox-label{
  padding-left: 8px!important;
}
/* .remind-row input[type="checkbox"]{
  border:1px solid #999999!important
}
.remind-row input[type="checkbox"]:checked{
  background-color: var(--brandColor)!important;
  border:none!important;
}
.ul-width input[type="checkbox"]{
  border:1px solid #999999!important
}
.ul-width input[type="checkbox"]:checked{
  background-color: var(--brandColor)!important;
  border:none!important;
} */
.trade-second-showall-span{
  font-size: 14px;
}
.margin-edit-ico{
  color: #999999;
}
.underline{
  text-decoration: underline;
}
.unlog-btn{
width: 100%;
height: 32px;
background-color: var(--brandColor);
border-radius: 4px;
display: flex;
justify-content: center;
align-items: center;
color: white!important;
font-size: 14px;
margin-top: 16px;
}
.unlog-btn a{
  color: #FFFFFF;
}
.not-longin{
  color:#999999;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 auto;
  margin-top: 40px;
}
.not-longin img{
  width: 120px;
  margin-bottom: 8px;
}
.not-longin a{
  color: var(--brandColor)!important;
}
.gate-select:after{
  display: none!important;
}
.noty_buttons{

}
.noty-btn-cancel{
  width: auto!important;
  padding: 6px 18px!important;
  min-width: 64px!important;
  border: 1px solid #E6E6E6!important;
  color: #333333!important;
  background-color: transparent!important;
  margin: 0 !important;
  font-size: 14px!important;
}
.noty-btn-ok{
  padding: 6px 18px!important;
  min-width: 64px!important;
  margin-left: 16px!important;
  background-color: var(--brandColor)!important;
  font-size: 14px!important;
}
.one-white #noty_body input[readonly]{
  color: #CCCCCC;
  background: #F7F7F7;
}
.noty_title_tip{
  border-radius: 9px;
  font-size: 12px!important;
}
.futures-mortgage-borrow .noty_title {position: absolute;top: 0;left: 0;height: 60px;width: 100%;font-size: 18px;line-height: 60px;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;padding: 10px;-webkit-box-sizing: border-box;box-sizing: border-box}
.futures-mortgage-borrow #noty_body{
  margin-top: 60px;
}
.cryptoloan-gradient-bar{

  background: linear-gradient(270deg, var(--brandColor) 0%, var(--color-funct-2) 100%);
  border-radius: 4px;
}
.popup-container{
  border-radius: 5px;
  background: #fff;
  margin: auto;
  border-radius: 7px;
}
.popup-title{
  display: flex;flex-direction: row;justify-content: space-between;font-size: 18px;
  padding: 14px 24px;
  border-bottom:  1px #F0F0F0 solid;
}
.dark-body .popup-title{border-color: #31373D;}
.classic-dark .popup-title{border-color: #31373D;}
.no-back-tips{
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  color: var(--brandColor);
}
.red-back-tips{
  padding: 8px 24px 8px 16px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  border-radius: 4px;
  color: var(--warningColor);
  background-color: #FCEDEF;
}
.classic-dark .red-back-tips{
  background-color: #382228;
}
.mantine-radio-group-root input[type="radio"]:checked{
  background-color: transparent!important;
  border-color:var(--brandColor)!important;
}
.mantine-radio-group-root input[type="radio"]:hover{
  border-color:var(--brandColor)!important;
}
.mantine-radio-group-root input[type="radio"]:checked::before{
  background-color: var(--brandColor)!important;
}
.input-gray-border{
  border: 1px solid #E6E6E6;
}
.over-hidden{
  overflow: hidden;
}
.position-stop-body .gate-select-slot{
  padding-right: 0px;
  display: flex;
  align-items: center;
}
.btn-primary.dp-noty-btn{
  margin-left: 16px;
}
.tif-select{
  width: 100px;
  top: 45px;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  background-color: #FFFFFF;
}
.classic-dark .tif-select,.dark-body .tif-select{
  background-color: #2d333b;
}

.classic-dark .tif-select .disabled{
  background-color: #666B70
}
.dark-body .tif-select .disabled{
  background-color: #666B70
}
.tif-select div{
  height: 24px;
  padding: 8px 16px;
  font-size: 14px;
  line-height: 24px;
  cursor: pointer;
}
.tif-select div:hover{
  padding: 8px 16px;
  background-color:  var(--color-card-1);
}
.tif-select .active{
  background-color: var(--color-card-1);
}
.tif-select .disabled{
  color: #CCCCCC;  
  cursor: not-allowed;
}
.tif-select-right{
  height: 40px;
  line-height: 40px;
  color: var(--color-text-1);
}
.tif-select-right span{
  height: 16px;
  width: 16px;
  margin-left: 8px;
  color: var(--color-text-3);
}

.price-type-select{
  position: absolute;
  right: 0;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  background-color: #FFFFFF;
  z-index: 20;
  margin-top: 42px;
}
.price-type-select div{
  height: 24px;
  padding: 8px 16px;
  font-size: 14px;
  line-height: 24px;
  cursor: pointer;
}
.price-type-select div:hover{
  padding: 8px 16px;
  background-color: #F7F7F7;
}
.price-type-select .active{
  background-color: #F7F7F7;
}
.price-type-select .disabled{
  color: #CCCCCC;  
  cursor: not-allowed;
}

.classic-dark .price-type-select{
  background-color: #161A1E;
}
.dark-body .price-type-select{
  background-color: #161A1E;
}
.classic-dark .price-type-select div:hover{
  background-color: #23282E
}
.dark-body .price-type-select div:hover{
  background-color: #23282E
}
.classic-dark .price-type-select div.active{
  background-color: #23282E
}
.dark-body .price-type-select div.active{
  background-color: #23282E
}
.classic-dark .price-type-select .disabled{
  background-color: #666B70
}
.dark-body .price-type-select .disabled{
  background-color: #666B70
}

#deal-exchanged{
  font-size: 14px;
  color: var(--color-text-1);
  margin-left: 5px;
  cursor: pointer;
}
#order_last_price .iconfont{
  /* margin-left: 2px; */
  font-size: 14px;
}

#loan_situation_div_new {height: 27px;width: 100%;position: relative;border: none;}
.loan_situation_side_new {width: 25px;height:25px;float: left;margin:0 5px;text-align: center;line-height:25px;font-weight: 600;}
#loan_situation_side_bid_new {margin: 0;border:1px solid var(--color-funct-3);color:var(--color-funct-3);}
#loan_situation_side_ask_new {margin: 0;border: 1px solid var(--color-funct-2);color: var(--color-funct-2);}

/* .dark-body #loan_situation_side_bid_new {border-color: #F0435A;color: #F0435A;}
.classic-dark #loan_situation_side_bid_new {border-color: #F0435A;color: #F0435A;}

.dark-body #loan_situation_side_ask_new {border-color: #0BBA80;color: #0BBA80;}
.classic-dark #loan_situation_side_ask_new {border-color: #0BBA80;color: #0BBA80;} */

#loan_situation_progress_new {height: 27px;width: 100%;box-sizing: border-box;padding: 0px 23px;}
#loan_situation_progress_new>div{font-size: 12px;}
#loan_situation_progress_bid_new {background-color: rgba(230, 78, 98, 0.2);float:left;color: var(--color-funct-3);height:27px;line-height:27px;;box-sizing: border-box;}
#loan_situation_progress_ask_new {background-color: rgba(0, 121, 128, 0.2);float:left;color: var(--color-funct-2);height:27px;line-height:27px;text-align: right;box-sizing: border-box;}

.rise-green-body #loan_situation_side_bid_new{border-color: var(--color-funct-2);color: var(--color-funct-2);}
.rise-green-body #loan_situation_side_ask_new{border-color: var(--color-funct-3);color: var(--color-funct-3);}
.rise-green-body #loan_situation_progress_bid_new{background-color: rgba(0, 121, 128, 0.2);color: var(--color-funct-2);}
.rise-green-body #loan_situation_progress_ask_new{background-color: rgba(230, 78, 98, 0.2);color: var(--color-funct-3);}
.loan_situation_progress_bid_new_text{
  position: absolute;
  left: 33px;
  font-weight: 600;
}
.loan_situation_progress_ask_new_text{
  position: absolute;
  right: 33px;
  font-weight: 600;
}
.loan_situation_side_new{
  border-radius: 4px;
  background-color: #FFFFFF;
  position: absolute;
  width: 25px!important;
}
.dark-body .loan_situation_side_new{background-color: #161A1E;}
.classic-dark .loan_situation_side_new{background-color: #161A1E;}
#loan_situation_side_bid_new{
  left: 0px;
}
#loan_situation_side_ask_new{
  right: 0px;
}
#bid-cost{
  text-align: right;
}
.futures-input-container:focus-within{
  border-color: var(--brandColor)!important;
}
@media screen and (max-width:1560px){
  body,html{font-size:12px}
  .order-conditions-cbox{margin-left:5px}
  .order-conditions-checkbox_stop .order-conditions-cbox { margin-left: 0; }
  .right-top-tools{margin-right: 10px;margin-left: 0px!important;}
  .right-top-container{width: 272px;}
  .left-bar{width: 272px;}
  #right-top-container{width: 272px;}
  .future_jiaoyi_btn{width: 116px;}
  .btn-group>div{width: 116px;}
  /* .future-bottom-table-title{font-size: 12px;} */
  .trade-second-showall-span{font-size: 12px;}
  .contract-info-indicator{margin-left: 10px;}
  .right-top-tools>div{margin-left: 12px;}
  .leverage-set-right{margin-left: 15px;}
  /* .future-bottom-table-title li{padding: 0 8px;} */
  /* .ul-width{width: 255px;} */
  /* .close-all-position-btn{margin-left: 16px;} */
  .tradingview-container{height: 654px;}
}
 @media screen and (max-width:1640px){

  /* .en-body .future-bottom-table-title li{padding: 0 8px;} */
  .en-body .ul-width{width: auto;justify-content: flex-end;}
  .en-body .close-all-position-btn{margin-left: 16px;}
}
.dark-body .order-type-sw .active span{
  border: none!important;
}
.classic-dark .order-type-sw .active span{
  border: none!important;
}
.future-com-back{
  background-color: #FFFFFF;
}
.classic-dark .future-com-back,.dark-body .future-com-back {
  background: #11141E;
}
.classic-dark .future-main{
  background-color: #0C0E0F;
}
.dark-body .future-main{
  background-color: #0C0E0F;
}

.border-F0F0F0{
  border-color: #F0F0F0;
}
.dark-body .border-F0F0F0{border-color: #31373D;}
.classic-dark .border-F0F0F0{border-color: #31373D;}
.background-color-FCEDEF{background-color: var(--branColorOpacityDark);}
.background-color-F7F7F7{background-color: #f7f7f7}
.background-color-C2C4CC{background-color: #C2C4CC}
.dark-body .background-color-C2C4CC{background-color: #292F40}
.classic-dark .background-color-C2C4CC{background-color: #292F40}
.common-popup-body{
  margin: auto;
  padding: 24px;
  border-radius: 5px;
  background: #fff;
  box-sizing:border-box
}
.color-333{
  color: #333333;
}
.color-666 {
  color: #666666;
}
.color-999 {
  color: #999999;
}

/* .not-longin img{
  filter: invert(0.8);
} */
#follow-us-container{
  padding: 16px;
  box-sizing: border-box;
  height: 100%;
}
.follow-us{
  margin-top: 16px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.follow-btn{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  font-size: 14px;
}
.classic-dark .popup-tooltips-content svg.popup-arrow, .protips-content .popup-arrow{
  color: #23282E !important;
}
.dark-body .popup-tooltips-content svg.popup-arrow, .protips-content .popup-arrow{
  color: #23282E !important;
}

#future-main-root{
  width: 100%;
  background: #F8FAFD;
  padding-top: 4px;
}
.classic-dark  #future-main-root{
  background: #000;
}

.react-grid-layout{
  background-color: var(--color-card-1);
}
.classic-dark .react-grid-layout{
  background-color: #0C0E0F;
}
.dark-body .react-grid-layout{
  background-color: #0C0E0F;
}
.react-grid-item{
  overflow: hidden;
  /* background-color: #fff; */
}
.future-bottom-table{
  height: 100%;
  /* overflow-y: scroll; */
}
.drag-handle{

}
.rgl-drag-zone {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: -webkit-grab;
  cursor: grab;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 17px;
  position: absolute;
  right: 0;
  top: 0;
  width: 17px;
  z-index: 1;
}
.rgl-drag {
  background-color: #959dad;
  border-radius: 4px;
  display: block;
  height: 2px;
  position: absolute;
  right: 0;
  width: 6px;
}
.rgl-drag:after, .rgl-drag:before {
  background-color: #959dad;
  border-radius: 4px;
  content: "";
  display: block;
  height: 2px;
  position: absolute;
  right: 0;
  width: 6px;
  
}
.rgl-drag:before{transform: translateY(-6px);}
.rgl-drag:after{transform: translateY(6px);}
header{z-index: 999!important;}
.nowrap{white-space: nowrap;}
button:focus{box-shadow: none!important;}
.drop-down-div{position: relative;}
.drop-down-select-right{
  cursor: pointer;
  white-space: nowrap;
  position: relative;
}
.drop-down-select-right span{
  height: 16px;
  width: 16px;
}
.drop-down-select{
  position: absolute;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  background-color: #FFFFFF;
  right: 0px;
  z-index: 20;
}
.drop-down-select div{
  height: 24px;
  padding: 8px 16px;
  font-size: 14px;
  line-height: 24px;
  cursor: pointer;
  white-space: nowrap;
  min-width: 80px;
}
.drop-down-select div:hover{
  padding: 8px 16px;
  background-color: #F7F7F7;
}
.drop-down-select .active{
  background-color: #F7F7F7;
}
.drop-down-select .disabled{
  color: #CCCCCC;  
  cursor: not-allowed;
}

.classic-dark .drop-down-select{
  background-color: #161A1E;
}
.dark-body .drop-down-select{
  background-color: #161A1E;
}
.classic-dark .drop-down-select div:hover{
  background-color: #23282E
}
.dark-body .drop-down-select div:hover{
  background-color: #23282E
}
.classic-dark .drop-down-select div.active{
  background-color: #23282E
}
.dark-body .drop-down-select div.active{
  background-color: #23282E
}
.classic-dark .drop-down-select .disabled{
  background-color: #666B70
}
.dark-body .drop-down-select .disabled{
  background-color: #666B70
}
.display-inline{
  display: inline-block;
}
.set-popup-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
}
.dark-body .set-popup-row{
  color: #E6E6E6;
}
.classic-dark .set-popup-row{
  color: #E6E6E6;
}
.set-popup-sw{display:flex;flex-direction: row;justify-content: space-between;font-size: 14px;padding: 0px 10px;}
.set-popup-sw>div{width: 33%;display: flex;justify-content: center;align-items: center;color:#666666;position: relative;padding-bottom: 5px;}
.set-popup-sw span{cursor: pointer;}
.set-popup-sw .active{
  color: #333333;
}
.dark-body .set-popup-sw>div{
  color: #B6BBC2;
}
.classic-dark .set-popup-sw>div{
  color: #B6BBC2;
}
.dark-body .set-popup-sw .active{
  color: #E6E6E6;
}
.classic-dark .set-popup-sw .active{
  color: #E6E6E6;
}
.set-popup-sw .active::after{
  content: '';
  width: 24px;
  height: 3px;
  background: var(--brandColor);
  border-radius: 2px;
  position: absolute;
  left: calc(50% - 12px);
  bottom: 0px;
}
.dark-body .com-fonts{
  border: none!important;
}
.classic-dark .set-popup-sw .active span{
  border: none!important;
}
.dark-body .com-fonts{
  color:#E6E6E6;
}
.classic-dark .com-fonts{
  color:#E6E6E6;
}
.user-layout-content{display: flex;flex-wrap: wrap;}
.layout-item{padding: 10px;display: flex;flex-direction: column;align-items: center;width: 116px;}
.layout-pic{border:2px  solid transparent;border-radius: 4px;cursor: pointer;height: 78px;width: 116px;display: flex;align-items: center;justify-content: center;position: relative;}
.layout-item .active{border:2px  solid #3877ff;}
.layout-pic:hover{border:2px  solid #3877ff;}
.layout-pic:hover .layout-opt{display: flex;}
.layout-pic:hover img{
  opacity:0.4;
}
.layout-opt{position: absolute;display: none;justify-content: space-between;width: 116px;top:0px}
.layout-item-name{padding: 8px 0px;}
.layout-opt .icon-back{background-color: #6c6c6c;color: #fff;z-index: 100;}
.layout-opt .icon-back:hover{background-color: #3877ff;}
.layout-tooltips-content,.protips-content{

  border: none !important;
  box-shadow: none !important;
  color: #fff !important;
  background: rgba(0,0,0,0.8) !important;
  padding:10px !important;
  font-size: 12px;
  z-index: 9999999 !important;
  border-radius: 4px;
}
.layout-tooltips-content.widthauto-content,.protips-content.widthauto-content{width:auto !important}
.layout-tooltips-content svg.popup-arrow, .protips-content .popup-arrow{
    color:rgba(0, 0, 0, 0.8);
    stroke-width: 2px;
    stroke-dasharray: 30px;
    stroke-dashoffset: -54px;
  }
  .classic-dark .layout-tooltips-content svg.popup-arrow, .protips-content .popup-arrow{
    color: #23282E !important;
  }
  .dark-body .layout-tooltips-content svg.popup-arrow, .protips-content .popup-arrow{
    color: #23282E !important;
  }
  .set-divi{
    width: 100%;
    background-color: #f0f0f0;
    height: 1px;
  }
  .classic-dark .set-divi{
    background-color: #31373D;
  }
  .dark-body .set-divi{
    background-color: #31373D;
  }
  #future-main-root{
    min-height: 600px;
  }
.classic-dark .common-title-text{
  border: none!important;
}
.fix-text{
  position: relative;
  top:0.1em;
  margin-right: 4px;
}
.popup-body-400{
  width: 400px;
  margin: auto;
  padding: 24px;
  border-radius: 5px;
  background: #fff;
  font-size: 12px;
}
.edit-input-container{
  border: 1px solid #DDDDDD;
  border-radius: 6px;
  flex: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0 10px;
  height: 36px;
}
.edit-input-container:focus-within{
  border-color: var(--brandColor)!important;
}
#trade-market-tabs{font-size: 16px;height: 52px;line-height: 52px;background: var(--color-card-2);margin:0;display: flex;justify-content:flex-start;align-items: flex-end;color: var(--color-text-1);font-size: 14px;border-bottom: 1px solid var(--color-divider-2);}
#trade-market-tabs .item{padding: 0 16px;cursor: pointer;width: 148px;display: flex;justify-content: start;position: relative;height:100%;align-items: center;}
#trade-market-tabs .item.active{background: var(--color-card-3);}

.mtabs-close{cursor: pointer;font-size: 14px;display: none;position: absolute;right: 8px;color: var(--color-text-4);}
.market-tabs-name-row{height:20px}
#trade-market-tabs .item:hover .mtabs-close{display: block;}
#trade-market-tabs .item.active .mtabs-close{display: block;}
#trade-market-tabs.length-1 .mtabs-close{display: none !important;}
.market-price-row-scroll{height: 12px;line-height: 12px;font-size: 12px;margin-left: 10px;display: flex;flex-direction: column;}
#multichart-container{height: calc(100% - 31px);margin:0;}
#multichart-container *{box-sizing: border-box;}
.mcharts-innner-container{display: flex;flex-wrap: wrap;height: 100%;background: #f0f0f0;justify-content: space-between;}
.multichart-single-container{width: calc((100% - 1px)/2);height:calc((100% - 2px)/2);position: relative;background: #fff;border:1px solid transparent;}
.multichart-single-container:nth-child(2),.multichart-single-container:nth-child(4){margin-left:1px;}
.multichart-single-container.active{border-color:var(--brandColor);}
.mode-switchicon{width:40px;text-align: center;position: relative;}
.mode-switchicon:hover .mode-switchicon-dropdown{display: block !important;}
.mode-switchicon-dropdown{
  display: none;
  z-index: 1;
  border-radius: 2px;
  border: 1px solid #eee;
  position: absolute;
  top: 29px;
  width: 100px;
  background-color: #fff;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  height: 88px;
  padding-top: 4px;
  box-sizing: border-box;
}
.en-body .mode-switchicon-dropdown{width: 120px;}
.mode-switchicon-dropdown li{height: 40px;padding-left:16px;text-align: left;box-sizing: border-box;cursor: pointer;font-size: 14px;}
.mode-switchicon-dropdown li>.icon{margin-right: 8px;}
.mode-switchicon-dropdown li:hover{background: #F7F7F7;}
.single-tv-chart-title{height: 34px;display: flex;justify-content: space-between;padding:0px 16px;align-items: center;}
.single-tv-chart{height:calc(100% - 34px);padding: 0 16px 16px 16px;}
.title-market-name{font-size: 14px;margin-right: 8px;}
.title-name-price{font-size: 12px;margin-right: 8px;}
.title-right-icons svg{font-size: 16px;cursor: pointer;margin-left: 8px;}
.tv-time-select{width: 214px;background: #FFFFFF;box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);border-radius: 8px;padding:16px;font-size: 12px;position: absolute;right: 0;top: 34px;z-index:1}
.tv-time-select>div{align-items: flex-start;margin-top: 16px;justify-content: flex-start;}
.tv-time-select>div:first-child{margin-top: 0;}
.tv-time-select ul{display: flex;flex-wrap: wrap;}
.tv-time-select li{width: 48px;height: 24px;line-height: 24px;background: #F7F7F7;border-radius: 12px;margin-left:8px;text-align: center;cursor: pointer;}
.tv-time-select li.active{background: #FCEDEF;color:var(--brandColor);}
.empty-chart-tips{
  width: 250px;
  height: 100px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  pointer-events: none;
  text-align: center;
  line-height: 100px;
}
.en-body .tv-time-select{width:250px;}
.en-body .time-type{width: 40px;}
#klineMode {
  display: flex;
  justify-content: space-between;
  margin-top: 0px;
  margin-bottom: 0px;
  position: initial;
  height: 28px;
}
.interval-btn{
  padding:0 8px;
  font-size: 12px;
  display: flex;
  align-items: center;
}
.kline_line_type_list_box{
  z-index: 999;
  top:20px
}
#restoration {
  width: auto;
  display: none;
  padding: 5px;
  position: absolute;
  top:0px;
  left: 0px;
  background-color: #fff;
  color: #4c525e;
  border-radius: 3px;
  box-shadow: rgb(0 0 0 / 25%) 0 3px 8px;
  z-index: 9999;
}
#restoration-value{
  position: relative;
  border: 1px solid var(--brandColor);
  border-radius: 4px;
  justify-content: center;
  font-size: 12px;
  height: 20px;
  line-height: 20px;
}
#restoration-value:hover #restoration{
  display: block;
  
}
.interval-box{
  position: relative;
  width: 48px;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 15px;
  margin-left: 8px;
  margin-top: 8px;
  cursor: pointer;
}
.interval-box img{
  width: 16px;
  height: 16px;
  position: absolute;
  right:-5px;
  top:-4px
}
.interval-edit{
  z-index: 999;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.edit-box{
  display: flex;
  flex-direction: column;
  box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  padding: 16px 12px;
  position: absolute;
  top:28px;
  z-index:9999;
  background-color: white
}

.dark-body .edit-box{
  background-color: #2D333B;
}
.classic-dark .edit-box{
  background-color: #2D333B;
}
.edit-box-opt{
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  cursor: pointer;
}
.edit-box-row{
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.edit-box-left{
 
}
.edit-box-right{
  width: 170px;
  display: flex;
  flex-direction: column;

}
.edit-box-right-item{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.edit-box-left-1{
 margin-top: 13px;
}
.edit-box-left-2{
  margin-top: 54px;
}
.edit-box-left-3{
  margin-top: 53px;
}
.scale7{
  display: block;
  transform: scale(0.7);
}
#kline_line_type{
  cursor: pointer;
  padding: 0 5px;
  display: flex;
  align-self: center;
}
#future-full-screen{height: calc(100% - 60px)}
.k-line-bg-logo{
  width: 200px;
  height: 73px;
  background-image: url(/images/gateio_h_en.png);
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  pointer-events: none;
  opacity: 0.1;
  filter: grayscale(1);
}
.fullscreen-btn{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 8px;
}
.popup-tooltips-content{
  padding: 8px!important;
  width: auto!important;
  max-width: 240px;
}
.classic-dark .mode-switchicon-dropdown{
  border: none;
  background-color: #2D333B;
}
.dark-body .mode-switchicon-dropdown{
  border: none;
  background-color: #2D333B;
}
.classic-dark #trade-market-tabs,.dark-body #trade-market-tabs{
  background: var(--color-card-2);
}

.classic-dark #trade-market-tabs .item.active,.dark-body #trade-market-tabs .item.active{
  background: var(--color-card-3) !important;
}

.classic-dark .multichart-single-container{
  background-color: #161A1E!important;
}
.dark-body .multichart-single-container{
  background-color: #161A1E!important;
}
.background-color-2D333B{
  background-color: white;
}
.dark-body .background-color-2D333B{
  background-color: #2D333B;
}
.classic-dark .background-color-2D333B{
  background-color: #2D333B;
}
.dark-body .tv-time-select li{
  background-color: #23282E;
}
.classic-dark .tv-time-select li{
  background-color: #23282E;
}
.myaccount-transfer .noty_title{border-bottom:none !important;}
.margin_rate-container .close-force{font-size: 12px;border-bottom: 1px dashed var(--brandColor);color:var(--brandColor);display: flex;align-items: start;}
.know-warning{
  font-size: 16px;
  color: #fff;
  width: auto;
  padding: 10px;
  display: flex;
  justify-content: center;
  margin-top: 14px;
}
.luna-text{line-height: 23px;}
.warning-tab{display: flex;align-items: center;justify-content: center;background: #FFF3E1;padding: 8px 46px 8px 16px;}
.warning-tab-cloose{position: absolute;right: 14px;pointer-events:unset!important;user-select: unset!important;cursor: pointer;}
.yellow-warning{color:#FF9500}
.warning-text{color:#333}

.future_notice_modal_content span { color: var(--colorFont1); }
.future_notice_modal_content a { color: var(--brandColor); }
.future_notice_modal_content a:hover { color: var(--brandHoverColor); }
.fast-order{
  width: 396px;
  height: 48px;
  background: #FFFFFF;
  box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px;
  position: absolute;
  z-index: 998;
  display: flex;
  top:199px;
  left: 645px;
}
.dragg-handle{
  width: 16px;
  background: #E6E6E6;
  border-radius: 3px 0px 0px 3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  cursor: pointer;
  padding-top: 10px;
  padding-bottom: 10px;
}
.classic-dark .dragg-handle{background: #4F555C}
.dragg-handle>span{
  line-height: 2px;
}
.fast-order-bid{
  width: 120px;
  height: 48px;
  background: var(--color-funct-3);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  cursor: pointer;
}
.rise-green-body .fast-order-bid{
  background-color:  var(--color-funct-2);
}
.fast-input{
  width: 120px;
  height: 48px;
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #999;
}
.classic-dark .fast-input{
  background-color: #23282E;
  color: #91979E;
}
.fast-input>input{
  width: 100%;
  text-align: center;
  color: #333;
  text-overflow:ellipsis;
}
.classic-dark .fast-input>input{
  color: #E6E6E6;
  background: inherit;
}
.fast-input>input::placeholder{
  color: #ccc;
}
.classic-dark.fast-input>input::placeholder{
  color: #666B70;
}
.fast-order-ask{
  width: 120px;
  height: 48px;
  background: var(--color-funct-2);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  cursor: pointer;
}
.rise-green-body .fast-order-ask{
  background: var(--color-funct-3);
}
.fast-order-close{
  width: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.classic-dark .fast-order-close{
  background-color: #2D333B;
  color: #fff;
}
.k-line-bg-logo-img{
  width: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  pointer-events: none;
  opacity: 0.15;
  filter: grayscale(1) brightness(1) invert(0.4);
}
.fast-tip{
  color: #fff;
  background: rgba(0,0,0,0.85);
  font-size: 12px;
  border-radius: 4px;
  z-index: 999;
  padding: 8px;
  position: absolute;
  top: 8px;
  right: calc(100% + 10px);
  width: auto;
  white-space: nowrap;
}
.fast-tip::before {
  display: block;
  content: '';
  position: absolute;
  border: solid 10px;
  border-top-color: transparent!important;
  border-left-color: rgba(0,0,0,0.85)!important;
  border-right-color: transparent!important;
  border-bottom-color: transparent!important;
  right: -18px;
  top: 50%;
  transform: translateY(-50%);
}
#f-settings{position: relative;width: max-content;}
#toolsMenu{z-index: 1000;}
.pl16{padding-left: 16px;}
th .drag-icon{
  visibility: hidden;
  display: inline-flex;
  cursor: move;
  margin-left: 4px;
  box-sizing: border-box;
  margin: 0px;
  min-width: 0px;
  font-size: 12px;
  width: 1em;
  height: 1em;
  margin-left: 3px;
}
.position-table th:hover .drag-icon{
  visibility:visible;
}
.position-table th{display: flex;align-items: center;}
.position-table{width: 100%;}
.react-grid-layout{user-select: none;}
.drag-hover{
  border-left: 1px solid var(--brandColor);
}
.sort-icon-div{display: inline-flex;flex-direction: column;color:#ccc}
.sort-icon-div .icon-arrow_up_noodle{
  width: 9px;
  height: 7px;
  transform:scale(0.3, 0.3);
}
.sort-icon-div .icon-arrow_down_noodle{
  position: relative;
  top: -1px;
  width: 9px;
  height: 7px;
  transform:scale(0.3, 0.3);
}
.sort-color{color:var(--brandColor)}
.stop-auto-switch span{position: relative;}
.stop-auto-switch .active::after{
  content: '';
  width: 32px;
  height: 3px;
  background: var(--brandColor);
  border-radius: 2px;
  position: absolute;
  left: calc(50% - 16px);
  bottom: -15px;
}
.position-stop-body .icon-arrow_down_noodle{
  display: inline-block;
  margin-bottom: 8px;
}
.stop-input-row-back{
  display: flex;
  flex: auto;
  padding: 0 10px;
  height: 34px;
  line-height: 34px;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6p
}
.warningColor{color : var(--warningColor)}
.hover-red{color: #999999;}
.classic-dark .hover-red{color: #91979E;}
.future-hover-red:hover{color: #E64E62;}
/* 持仓部分列宽规定 */
.position-table .contract{min-width:  110px;flex: 0 0 110px;}
.position-table .size{min-width:80px}
.position-table .value{min-width: 110px}
.position-table .entry_price{min-width: 100px}
.position-table .mark_price{min-width:100px}
.position-table .liq_price{min-width: 122px}
.position-table .maintenance_margin{min-width: 120px}
.position-table .margin{min-width: 110px}
.position-table .initial_margin{min-width: 110px}
.position-table .hbl{min-width: 180px}
.position-table .realised_pnl{min-width: 110px}
.position-table .fast_close{min-width: 300px;display: flex;position: relative;}
.position-table .stop{min-width: 100px}
.position-table .adl_ranking{min-width: 110px}

.display-settings{
  width: 20px;
  height: 20px;
  background-color: var(--brandColor);
  -webkit-mask-image: url("/images/preset.svg");
  mask-image: url("/images/preset.svg");
  position: fixed;
  right: 22px;
  top: 10px;
  cursor: pointer;
}

.position-table th,.position-table td{padding-right: 20px;}
.position-table th span{display: flex;justify-content: center;align-items: center;}
.position-table .fixd-center-column-wrap th,.position-table .fixd-center-column-wrap td {flex:1}
.position-table .fixd-left-column-wrap th:first-child,.position-table .fixd-left-column-wrap td:first-child{
  text-align: left;
  justify-content: flex-start;
}
.position-table .fixd-left-column-wrap{
  display: flex;
  /* flex: 0 0 auto; */
  position: sticky;
  left: 0;
  z-index: 1;
  background:#fff;
  justify-content: space-between;
}

.position-table .fixd-left-column-wrap th:last-child,.position-table .fixd-left-column-wrap td:last-child{
  position: relative;
}
.position-table .fixd-left-column-wrap th:last-child::after{
  content: "";
  position: absolute;
  right: -30px;
  width: 30px;
  height: 100%;
  box-shadow: inset 10px 0 8px -8px rgba(0,0,0,0.0800);
}
.position-table .fixd-left-column-wrap td:last-child::after{
  content: "";
  position: absolute;
  right: -30px;
  width: 30px;
  height: 100%;
  box-shadow: inset 10px 0 8px -8px rgba(0,0,0,0.0800);
}

.classic-dark .position-table .fixd-left-column-wrap th:last-child::after,.classic-dark .position-table .fixd-left-column-wrap td:last-child::after{
  box-shadow: inset 10px 0 8px -8px #2D333B;
}

.position-table .fixd-center-column-wrap{ display: flex;flex: 1;}

.position-table .fixd-center-column-wrap  td:last-child,.position-table .fixd-center-column-wrap  th:last-child{
  padding-right: 30px;
}

.position-table .fixd-right-column-wrap{
  display: flex;
  /* flex: 0 0 auto; */
  position: sticky;
  right: 0;
  z-index: 1;
  background:#fff;
  justify-content: space-between;
}

.position-table .fixd-right-column-wrap th:first-child,.position-table .fixd-right-column-wrap td:first-child{
  position: relative;
}

.position-table .fixd-right-column-wrap th:first-child::after{
  content: "";
  position: absolute;
  left: -10px;
  width: 10px;
  height: 100%;
  box-shadow: inset -10px 0 8px -8px rgba(0,0,0,0.0800);
}
.position-table .fixd-right-column-wrap td:first-child::after{
  content: "";
  position: absolute;
  left: -10px;
  width: 10px;
  height: 100%;
  box-shadow: inset -10px 0 8px -8px rgba(0,0,0,0.0800);
}

.classic-dark .position-table .fixd-right-column-wrap th:first-child::after,.classic-dark .position-table .fixd-right-column-wrap td:first-child::after{
  box-shadow: inset -10px 0 8px -8px #2D333B;
}

.fixedColAndColEqual.position-table  .fixd-left-column-wrap,.fixedColAndColEqual.position-table  .fixd-right-column-wrap{
  flex: 1;
}

.fixedColAndColEqual.position-table  .fixd-left-column-wrap.fixedLeftColsLength1,.fixedColAndColEqual.position-table  .fixd-left-column-wrap.fixedLeftColsLength2{flex:0;}
.fixedColAndColEqual.position-table  .fixd-right-column-wrap.fixedRightColsLength1,.fixedColAndColEqual.position-table  .fixd-right-column-wrap.fixedRightColsLength2{flex:0;}

.position-table .fixd-center-column-wrap:empty{
  display: none;
}

.classic-dark .position-table .fixd-left-column-wrap, .classic-dark .position-table  .fixd-right-column-wrap{
  background-color: #11141E;
}

.classic-dark .position-table .tr-row:hover{
  background: transparent !important;
}

.popup-position-table-set-columns-overlay{
  background: transparent;
}

.popup-position-table-set-columns-content .mantine-switch-root{
  flex-direction: row-reverse;
  margin-bottom:20px;
}

.popup-position-table-set-columns-content .mantine-switch-root:last-child{
  margin-bottom:0;
}

.popup-position-table-set-columns-content  .popup-position-table-content{
  box-shadow: 0px 4px 12px 1px rgba(0,0,0,0.1000);
  border-radius: 8px;
  padding: 16px;
}
.classic-dark .popup-position-table-set-columns-content  .popup-position-table-content{
  background: #2D333B;
}

.popup-position-table-set-columns-content  .popup-position-table-content .display-settings-title{
  font-size: 14px;
  color: var(--color-text-1);
  margin-bottom: 16px;
}

.classic-dark .popup-position-table-set-columns-content  .popup-position-table-content .display-settings-title{
  color: #91979E;
}

.popup-position-table-set-columns-content  .popup-position-table-content .mantine-switch-label{
  color: var(--color-text-2);
  font-size: 14px;
  font-weight: 400;
  flex: 1;
  padding-left: 0;
  padding-right: 30px;
}

.popup-position-table-set-columns-content  .popup-position-table-content .mantine-188xh8t:focus{
  box-shadow: none;
}

.classic-dark .popup-position-table-set-columns-content  .popup-position-table-content .mantine-switch-label{
  color: #91979E;
}


.popup-position-table-set-columns-content  .popup-position-table-content .mantine-switch-input{
  border-radius: 12px;
  background: #EEF1FA !important;
  border: none !important;
}

.classic-dark .popup-position-table-set-columns-content  .popup-position-table-content .mantine-switch-input{
  background-color: #4F555C !important;
}

.popup-position-table-set-columns-content  .popup-position-table-content .mantine-switch-input:checked{
  background-color: var(--brandColor)!important;
}

/* .classic-dark .popup-position-table-set-columns-content  .popup-position-table-content .mantine-switch-input:checked{
  background-color: #4F555C !important;
} */

.popup-position-table-set-columns-content  .popup-position-table-content .mantine-nw5fw3:focus{
  box-shadow: none;
}

.popup-position-table-set-columns-content .popup-position-table-set-columns-arrow{
  display: none;
}

.popup-position-table-set-status-overlay{
  background: transparent;
}
.popup-position-table-set-status-content .mantine-radio-group-root{
  box-shadow: 0px 4px 12px 1px rgba(0,0,0,0.1000);
  border-radius: 8px;
  overflow: hidden;
  min-width: 224px;
  width: auto;
  box-sizing: border-box;
}

.classic-dark .popup-position-table-set-status-content .mantine-radio-group-root{
  background: #2D333B;
}

.popup-position-table-set-status-content .mantine-group-root{
  display: flex;
  flex-direction: column;
  padding-top: 0 !important;
  margin-top: 0px;
  width: 100%;
  margin: 0;
  align-items: flex-start;
}

.popup-position-table-set-status-content .mantine-radio-group-radioWrapper{
  margin: 0;
  height: 44px;
  line-height: 44px;
  padding: 0 16px;
  width: 100%;
}
.popup-position-table-set-status-content .mantine-radio-group-label {
  cursor: pointer;
  width: 100%;
  color: #333;
  font-size: 14px;
}
.classic-dark .popup-position-table-set-status-content .mantine-radio-group-label {
  color: #e6e6e6 !important;
}

.popup-position-table-set-status-content .mantine-radio-group-radio{
  border: none;
  background: transparent;
}

.classic-dark .popup-position-table-set-status-content .mantine-radio-group-radio{
  background: transparent !important;
}

.popup-position-table-set-status-content .mantine-1sdprf3:focus{
  box-shadow: none;
}
.popup-position-table-set-status-content .mantine-radio-group-root input[type="radio"]:checked::before{
  content: url('/images/list_selection.svg');
  background: transparent;
  background-color:transparent !important;
  width: auto;
  height: auto;
  border-radius: 0;
}

.popup-position-table-set-status-content .mantine-radio-group-radioWrapper:hover{
  background: #F2F7FF;
}

.classic-dark .popup-position-table-set-status-content .mantine-radio-group-radioWrapper:hover{
  background: #0F1F4D;
}

.popup-position-table-set-status-content .mantine-is31ic.mantine-ref_labelDisabled_1{
  color: #CCCCCC;
}

.classic-dark .popup-position-table-set-status-content .mantine-wm8e6d.mantine-ref_labelDisabled_1{
  color: #666B70 !important;
}

.popup-position-table-set-status-content .mantine-is31ic.mantine-ref_labelDisabled_1 .mantine-radio-group-radio{
  background: transparent;
}

.popup-position-table-set-status-content .mantine-oxikri:focus{
  box-shadow: none;
}

.popup-position-table-set-status-content .popup-position-table-set-status-arrow{
  display: none;
}


.net-status{
  left: 136px;
  bottom: 0px;
  position: fixed;
  width: 52px;
  height: 34px;
  box-shadow: 0px 0px 24px 1px rgb(0 0 0 / 15%);
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
}
.classic-dark .net-status{
  background-color: #1F2433;
}
.net-status img{width: 20px;height: 20px;}

.net-tips{
  display: none;
  color: #fff;
  background: rgba(0,0,0,0.85);
  font-size: 12px;
  border-radius: 4px;
  z-index: 999;
  padding: 8px;
  position: absolute;
  bottom: 45px;
  width: max-content;
  max-width: 250px;
}

.net-tips::before {
  display: block;
  content: '';
  position: absolute;
  border: solid 10px;
  border-top-color: rgba(0,0,0,0.85)!important;
  border-left-color: transparent!important;
  border-right-color: transparent!important;
  border-bottom-color: transparent!important;
  transform: translateX(50%);
  bottom: -18px;
  right: 50%;
}
.net-status:hover .net-tips{
  display: block;
}
.future-share-container{
  width:552px;
  height:674px;
  border-radius: 16px;
}
.share-back>img{
  width: 520px;
  height: 478px;
  position: absolute;
  left: -24px;
  z-index: -1;
}
.share-back{
  width: 472px;
  height: 478px;
  border-radius: 16px;
  color:#fff;
  position: relative;
  z-index: 1;
}
.share-body{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.share-info{
  margin-top: 128px;
  margin-left: 40px;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.share-future-type{
  padding: 0px 8px;
  background: #3823E6;
  border-radius: 2px;
  border: 1px solid #FFFFFF;
  font-size: 12px;
  margin-left: 8px;
  height: 20px;
  display: flex;
  align-items: center;
}
.share-future-call{
  padding: 0px 8px;
  background: #3823E6;
  border-radius: 2px;
  border: 1px solid #F23D3D;
  font-size: 12px;
  color:#F23D3D;
  margin-left: 8px;
  height: 20px;
  display: flex;
  align-items: center;
}
.share-future-put{
  padding: 0px 8px;
  background: #3823E6;
  border-radius: 2px;
  border: 1px solid #13BF86;
  font-size: 12px;
  color:#13BF86;
  margin-left: 8px;
  height: 20px;
  display: flex;
  align-items: center;
}
.share-both{
  margin-top: 16px;
  margin-left: 40px;
  
}
.both-rate{
  font-size: 48px;
  line-height: 41px;
  font-family: 500;
}
.both-pnl{
  margin-top: 8px;
  font-size: 16px;
}
.share-pnl{
  margin-top: 16px;
  margin-left: 40px;
  font-size: 48px;
}
.share-rate{
  margin-top: 16px;
  margin-left: 40px;
  font-size: 48px;
}
.share-price{
  margin-top: 24px;
  margin-left: 40px;
  display: flex;
}
.share-open{
  width: 184px;
}
.share-mark{
  margin-left: 24px;
}
.share-time{
  margin-top: 40px;
  margin-left: 40px;
  position: absolute;
  bottom: 144px;
}
.check-share{
  margin-top: 24px;
  color:#8D93A6;
  width: 100%;
  padding-left: 40px;
  box-sizing: border-box;
}
.share-checkbox{
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 8px;
  padding-left: 40px;
  box-sizing: border-box;
}
.share-action{
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 24px;
}
.share-copy{
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--brandColor);
  color: #fff;
  border-radius: 4px;
  font-size: 16px;
  width: 224px;
  height: 40px;
}
.share-save{
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--brandColor);
  border: 2px solid var(--brandColor);
  border-radius: 4px;
  font-size: 16px;
  width: 220px;
  height: 36px;
  margin-left: 24px;
}
#app-code{
  width: 70px;
  height: 70px;
  padding: 5px;
  background-color: #fff;
}
.share-code-row{
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-left: 40px;
  position: absolute;
  bottom: 21px;
}
.share-code-text{
  margin-left: 16px;
}
.color-17E5A1{
  color:#17E5A1
}
.share-icon-row{
  display: flex;
  align-items: flex-start;
}
.share-icon-row .icon-dynamic_share{
  margin-left: 8px;
}
.classic-dark .future-share-container{
  background-color: #2d333b;
}
.share-down{display: flex;flex-direction: row;align-items: center;}
.share-down img{height: 9px;width: 9px;}
.order-popup-divi{width: 100%;height: 1px;background-color: #F0F0F0;}

/*底部表格tab合并*/
.bottom-table-title-row{
  margin: 16px 0 0 16px;
  display: flex;
  justify-self: start;
  align-items: center;
}

.bottom-table-title-tab{
  cursor: pointer;
  height: 32px;
  padding: 0 16px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  background: transparent;
  color: var(--color-text-4);
  line-height: 32px;
}
.bottom-table-title-tab:first-child{
  margin-right: 16px;
}
.bottom-table-title-tab.active{
  background-color: #EEF1FA !important;
  color: var(--color-text-1) !important;
}
.classic-dark .bottom-table-title-tab.active{
  background: #000 !important;
}
/*深度合并*/
.order-book-header-tab{
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 32px;
  margin-bottom: 8px;
  align-items: center;
}
.order-book-header-tab-img{
  display: flex;
  align-items: center;
  font-size: 20px;
}
.order-book-header-img{
  width: 20px;
  height: 20px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.order-book-header-img:not(:last-child){
  margin-right: 18px;
}

.btn-icon-right{
  width: 7px;
  height: 16px;
  background: #C2C4CC;
  position: absolute;
  right: 2px;
}

.classic-dark .btn-icon-right{background: #292F40;}

.order-book-header-img.all-market::before{
  content: '';
  display: block;
  height: 7px;
  width: 7px;
  border-radius: 1px;
  background: var(--color-funct-2);
  position: absolute;
  left: 2px;
  top: 11px;
}
.order-book-header-img.all-market::after{
  content: '';
  display: block;
  height: 7px;
  width: 7px;
  border-radius: 1px;
  background: var(--color-funct-3);
  position: absolute;
  left: 2px;
  top: 2px;
}
.order-book-header-img.buy-market::after{
  content: '';
  display: block;
  height: 16px;
  width: 7px;
  border-radius: 1px;
  background: var(--color-funct-3);
  position: absolute;
  left: 2px;
  top: 2px;
}
.order-book-header-img.sell-market::after{
  content: '';
  display: block;
  height: 16px;
  width: 7px;
  border-radius: 1px;
  background: var(--color-funct-2);
  position: absolute;
  left: 2px;
  top: 2px;
}

.rise-green-body .order-book-header-img.all-market::before{ background: var(--color-funct-3);}
.rise-green-body .order-book-header-img.all-market::after{ background: var(--color-funct-2);}
.rise-green-body .order-book-header-img.buy-market::after{ background: var(--color-funct-2);}
.rise-green-body .order-book-header-img.sell-market::after{ background: var(--color-funct-3);}

.order-book-header-img.market-actived{
  background-color: #F2F2F2;
  border-radius: 2px;
}

.classic-dark .order-book-header-img.market-actived{
  background-color: #2D333B;
}

.order-book-header-tab-img > i.market-actived{
  background-color: #F2F2F2;
  border-radius: 2px;
  border-radius: 2px;
}
.order-book-header-tab-img > i:last-child{
  margin-right: 0;
}
.icon-tag-buy{
  color: var(--warningColor);
}
.icon-tag-sell{
  color: #13BF86;
}
.order-book-header-select-root{
  /* width: 108px; */
}
/* .order-book-header-select-root .mantine-select-rightSection{
  width: 8px !important;
} */
.order-book-header-select-drop{
  padding: 0 !important;
  border: none !important;
  box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.1000) !important;
  z-index: 10 !important;
  min-width: max-content;
}
.order-book-header-select-item{
  height: 40px;
  font-size: 14px !important;
  line-height: 40px;
  margin: 0;
  padding: 0 0 0 16px !important;

}
.order-book-header-select-selected{
  background-color: #F7F7F7 !important;
  color: #333333 !important;
}
.order-book-header-select-item:hover{
  background-color: #F7F7F7 !important;
}
.order-book-header-select-input{
  font-size: 12px !important;
  border: none !important;
  text-align: right !important;
  color: var(--color-text-1) !important;
  padding-right: 16px !important;
}
.classic-dark .order-book-header-select-input{
  background-color: transparent !important;
  border: none !important;
}
.classic-dark .order-book-header-select-selected{
  background-color: #23282E !important;
  color: #E6E6E6 !important;
}
.classic-dark .order-book-header-select-item:hover{
  background-color: #23282E !important;
}

.ask-list-all,
.ask-list-all li{
  transform: none !important;
}
.rise-green-body .icon-tag-buy{
  color: #13BF86;
}
.rise-green-body .icon-tag-sell{
  color: var(--warningColor);
}

/* NEW LINE */
.tradeConvenient {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.classic-dark .tradeConvenient svg path {
  stroke: #E6E6E6;
}
.trade-convenient-active-icon path {
  stroke: #2553E6 !important;
}

.trade-convenient-content {
  display: flex;
  flex-direction: column;
  min-height: 130px;
  min-width: 80px;
  width: auto;
}

.trade-convenient-content-box {
  display: flex;
  align-items: center;
  justify-content: space-around;
  border-top: 1px solid #F0F0F0;
}
.classic-dark .trade-convenient-content-box {
  border-top-color: #31373D;
}

.trade-convenient-content-box svg,
.trade-convenient-content-box span {
  padding: 7px 24px;
  cursor: pointer;
  transition: all 200ms ease-in-out;
  user-select: none;
  flex: 1;
  text-align: center;
  min-width: 20%;

  border-right: 1px solid #F0F0F0;
}
.classic-dark .trade-convenient-content-box svg,
.classic-dark .trade-convenient-content-box span {
  border-right-color: #31373D;
}

.classic-dark .trade-convenient-content-box svg path {
  stroke: #E6E6E6;
}

.trade-convenient-content-box span:hover {
  color: var(--brandColor);
  transition: all 200ms ease-in-out;
}
/* re-zero icon */
.trade-convenient-zero-icon:hover path {
  stroke: #2354E6 !important;
  transition: all 200ms ease-in-out;
}
.trade-convenient-content-box span:active,
.trade-convenient-zero-icon svg:active {
  opacity: .7;
}

.trade-convenient-content-box_disabled {
  cursor: not-allowed !important;
}
.trade-convenient-content-box_disabled:hover {
  color: unset !important;
}

/* MODIFT INPUY STYLE */
.trade-convenient-wrapper {
  display: flex;
  flex-direction: column;
}
.trade-convenient-first {
  display: flex;
  align-items: center;
}
.trade-convenient-mb-span {
  margin-bottom: 8px;
}
.trade-convenient-mb2-span {
  margin-top: 16px;
}
.trade-convenient_popover_wrapper:focus,
.trade-convenient_popover_wrapper:focus-visible {
  outline: none !important; 
  box-shadow: none !important;
}

.trade-stop_area_flex {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  position: relative;
}

/* 平仓历史筛选框样式 */
.market_select_wrap{
  margin-left: 15px;
  position: relative;
  margin-top: 6px;
  display: flex;
  min-width: 224px;
  width: auto;
  flex-direction: row;
  justify-content: flex-start;
}

.market_select_wrap>div{
  display: flex;
}

.market_select_wrap .title{
  font-size: 14px;
  position: absolute;
  top: 7px;
  left: 16px;
  z-index: 99;
}

.market_select_wrap #select_marketSelect{
  min-width: 224px;
  width: auto;
}

.market_select_wrap .selector{
  font-size: 14px;
  color: #333;
}

.market_select_wrap .selector .selector-list{
  box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.1000);  
}

.market_select_wrap .selector .selector-view{
  padding: 7px 16px;
  border-color: #E6E6E6;
}

.market_select_wrap .selector .selector-view .icon-down{
  top: 7px;
  color: #D8D8D8;
}

.market_select_wrap .selector .selector-list .selector-search-clear{
  top: 11px;
}

.market_select_wrap .selector .selector-view .val-view{
  text-align: right;
  padding-right: 9px;
  padding-left: 60px;
}

.market_select_wrap .selector .selector-view .val-view span{
  padding-left: 54px;
  color: #C2C5CC;
}

.market_select_wrap  .selector .selector-list ul{
  overflow-y: overlay;
}

.market_select_wrap .selector .selector-list li:hover{
  background: #F7F7F7 !important;
}

.market_select_wrap .selector .selector-list li{
  padding: 12px 16px !important;
}

.market_select_wrap .selector .selector-list input::-webkit-input-placeholder {
  color: #999;
  font-size: 14px;
  font-weight: 400;
}

.market_select_wrap .selector .selector-view svg{
  top: 7px;
  width: 16px;
}

.market_select_wrap .selector .selector-view svg path{
  stroke: #D8D8D8;
}

.market_select_wrap .selector .icon-search{
  color: #ccc;
}

.market_select_wrap .selector .selector-list .selector-search-clear{
  background-image: url('/images/future/close.svg');
}

.classic-dark .market_select_wrap .selector .selector-list.show{
  background: #2D333B;
  color: #e6e6e6;
}

.classic-dark  .market_select_wrap .selector .selector-list li:hover,.classic-dark .market_select_wrap .selector .selector-list li.active{
  background: #23282e !important;
}

.classic-dark   .market_select_wrap  .selector .selector-view{
  background: #161A1E !important;
  border-color: #4F555C !important;
}

.K-kline-reset{
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  margin-left: 8px;
}

.kline-wrap{
  width: 100%;
  height: 100%;
  position: relative;
}

.quickly-order-tips{
  position: absolute;
  max-width: 240px;
  background: var(--brandColor);
  font-size: 14px;
  color: #fff;
  border-radius: 4px;
  padding: 16px;
  z-index: 1;
}

.quickly-order-tips:after{
  position: absolute;
  top: calc(50% - 5px);
  right: -5px;
  content: '';
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid var(--brandColor);
}


.quickly-order-tips.onetips{
  right: 100px;
}

.quickly-order-tips.twotips{
  right: 340px;
}

.quickly-order-tips .title{
  font-weight: 600;
  margin-bottom: 8px;
  font-size: 14px;
}

.quickly-order-tips .title span{
  font-size: 12px;
  margin-left: 8px;
}

.quickly-order-tips .button-tips-wrap{
  float: right;
  margin-top: 8px;
  display: flex;
}

.quickly-order-tips .next-tips{
  background: #FFFFFF;
  border-radius: 4px;
  color: var(--brandColor);
  padding: 3px 8px;
  cursor: pointer;
  font-weight: 600;
}

.quickly-order-tips .previous-tips{
  background: var(--brandColor);
  border-radius: 4px;
  color: #fff;
  border: 1px solid #fff;
  padding: 3px 8px;
  cursor: pointer;
  margin-right: 8px;
  font-weight: 600;
}

.quickly-order-tips .close-tips{
  width: 16px;
  height: 16px;
  background-image: url('/images/future/close_tips.svg');
  position: absolute;
  right: 4px;
  top:4px;
  cursor: pointer;
}

.quickly-orde-wrap{
  z-index: 1;
  position: absolute;
  display: flex;
  background: #FFFFFF;
  width: 260px;
  right: 62px;
  border-radius: 4px;
}

.quickly-orde-wrap .quickly-input{
  width: 120px;
  height: 48px;
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 4px 0 0 4px;
  box-sizing: border-box;
  color: #666;
  border: 1px solid #E6E6E6;
}

.quickly-orde-wrap .quickly-input>input {
  width: 90%;
  text-align: center;
  color: #333;
  text-overflow: ellipsis;
  font-size: 16px;
}

.quickly-orde-wrap .quickly-input>input::-webkit-input-placeholder { 
  color: #ccc;
}

.classic-dark .quickly-orde-wrap .quickly-input>input {
  color: #E6E6E6 !important;
}

.quickly-orde-wrap span{
  margin-bottom: 1px;
}

.quickly-orde-wrap .currentPrice{
  font-size: 16px;
  font-weight: 500;
}

.quickly-orde-wrap  .quickly-order-ask {
  width: 120px;
  height: 48px;
  background: var(--color-funct-2);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  cursor: pointer;
}

.quickly-orde-wrap  .quickly-order-bid {
  width: 120px;
  height: 48px;
  background: var(--color-funct-3);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  cursor: pointer;
}

.rise-green-body .quickly-order-ask {
  background: var(--color-funct-3);
}

.rise-green-body .quickly-order-bid {
  background-color: var(--color-funct-2);;
}

.quickly-orde-wrap  .quickly-order-close {
  width: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  box-shadow: 0px 8px 24px rgb(0 0 0 / 8%);
  border-radius: 0 4px 4px 0;
}

.classic-dark .quickly-input ,.classic-dark  .quickly-order-close{
  background-color: #23282E;
  color: #91979E;
  border:none
}

.classic-dark .quickly-orde-wrap{
  border-style: solid;
  border-color: #23282E;
}

.classic-dark  .quickly-input,.classic-dark .quickly-order-close{
  border-radius: 0;
}

.kline_btn,body.en-body .kline_btn{
  padding: 0 8px;
  display: flex;
  align-items: center;
}

.kline_btn .iconfont{
  color: #8D93A6;
}

.classic-dark .kline_btn .iconfont {
  color: #606880;
}

::-webkit-scrollbar-thumb{
  background: hsla(215,17%,59%,.2);
}

.timeBtns{
  color: var(--color-text-4);
}

.timeBtns .interval-btn.active{
  color: var(--color-text-1);
}

#order-conditions-container .mantine-popover-root{
  width: 100%;
}

.order-tif_popover_wrapper:focus,
.order-tif_popover_wrapper:focus-visible {
  outline: none !important; 
  box-shadow: none !important;
}