@charset "utf-8";
/* CSS Document */
*{box-sizing:content-box;}
a:hover, a:focus{text-decoration:none;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
body{-webkit-text-size-adjust:none;}
fieldset,img{border:0;}
img{ vertical-align: top; max-width: 100%; }
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;}
ol,ul{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;}
.clearfix:after{visibility:hidden;display: block;font-size:0;content:" ";clear:both;height:0;}
* html .clearfix{ zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
.cli{ clear:both; font-size:0; height:0; overflow:hidden;display:block;}
.lclear{clear:left;font-size:0;height:0;overflow:hidden;}	
.fl{float:left;}
.fr{float:right;}
/*general*/
body{font-size:12px;font-family:'微软雅黑',"宋体","Arial Narrow",Helvetica,sans-serif;color:#000;line-height:1.2;text-align:left;}
a{color:#333;text-decoration:none;}

html,body{ 
	width:100%!important;
	height:100%!important;
}

canvas{
  display:block!important;
  vertical-align:bottom!important;
}

.count-particles{
  background: #000022!important;
  position: absolute!important;
  top: 48px!important;
  left: 0!important;
  width: 80px!important;
  color: #13E8E9!important;
  font-size: .8em!important;
  text-align: left!important;
  text-indent: 4px!important;
  line-height: 14px!important;
  padding-bottom: 2px!important;
  font-family: Helvetica, Arial, sans-serif!important;
  font-weight: bold!important;
}

.js-count-particles{
  font-size: 1.1em!important;
}

#stats,
.count-particles{
  -webkit-user-select: none!important;
  margin-top: 5px!important;
  margin-left: 5px!important;
}

#stats{
  border-radius: 3px 3px 0 0!important;
  overflow: hidden!important;
}

.count-particles{
  border-radius: 0 0 3px 3px!important;
}


#particles-js{
	width: 100%!important;
	height: 100%!important;
	position: relative!important;
	background-image: url(../images/login_bg.jpg)!important;
	background-position: 50% 50%!important;
	background-size: cover!important;
	background-repeat: no-repeat!important;
	margin-left: auto!important;
	margin-right: auto!important;
}

.sk-rotating-plane {
	display: none!important;
    width: 80px!important;
    height: 80px!important;
    margin: auto!important;
    background-color: white!important;
    -webkit-animation: sk-rotating-plane 1.2s infinite ease-in-out!important;
    animation: sk-rotating-plane 1.2s infinite ease-in-out!important;
    z-index: 1!important;
    position: absolute!important;
    top: 50%!important;
    left: 50%!important;
    margin-left: -40px!important;
    margin-top: -80px!important;
}
.sk-rotating-plane.active{display: block!important;}

@keyframes sk-rotating-plane{
	0% {
	    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)!important;
	    transform: perspective(120px) rotateX(0deg) rotateY(0deg)!important;
	}
	50% {
	    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)!important;
	    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)!important;
	}
	100% {
	    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg)!important;
	    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg)!important;
	}
}

@keyframes login-small{
	0%{
		transform: scale(1)!important;-moz-transform: scale(1)!important;	/* Firefox 4 */-webkit-transform: scale(1)!important;	/* Safari 和 Chrome */-o-transform: scale(1)!important;	/* Opera */-ms-transform:scale(1)!important; 	/* IE 9 */
	}
	100%{
		transform: scale(0.2)!important;-moz-transform: scale(0.1)!important;	/* Firefox 4 */-webkit-transform: scale(0.2)!important;	/* Safari 和 Chrome */-o-transform: scale(0.1)!important;	/* Opera */-ms-transform:scale(0.1)!important; 	/* IE 9 */
	}
}

.login{z-index: 2!important;position:absolute!important;width: 350px!important;border-radius: 5px!important;height: auto!important;padding-bottom:50px!important;background: white!important;box-shadow: 0px 0px 5px #333333!important;top: 50%!important;left: 50%!important;margin-top: -250px!important;margin-left: -175px!important;transition: all 1s!important;-moz-transition: all 1s!important;	/* Firefox 4 */-webkit-transition: all 1s!important;	/* Safari 和 Chrome */-o-transition: all 1s!important;	/* Opera */}
.login-top{font-size: 24px!important;margin: 50px 0!important;box-sizing: border-box!important;color: #333333!important;text-align:center!important;}
.login-center{width: 100%!important;box-sizing: border-box!important;padding: 0 40px!important;margin-bottom: 30px!important;}
.login-center-img{width: 20px!important;height: 20px!important;float: left!important;margin-top: 5px!important;}
.login-center-img>img{width: 100%!important;}
.login-center-input{float: left!important;width: 230px!important;margin-left: 15px!important;height: 30px!important;position: relative!important;}
.login-center-input input{z-index: 2!important;transition: all 0.5s!important;padding-left: 10px!important;color: #333333!important;width: 100%!important;height: 30px!important;border: 0!important;border-bottom: 1px solid #cccccc!important;border-top: 1px solid #ffffff!important;border-left: 1px solid #ffffff!important;border-right: 1px solid #ffffff!important;box-sizing: border-box!important;outline: none!important;position: relative!important;}
.login-center-input input:focus{border: 1px solid dodgerblue!important;}
.login-center-input-text{background: white!important;padding: 0 5px!important;position: absolute!important;z-index: 0!important;opacity: 0!important;height: 20px!important;top: 50%!important;margin-top: -10px!important;font-size: 14px!important;left: 5px!important;color: dodgerblue!important;line-height: 20px!important;transition: all 0.5s!important;-moz-transition: all 0.5s!important;	/* Firefox 4 */-webkit-transition: all 0.5s!important;	/* Safari 和 Chrome */-o-transition: all 0.5s!important;	/* Opera */}
.login-center-input input:focus~.login-center-input-text{top: 0!important;z-index: 3!important;opacity: 1!important;margin-top: -15px!important;}
.login.active{-webkit-animation: login-small 0.8s !important; animation: login-small 0.8s !important;animation-fill-mode:forwards!important;-webkit-animation-fill-mode:forwards}
.login-button{cursor: pointer!important;width: 250px!important;text-align: center!important;height: 40px!important;line-height: 40px!important;background-color: dodgerblue!important;border-radius: 5px!important;margin: 0 auto!important;color: white!important;}