@charset "utf-8";
/* CSS Document */
body {background-color:#f2f2f2;}
.header {height:52px; width:100%;  background:#192548;}
.header_content {height:100%; min-width:1280px; width:100%;  margin: auto; position:relative; background:#192548;}
.header_navigator_right {margin-right:20px;}

.coin_info { width:100%; height: 60px; line-height:60px; vertical-align: middle; background-color:#fff;}
.coin_info .s_1 {float:left; font-size:22px; color:#666666 ; margin-left:10px; }
.coin_info .s_1 i{font-size:22px; color:#a0a0a0;}
.coin_info .s_2 {float:left; font-size:20px; color:#00a4f2; margin-left:20px;}
.coin_info .s_3 {float:left; font-size:12px; margin-left:25px; }
.coin_info .s_3 dt {width:100%; height:20px; line-height:20px; margin-top:10px; color:#aaa}
.coin_info .s_3 dd {width:100%; height:20px; line-height:20px; color:#666666}
.coin_info .color_green {color:#00b464;} 
.coin_info .color_red {color:red;} 
                                                  
.coin_24hour {margin-top:0px; padding-bottom:10px; width:100%; height: 30px; line-height:30px; vertical-align: middle; background-color:#fff;}                                                  
.coin_24hour .s_1 {font-size:14px; color:#333; margin-left:10px;} 
.coin_24hour .s_1 i{font-size:14px; color:#a0a0a0;}
.coin_24hour .s_2 {font-size:14px; color:#333; margin-left:36px;}
.coin_24hour .s_2 i{font-size:14px; color:#a0a0a0;}
                                                    
.coin_chart {margin-top:px; width:100%; height:390px;border-right:0px solid #ddd; background-color:#fff;}                                                 
.coin_chart img{width:100; height:320px;}


.coin_content_bottom .item_right_btn_2 {line-height:30px; height:30px; float:left; font-size:14px; margin-left:20px; margin-top:16px;}

.trading_search_bar{ margin-bottom:20px;}
.trading_search_bar ul li{ margin-right:10px; display:inline-block;}
.trading_search_bar ul li select{ height:30px; line-height:30px;}
.trading_search_bar ul li.fr{ margin-right:0px;}
.trading_search_bar .trading_date {width:100px;height:30px; line-height:30px;padding-left:10px; color:#333; cursor: pointer;}
.trading_search_bar .trading_coin {width:100px;height:34px; line-height:34px;padding-left:5px; color:#333;}
.trading_search_bar .trading_type {width:100px;height:34px; line-height:34px;padding-left:5px; color:#333;}

.trading_top {width:100%; height:790px; margin-top:2px; display:flex; }
.trading_top_left {width:23%; min-width:295px; height: 790px; float:left; background:#fff; margin-top:4px; overflow:hidden; border-top-left-radius:0px; }
.trading_top_middle {width:calc(54% - 10px); min-width:680px; margin-top:5px;  margin-left:5px;  float:left;}
.trading_top_right {width:23%; min-width:295px; height: 790px; float:left; margin-top:5px; margin-left:5px; overflow:hidden; border-top-right-radius:0px; }

   
.trading_top_middle .form {float:left; margin-top:5px;}
.trading_top_middle .tab_css {width:calc(50% - 2px); min-width:338px; float: left; height:298px; background-color:#fff;} 
.trading_top_middle .form_content  {width:100%; height:100%; padding-top:5px; float:left; }
.trading_top_middle .form_content .input .coin_code {    color: #aaa; font-size: 12px; position: absolute; right: 60px; top:-2px; }
.trading_top_middle .form_content .label {width:80px; height:30px; line-height:30px; float:left; margin-left:20px; color:#4c4c4c;}
.trading_top_middle .form_content .label_long {width:200px; height:30px; line-height:30px; float:left; margin-left:80px; color:#4c4c4c;}
.trading_top_middle .form_content input { height:28px; line-height:28px; width:calc(100% - 130px); min-width:210px; margin-left:0px;  font-size:12px; color:#4c4c4c; border-radius:0px;  border:1px solid #ddd;} 
.trading_top_middle .form_content select { height:30px; line-height:30px; padding-left:7px; font-size:12px; width:calc(100% - 130px); min-width:210px; margin-left:1px; color:#4c4c4c;   border: 0px; outline: 1px solid #ddd;}
.trading_top_middle .form_content .balance { height:28px; line-height:28px; width:200px; margin-left:110px; padding-left:10px; text-align:right; color:#4c4c4c; }
.trading_top_middle .form_content .total { height:28px; line-height:28px; width:calc(100% - 130px); min-width:210px; margin-left:100px; margin-top:10px; padding-left:0px; border:1px solid #ddd;  text-align:left; }
.trading_top_middle .form_content .input {width:100%; height:30px; line-height:30px; float:left; margin-top:8px; position: relative;}
.trading_top_middle .form_content .percent_content { height:20px; line-height:20px; width:300px; margin-left:60px; }
.trading_top_middle .form_content .percent { height:20px; line-height:20px; width:calc(25% - 20px); min-width:45px; border:1px solid #ddd; color:#4c4c4c; margin-right:8px; float:left; text-align:center; font-size:10px; }
.trading_top_middle .form_content .submit_buy { height:40px; line-height:40px; width:calc(100% - 48px); min-width:292px;  float:left; text-align:center; margin-top:30px; margin-left:20px; background-color:#00b464; color:#fff; border-radius:1px;cursor:pointer;}
.trading_top_middle .form_content .submit_sell { height:40px; line-height:40px; width:calc(100% - 48px); min-width:292px;  float:left; text-align:center; margin-top:30px;  margin-left:20px; background-color:#fb5c4e; color:#fff;border-radius:1px;cursor:pointer;}
.trading_top_middle .form_delimiter {width:1px; height:87%; border-left:1px solid #575757; float:left; margin-top:15px; margin-left:10px; margin-right:10px;}

.trading_top_left .order_list { background:#fff; height:790px; float:left; margin-top:0px; margin-left:0px; width:100% }
.trading_top_left .order_header {width:100%; height:36px; line-height:36px;  border-top:1px solid #eee; border-bottom:1px solid #eee; margin-right:0px; background-color:#fff; }                                                                        
.trading_top_left .order_sell {width:100%;  height:352px;  margin-right:0px;  border-bottom:1px solid #eee; display:flex; flex-direction:column-reverse; }                                     
.trading_top_left .item {color:#666; height:22px; line-height:22px;}                                     
.trading_top_left .order_buy {width:100%;  height:352px;  margin-top:0px; border-top:1px solid #eee;  padding-top:3px; margin-right:0px;}     
.trading_top_left .order_header table{ border-collapse:collapse; height:100%; }
.trading_top_left .order_header table th{ height:100%; line-height:40px; color:#999999;  }
.trading_top_left table{ border-collapse:collapse; }
.trading_top_left table th{border-bottom:0px solid #ddd; height:40px; line-height:40px; }
.trading_top_left table td{background:#FFF; border-bottom:0px solid #efefef; height:22px;  line-height:22px; color:#666; }
.trading_top_left .align_left {text-align:left; padding-left:0px;}
.trading_top_left .align_right {text-align:right; padding-right:20px;}
.trading_top_left .color_green {color:#00b464; padding-left:20px;} 
.trading_top_left .color_red {color:red; padding-left:20px;} 

.trading_label {border:0px solid #ddd; border-bottom:1px solid #ddd; background:#fff;width: 100%;  height: 36px; line-height:36px; margin-top:5px; float: left; text-align:center; font-size:14px; }
.trading_label span {border-bottom:1px solid #0080ff; width:100px; display:block; padding-left:15px; padding-right:15px;}
.trading_list {border:0px solid #ddd; width: 100%; margin-top:5px; height: 100%; background-color:#fff; float: left; margin-left:0px; z-index:100;}
.trading_list .trading_list_header {width:100%; height:36px; line-height:36px;  border-bottom:1px solid #eee; border-top:1px solid #eee; background-color:#fff; }                                                                        
.trading_list .trading_list_content {width:100%; height: 100%; padding-left:15px; overflow:hidden; background-color:#fff;}                                     
.trading_list table{ border-collapse:collapse; margin-top:0px;}
.trading_list table th{ border-bottom:0px solid #ddd; height:36px; line-height:36px; padding-left:15px;}
.trading_list table td{ border-bottom:1px solid #eee; height:24px; line-height:24px;   color:#666}
.trading_list .align_left {text-align:left;}
.trading_list .color_green {color:#00b464;} 
.trading_list .color_red {color:red;} 

.trading_bottom {height:100%; width:100%; margin-top:0px; float:left;}

.my_order_list .content::-webkit-scrollbar{width:4px;  height:4px;  }  
.my_order_list .content::-webkit-scrollbar-track{  background: #ddd;  border-radius:2px;  }  
.my_order_list .content::-webkit-scrollbar-thumb{  background: #aaa;  border-radius:2px;  }  
.my_order_list .content::-webkit-scrollbar-thumb:hover{  background: #747474;  }  
.my_order_list .content::-webkit-scrollbar-corner{  background: #f6f6f6;  }  

.my_order_label {width: 100%;  height: 40px; line-height:40px;   border-bottom:1px solid #eee; background: #fff; float: left; margin-left:0px; margin-top:10px; text-align:center; font-size:14px; }
.my_order_list {border:0px solid #ddd; background: #fff; width: 100%;  height: 460px;  float: left; margin-left:0px; }
.my_order_list .my_header {width:100%; height:40px; line-height:40px;  border-bottom:1px solid #eee; background-color:#fafafa; }                                                                        
.my_order_list .my_content {width:100%; }                                     
.my_order_list table{ border-collapse:collapse; margin-top:0px;}
.my_order_list table th{border-bottom:0px solid #ddd; height:40px; line-height:40px; padding-left:10px; color:#666666}
.my_order_list table td{border-bottom:1px solid #eee; height:24px;  line-height:24px; color:#666; padding-left:10px;}
.my_order_list .align_left {text-align:left; }
.my_order_list .color_green {color:#00b464;} 
.my_order_list .color_red {color:red;} 

.my_trading_history_list .content::-webkit-scrollbar{width:4px;  height:4px;  }  
.my_trading_history_list .content::-webkit-scrollbar-track{  background: #ddd;  border-radius:2px;  }  
.my_trading_history_list .content::-webkit-scrollbar-thumb{  background: #aaa;  border-radius:2px;  }  
.my_trading_history_list .content::-webkit-scrollbar-thumb:hover{  background: #747474;  }  
.my_trading_history_list .content::-webkit-scrollbar-corner{  background: #f6f6f6;  }  

.my_trading_label {width: 100%;  height: 40px; line-height:40px;  float: left; margin-left:0px; margin-top:10px; text-align:center; font-size:14px; }
.my_trading_history_list {border:0px solid #ddd; background: #fff; width: 100%;  height: 460px;  float: left; margin-left:0px; }
.my_trading_history_list .my_header {width:100%; height:40px; line-height:40px;   border-bottom:1px solid #ddd; background-color:#fafafa;}                                                                          
.my_trading_history_list .my_content {width:100%;}                                       
.my_trading_history_list table{ border-collapse:collapse; margin-top:0px;}
.my_trading_history_list table th{ border-bottom:0px solid #ddd; height:40px; line-height:40px;  color:#666; padding-left:10px; }
.my_trading_history_list table td{ border-bottom:1px solid #eee; height:24px;  line-height:24px; color:#666;  padding-left:10px; }
.my_trading_history_list .align_left {text-align:left;}
.my_trading_history_list .color_green {color:#00b464;} 
.my_trading_history_list .color_red {color:red;} 

.my_order_history_list .content::-webkit-scrollbar{width:4px;  height:4px;  }  
.my_order_history_list .content::-webkit-scrollbar-track{  background: #ddd;  border-radius:2px;  }  
.my_order_history_list .content::-webkit-scrollbar-thumb{  background: #aaa;  border-radius:2px;  }  
.my_order_history_list .content::-webkit-scrollbar-thumb:hover{  background: #747474;  }  
.my_order_history_list .content::-webkit-scrollbar-corner{  background: #f6f6f6;  }  

.my_trading_label {width: 100%;  height: 40px; line-height:40px;  float: left; margin-left:0px; margin-top:10px; text-align:center; font-size:14px; }
.my_order_history_list {border:0px solid #ddd; background: #fff; width: 100%;  height: 460px;  float: left; margin-left:0px; }
.my_order_history_list .my_header {width:100%; height:40px; line-height:40px;   border-bottom:1px solid #ddd; background-color:#fafafa;}                                                                          
.my_order_history_list .my_content {width:100%;}                                       
.my_order_history_list table{ border-collapse:collapse; margin-top:0px;}
.my_order_history_list table th{ border-bottom:0px solid #ddd; height:40px; line-height:40px;  color:#666; padding-left:10px; }
.my_order_history_list table td{ border-bottom:1px solid #eee; height:24px;  line-height:24px; color:#666;  padding-left:10px; }
.my_order_history_list .align_left {text-align:left;}
.my_order_history_list .color_green {color:#00b464;} 
.my_order_history_list .color_red {color:red;} 

.my_order_label  ul {padding: 0px; margin: 0px; height: 40px;}  
.my_order_label  li {list-style-type: none; float: left;  font-size:12px; text-align: center;  width: 200px; margin-right:-1px; line-height:40px;  height: 40px;  border-bottom:1px solid #ddd; border-bottom:0px; color:#4c4c4c}  
.my_order_label .current {background-color: #fff;  border-bottom:1px solid #2483ff; color:#2483ff; position:relative;z-index:2;}  
.my_order_label .tab_css {width: 497px;  height: 370px;  background-color: #fff;  display: none;  float: left; border:1px solid #ddd; position:relative;z-index:1; }  


.trading_body {width:100%; min-width:1280px;  margin: auto; }  
.trading_top_right .tab_bar {width: 100%;  height: 28px;  float: left; padding-top:10px; background:#fff; border-bottom:1px solid #eee;}  
.trading_top_right .tab_bar ul {padding: 0px; margin: 0px; height: 32px; margin-left:15px;}  
.trading_top_right .tab_bar li {list-style-type: none; float: left; color:#666; font-size:12px; text-align: center;  width: 68px; margin-right:-1px;  line-height:28px;  height: 28px; }  
.trading_top_right .tab_bar .current {background-color: #fff; color:#2483ff; border-bottom:1px solid #2483ff; position:relative;z-index:2; font-weight: 600;}  
.trading_top_right .tab_css {width: 100%;  background-color: #fff;  display: none;  float: left;  position:relative;z-index:1; }  

.trading_top_right .trading_coin_header {height:36px; line-height:36px; padding-left:15px; margin-top:10px; background-color:#fff }                                                                        
.trading_top_right .trading_coin_content {height:320px; padding-left:15px; margin-top:25px;}
.trading_top_right .trading_coin_search { padding-left:4px; }    
.trading_top_right .search_icon {position:absolute; left:245px; top:13px;}
.trading_top_right .search {position:absolute; right:0px; top:20px;}
.trading_top_right .search_icon i {color:#ddd; }
.trading_top_right .trading_coin_search input { height:30px; line-height:30px;padding-left:10px; width:250px;margin-top:10px;margin-left:10px; border-radius:15px; border:1px solid #ddd; outline:none;}         
.trading_top_right table{ border-collapse:collapse; margin-top:0px;}
.trading_top_right table th{ border-bottom:0px solid #ddd; color:#999; height:36px; line-height:36px; font-size:12px;}
.trading_top_right table td{background:#FFF; border-bottom:0px solid #eee; height:24px; line-height:24px; color:#666; font-size:12px; padding-left:0px;}
.trading_top_right .align_left {text-align:left; }
.trading_coin_content .align_left {padding-left:0px;}
.trading_top_right .color_green {color:#00b464;} 
.trading_top_right .color_red {color:red;} 

.my_content::-webkit-scrollbar, .trading_coin_content::-webkit-scrollbar{    width: 6px;
    height: 6px;
    background-color: transparent;
    }
.my_content::-webkit-scrollbar-thumb, .trading_coin_content::-webkit-scrollbar-thumb{border-radius: 7px; padding: 0; 
    background-color: rgba(255, 255, 255, 0.12);
    }
.my_content::-webkit-scrollbar-track, .trading_coin_content::-webkit-scrollbar-track {border-radius: 0;
    padding: 0;
    background-color: transparent;
    }
    

.issue_tip {font-size:14px; margin-left:50px; margin-top:20px; width:800px; margin-bottom:40px; border:1px #ccc solid; border-radius:3px; line-height:30px; padding:15px; background:#ecf2fb; }
.price_tip {font-size:14px; margin-left:50px; margin-top:20px; width:800px; margin-bottom:40px; border:1px #ccc solid; border-radius:3px; line-height:30px; padding:15px; background:#ecf2fb; text-align:center}

.coin_chart_period {margin-top:20px; margin-left:20px; width:850px; height:30px;border:0px solid #ddd; padding-bottom:10px;}
.coin_chart_period .period {list-style: none; height:30px; line-height: 30px; float:left}
.coin_chart_period .zoom {list-style: none; height:30px; line-height: 30px; float:right}
.coin_chart_period .period li {height: 25px; display:inline-block; width:50px;line-height: 25px; margin-left: 0px; border:1px solid #ddd; text-align:center; cursor:pointer;}  
.coin_chart_period .zoom li {height: 25px; display:inline-block; width:50px;line-height: 25px; margin-left: 0px; border:1px solid #ddd; text-align:center; cursor:pointer;}  


.trade_form  {width:100%; height:100%; padding-top:5px; float:left; }

.trade_form .trade_item {width:calc(100% - 55px); min-width:210px; height:40px; float:left; margin-top:10px; margin-left:25px; border:1px solid #eee; }
.trade_form .trade_item .item_l {float:left; width:50px; line-height:40px; height:40px; margin-left:10px; color:#8a8a8a;}
.trade_form .splitter {width:1px; height:20px; float:left; margin-top:10px; margin-left:15px; border:0px; border-right:1px solid #eee; }
.trade_form .input {width:calc(100% - 150px); float:left; height:40px; border:0px; outline: none;}
.trade_form input {width:100%; height:40px;  text-indent:20px; border:0px; outline: none;}
.trade_form .coin_l {float:right; margin-right:10px; height:40px; line-height:40px; color:#aaa}
.trade_form .percent_item {background-color:#eee; color:#8a8a8a; width:calc((100% - 15px)/4); height:20px; line-height:20px; text-align:center; float:left; border-radius:3px; cursor:pointer;}
.trade_form .submit {width:470px; height:40px; line-height:40px; text-align:center; font-size:16px; color:#fff; float:left; margin-top:15px; margin-left:30px; border:0px solid #eee; font-size:14px; background:#5287c6}
.trade_form .input .coin_code {    color: #aaa; font-size: 12px; position: absolute; right: 60px; top:-2px; }
.trade_form .trade_item .label {float:left; font-size:14px; height:30px; line-height:30px; color:#00b464; font-weight:bolder; width:105px;}
.trade_form .trade_item .balance {float:right; width:180px; height:30px; line-height:30px; color:#4c4c4c; text-align:right;}
.trade_form .submit_buy { height:40px; line-height:40px; width:calc(100% - 53px);  float:left; text-align:center; margin-top:10px; margin-left:25px; background-color:#00b464; color:#fff; border-radius:1px;cursor:pointer;}
.trade_form .submit_sell { height:40px; line-height:40px; width:calc(100% - 53px); float:left; text-align:center; margin-top:10px;  margin-left:25px; background-color:#fb5c4e; color:#fff;border-radius:1px;cursor:pointer;}
.trade_form .login { height:40px; line-height:40px; width:calc(100% - 53px); float:left; text-align:center; margin-top:10px;  margin-left:25px; background-color:#eee; color:#fff;border-radius:1px;cursor:pointer;}

.time_list {margin-top:5px; height:30px; line-height:30px; background-color:#fff; border-bottom:1px solid #f2f2f2; }
.time_list .item {height:30px; line-height:30px; padding-right:10px; margin-left:10px; float:left; color:#666666; cursor:pointer;}
.time_list .current {font-weight:bold; color:#2483ff; }