@charset "utf-8";

/* CSS Document */
html,body {
	height: 100%;
	width: 100%;
	position: relative;
    overflow: hidden;
    min-height: 720px;
}
body {
	font-family: -apple-system, PingFangSC-Regular,
    			"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
    			"Microsoft YaHei";
	color: #666666;
	font-size:14px;
	background: transparent;
}
body,div,dl,dt,dd,ul,ol,li,pre,code,form,fieldset,legend,input,button,textarea,blockquote,th,td {
	margin: 0;
	padding: 0;
}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill{
	    background-color: rgb(255, 255, 255);
}
fieldset,img {
	border: 0;
}
ol,ul,li {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a,a:visited {
	text-decoration: none;
}
img {
	border: 0;
}
:focus {
	outline: 0;
}
address,caption,cite,code,dfn,em,th,var,optgroup {
	font-style: normal;
	font-weight: normal;
}
input,button,textarea,select,optgroup,option {
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
}
input,button,textarea,select {
	*font-size: 100%;
}
::placeholder {
  color:  #D0D0D0;
  font-size: 12px;
}
.form-control input:focus{
	background: #F8FCFE;
	border-color: #6CC9F6;
}

.wrapper {
    min-height:100%;
    height: auto !important;
    margin:0 auto;
    color: #858585;
}
.navbar{
	top : 9.2%;
	width :100%;
	height : 5.2%;
	position: absolute;
	z-index:9999;
}
.navbar-header{
	width: 13.4%;
	float:left;
}
.logo{
	background-image : url("https://s3.cn-north-1.amazonaws.com.cn/qingshuxuetang.com/home/images/home/logo@2x.png");
	background-position: center;
    background-size: 100%;
    width: 120px;
    height: 38px;
    float:right;
}
.logo_ie8{
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='/static_res/images/logo.png',
    sizingMethod='scale');
	background-position: center;
    width: 120px;
    height: 38px;
    float:right;
}
.navbar-right{
	float:left;
	margin-left:60.3%;
	padding-top:10px;
	width:20.2%;
}
.navbar-nav-custom-right{
	display:block;
	float : left;
}
footer{
	height : 140px;
	width : 38%;
	position: absolute;
	background: transparent;
	color: #858585;
    bottom:0;
    right:0
}
.footer-area{
	width:90%;
	right : 3%;
	position : absolute;
	cursor: pointer;
	bottom: 42px;
}

.footer-area.top-layer {
	z-index: 100;
}
.copy{
    color: #BBBBBB;
    line-height: 20px;
    position: absolute;
    bottom: 0em;
}
.concat{
	color: #3F92DF;
	float:left;
	margin-left:50%;
}
.concat span{
	width:5%;
	display:block;
	font-size:12px;
	font-weight:normal;
}
.concat .line{
	margin: 7px 0 0 7px; 
	border-left:1px solid #3F92DF;
	height: 60px;
	-webkit-animation: expand 2s;
	bottom: 0;
	float :left;
}
.concat-detail{
	margin-bottom:7%;
	width:100%;
	font-family: -apple-system, PingFangSC-Light,
    			"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
    			"Microsoft YaHei";
	font-weight:300;
	color: #666666;
	display:none;
}
.concat-detail img{
	width:90%;	
}
.concat-detail .qrcode{
	font-size: 13px;	
	letter-spacing: 1.73px;
	float:left;
	width:20%;
	margin-right:2%;
	line-height:1px;
	text-align:center;
}
.concat-detail .info{
	font-size: 12px;
	line-height: 12px;
}
@-webkit-keyframes expand{
    0%{height:0px}
    100%{height:60px}
}
.h-line{
	margin: 2px 16px 0 16px;
	border-left: 1px solid #666;
	height: 15px;
}
.no-auth{
	width: 65%;
	margin-right: 3em;
	line-height: 20px;
	float: right;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-top:1px;
}
.login-tab {
	line-height: 20px;
	white-space: nowrap;
}
.register-tab {
	float: right;
	line-height: 20px;
	white-space: nowrap;
}
.download_nav{
	width: 65%;
	margin-right: 3em;
	line-height: 20px;
	float: right;
	margin-top:2px;
}
.auth-user{
	width: 100%;
	line-height: 20px;
	float: right;
}
.ico-menu{
	width: 20px;  
    height: 20px; 
    line-height: 20px;
    border-radius: 50%;  
    border: 1px solid #3F92DF;
}
.ico-menu:hover{
	width: 22px;  
    height: 22px;
    box-shadow:0px 0px 10px #0093E6;
    -moz-box-shadow:0px 0px 10px #0093E6; 
	-webkit-box-shadow:0px 0px 10px #0093E6;
}
.menu{
	position: absolute;
    margin-left: -35px;
}
.point{
	width: 5px;  
    height: 5px; 
    line-height: 20px;
    border-radius: 50%;  
    background: #3F92DF;
    margin: 38%;
}
.logout{
	margin-left:5px;
}
.user-name{
	background : url("https://s3.cn-north-1.amazonaws.com.cn/qingshuxuetang.com/home/images/login/login_s@2x.png") no-repeat;
	background-position: left;
    background-size: 13px;
    padding-left: 20px;
	margin-right: 20px;
}
.dropdown {
  position: relative;
}
.dropdown-toggle:focus {
  outline: 0;
}
.dropdown-menu {
  margin-top : 20px;
  font-family:  -apple-system, PingFangSC-Light,
    			"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
    			"Microsoft YaHei";
  font-weight: 300;
  position: absolute;
  top: 100%;
  z-index: 1000;
  display: none;
  float: left;
  list-style: none;
  text-align: left;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
}
.dropdown-menu > li{
	margin-top:20px;
}

