html{ width: 100%; height: 100%;}
body { background: #f1f1f1;  margin:0px ; width: 100%; height: 100%; position: relative ;; padding:0px;}
img{  border:0px;}
input,select,textarea{ padding:5px}
a {color: #000000;LETTER-SPACING: 0px; TEXT-DECORATION:none}
a:link {color: #000000;}
a:visited {color: #000000;}
a:hover {TEXT-DECORATION:none;}
a:active {color: #000000;}

h1,h2,h3,h4,h5,h6{ margin:0px; padding:0px; font-weight:100;}
  

.data-width{ position:relative; margin:0 auto; width:95%; max-width:1600px;}	


.moveTop{position:fixed; bottom: 2%;; right:2%;bottom:  2vw;; right:2vw;   color: #666; z-index:5; text-align: center; cursor: pointer; opacity:0;  }
.moveTop:hover *{ background: #000000CC;  color: #FFFFFF}
.moveTop i{ font-size: 30pt;}


.header{  }
.wrapper{ }
.footer{}

#index_body{ width:100%; height:100%; position:relative; display: flex;  }

#index_header{  width:50px; background:#000000; height:100%; color:#FFFFFF; text-align:center; left:0px;  ; z-index:10;   }
#index_header{ display:flex; flex-direction:column; overflow: hidden; overflow-y: auto;  }

	#index_header h2{    font-size:30pt; letter-spacing:1px;  margin:20px 0px; padding-right: 2px; line-height:100%;  display:block; white-space:nowrap;  }
    #index_header h2 a{    color: #FFFFFF;}
           
        .nav{ flex: 1;}
        #index_header ul{   margin:10px; text-align:center;  }
	#index_header ul li{ text-align:center; }
        #index_header ul li a{ color:#FFFFFF; display:block; padding:10px 0px; font-size:12pt;}
        #index_header ul li a span{ display: none;  font-size: 10pt; padding: 5px; z-index: 2; ;}
        
        #index_header ul li a:hover span{  display: block;}
	.colorList-icon{ float:left; display: none!important; cursor: pointer;}
	.colorList-title{ float:left; }
	.colorList-title h2{color:#FFFFFF; padding-top:5px}
	
        .copyright{flex: 1; display: flex; align-items: flex-end; justify-content: center;   }
        
#index_wrapper{flex: 1;  width:100%; height:100%;     background-image: url(bk.png); position:relative; overflow: auto;}

.RWD-brand{ color: #FFFFFF; font-size: 20pt; float: left;}

#RWD-menu-nav{ position:absolute; position:fixed; display:none; width:100%; top:0px;   left:0px; z-index:5;}
 
#RWD-menu-nav ul{ width:100%; background:rgba(0,0,0,0.75); margin:0px  auto; padding:0px 15px 5px 15px;  text-align:right;  }
#RWD-menu-nav ul li{ display:inline-block; padding:0px 10px;}
#RWD-menu-nav ul li a{ color:#FFFFFF;font-size:24pt;}

#RWD-menu-area{ background:rgba(100,100,100,1);display:none;  position:absolute; position:fixed; width:100%; top:0px; height:100%; left:0px; top:0px; z-index:4}
#RWD-menu-area ul{ width:360px;;  margin:0 auto;margin-top:80px; text-align:center; z-index:3}
#RWD-menu-area ul li{;  margin:5px; display:inline-block;}
#RWD-menu-area ul li a{background:rgba(0,0,0,0.2);  width:130px; height:130px;padding:40px 0px;  display:block; text-align:center}
#RWD-menu-area ul li a i{ font-size:30pt;color:#FFFFFF;}
#RWD-menu-area ul li a span{ display:block; color:#FFFFFF; font-size:10pt;;}
.RWD-menu-title{ display:block; position:absolute; bottom:30px; width:100%; text-align:center; color:#FFFFFF; font-size:16pt;}
.RWD-menu-title h3{ font-size:24pt;}
.RWD-menu-title h4{ font-size:10pt; margin-top:0px}
.RWD-menu-title h5{  font-size:8pt; margin-top:10px;opacity:0.5;}
 
.data-width{ width: 100%;; max-width:1600px ; display: block; position: relative; margin: 0px auto;}
/*loginBar*/
.login-bar{position:fixed; display:none;  top:0px; left:0px; width:100%; height:100%; z-index:25}
.login-bar-close{position:fixed; background:rgba(0,0,0,0.6); ;  

top:0px; left:0px; width:100%; height:100%; z-index:21}

.login-form{ width:90%; max-width:400px;   height:100%; margin: 0 auto;display: flex;justify-content: center;align-items: center; }

.login-iframe{ width:100%;height:100%; z-index:22; text-align:center} 


@media screen and (max-width:1024px) {
}


@media screen and (max-width:768px) { 
        
        #index_body{ padding-left:0px;  }
	#index_header{display:none}
	#wrapper_menu{  width:80px!important; left:0}
	
	#wrapper_content{   padding-top:20px;} 
	#RWD-menu-nav{   display:block; }

        
}


/*footer*/
.join-need{ position:fixed; height: 100%; width: 100% ; z-index: 220; display: flex; align-items: center; justify-content: center; color: #ffffff; text-align: center; top: 0px;  background: rgba(0,0,0,0.1); text-shadow: 0px 0px 5px rgba(0,0,0,0.6);}

.join-need h3{font-size:30pt}
.join-need h4{font-size: 16pt}
.join-need a{font-size: 16pt; margin-top: 20px}