.dropdown-menu > li > a {
  display: block;
  clear: both;
  white-space: nowrap;
  text-decoration: none;
  font-size: 16px;
  color: #666666;
}
.dropdown-menu > li:hover,
.dropdown-menu > li:focus{
	  margin-left:5%;
}
.dropdown-menu > li > p {
  font-size: 12px;
  color: #999999;
  white-space: nowrap;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  color: #3F92DF;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color: #3F92DF;
}
.open > .dropdown-menu {
  display: block;
}
.open > a {
  outline: 0;
}
.dropdown-menu-right {
  left: auto;
  right: 0;
}
.btn-default{
	background-color: #0093E6;
	box-shadow: 0px 15px 10px -15px #0093E6;
	-moz-box-shadow:0px 15px 10px -15px #0093E6; 
	-webkit-box-shadow:0px 15px 10px -15px #0093E6;
	border-radius: 2px;
	font-family:  -apple-system, PingFangSC-Light,
    			"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
    			"Microsoft YaHei";
	font-weight:300;
	font-size: 18px;
	color: #FFFFFF;
	line-height: 20px;
	padding : 8px 15px;
	min-width: 150px;
	border : none;
	cursor: pointer;	
	text-align:center;
}
.btn-default:hover{
	background-color: #0FA8FE;
}
.modal{
	display:none;
}
.blocker{
	background-color:rgba(0,0,0,0.65);
}
ul a{
	font-size: 14px;
	color: #666666;
	line-height: 14px;
}
ul a:hover{
	color: #3F92DF;
}
.title{
	font-family:  -apple-system, PingFangSC-Regular,
    			"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
    			"Microsoft YaHei";
	font-size: 48px;
	color: #3F92DF;
	line-height: 72px;
	display:block;
}
label{
	font-size: 20px;
	color: #3F92DF;
	line-height: 24px;
}
.w-line{
	margin: 12px 0 0 12px; 
	border-top: 1px solid #3F92DF;
	width: 15px;
	position:absolute;
}
.single-line{
    white-space: nowrap;
    overflow: hidden;              /* "overflow" value must be different from "visible" */ 
    text-overflow: ellipsis;
    padding-right:1px;
    word-wrap:normal;
}

 .lowerIE10reminder{
	width: 100%;
	position:fixed;
	left:0px; 
	top:0px;
	border-bottom:solid #0093E6;
	background:#fff;
	font-size:16px;
	text-align:center;
}
.lowerIE10reminder span{
	background:url("../../images/icon_warninghints.png") no-repeat;
	height:27.8px;
	padding-left:33px;
	margin-left:0px;
	margin-top:8px;
	display:inline-block;	
}
.lowerIE10reminder .btn-browser{
	background-color: #28b4ff;
	margin-left:50px;
	margin-right:15px;
	padding:2px;
	color: #FFFFFF;
	cursor: pointer;
	border-radius: 2px;
	font-size:14px;
}
.lowerIE10reminder .btn-browser:hover{
	background-color:#62c8ff;
}
.dis-browser-reminder{
	position:absolute;
	background:url("../../images/icon_ viewsupportbrowser_delete.png") no-repeat;
	background-size:contain;
	clear:both;
	border:0;
	width:70px;
	height:22px;
	margin: 8px 0 0 150px;
	padding-left:15px;
	cursor: pointer;
	color:#0093E6;
	font-size:16px;
}
.dis-browser-reminder:hover{
	color:#0080ff;
}
.hide {
    display: none;
}
/**
mac screen
*/
@media screen and (max-width : 1390px) {  
.navbar{top : 6.2%}
.navbar-header{width: 15.4%}
.navbar-right{margin-left:55%}
footer{width:35%}
.no-auth{width: 80%}
.auth-user{width: 100%}
.concat-detail .qrcode{width:18%;font-size: 12px;letter-spacing: 1.33px}
}
 
 /**
1280px screen
*/
@media screen and (max-width : 1280px) {  
footer{width:50%;}
.footer-area{width:95%}
.logo{background : url("https://s3.cn-north-1.amazonaws.com.cn/qingshuxuetang.com/home/images/home/logo@1x.png") no-repeat;background-position: center;background-size: 100%}
.concat-detail .info{font-size: 11px;line-height: 11px}
.concat-detail img{width:80%;}
.concat-detail img{width:100%;}
.concat-detail .qrcode{width:16%;}
.auth-user{width: 120%}
.title{font-size: 40px}
}
 
 /**
1000px screen
*/
@media screen and (max-width : 1000px) {   
.navbar-right{margin-left:50%;width: 25.2%;}
.concat-detail{opacity: 0.8;background: #FFFFFF}
.concat{margin-left:60%}
.no-auth{width: 80%}
}
 /**
800px screen
*/
@media screen and (max-width : 800px) { 
	.navbar-header{width: 18.4%;margin-left: 5%}
	.navbar-right{margin-left:50%;margin-top: 2%;}
	.dropdown-menu {opacity: 0.8;background: #FFFFFF}
	.concat{margin-left:80%;}	
	.no-auth{width: 100%}
	.auth-user{width: 100%}
	.title{font-size: 35px}
}
 /**
800px screen
*/
@media screen and (max-height : 600px) { 
	.footer-area{bottom:100px;}
	.h-line{margin: 3px 0 0 1em;}
}

 /**
iPhone 和 Smartphones
*/
@media screen and (max-width: 480px) {  
	.logo{background : url("https://s3.cn-north-1.amazonaws.com.cn/qingshuxuetang.com/home/images/home/logo@1x.png") no-repeat;background-position: center;background-size: 90%;margin-top:13px}
	.navbar{top : 4%}
	.navbar-header{width: 30%;margin-left:10%;}
	.navbar-right{margin-left:25%;width: 30%;margin-top: 2%;}
	footer{display:none}
	.dropdown-menu {margin-top:10px;right:0;opacity: 0.8;background: #FFFFFF;}
	.title{font-size: 20px}
	label{font-size: 15px}
	.user-name{background-size: 12px;}
	.auth-user {margin-right: 1.2em;}
	.h-line {margin: 3px 0 0 0em;}
	.no-auth {margin-right: 1.3em;}
}

/**
动效
*/
@keyframes fadeInTop {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fade{
    animation-duration: 1s;
    animation-name: fadeInTop; 
}

/*for ie11*/
@media screen and(-ms-high-contrast: active),(-ms-high-contrast: none) {
	.download_nav {
		margin-top: 5px;
	}
	.h-line {
		margin-top: 0;
	}
}