html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{ margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; text-decoration:none}
input,select{vertical-align:middle}
li{list-style:none}


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

html{
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body{
  font: normal 14px/1.5 'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',Arial,sans-serif;
  background-color: #eff5f8;
}
input{
  outline: none;
}

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

#particles-js{
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #f4fef9;
  background-image: url('');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.login {
  position: absolute;
  left: 0;
  top: 15%;
  width: 100%;
  height: auto;
  text-align: center;
}
.login h1{
  font-size: 30px;
  color: #6a6a6a;
  font-family: sans-serif;
}
.login .main{
  width: 360px;
  margin: 30px auto 0 auto;
  padding: 18px 0 15px 50px;
  border-radius: 5px;
  text-align: left;
  background-color: #fff;
  border: 1px solid #dfdfdf;
}
.login .main li{
  display: block;
  margin: 15px 0;
}
.login .main li .input{
  width: 300px;
  height: 40px;
  line-height: 40px;
  border-radius: 3px;
  padding-left: 6px;
  font: normal 16px/1.5 Tahoma, "Lucida Grande", Verdana, "Microsoft Yahei", STXihei, hei;
  background-color: #fff;
  border: 1px solid #dfdfdf;
}
.login .main li input[type=radio]{
  vertical-align: -2px
}
.login .main li .warning{
  color: #e16161
}
.login .main li .yzm{
  width: 120px;
  height: 40px;
  line-height: 40px;
  border-radius: 3px;
  padding-left: 6px;
  font: normal 16px/1.5 Tahoma, "Lucida Grande", Verdana, "Microsoft Yahei", STXihei, hei;
  background-color: #fff;
  border: 1px solid #dfdfdf;
}
.login .main li .login_btn{
  width: 306px;
  height: 40px;
  line-height: 40px;
  border-radius: 3px;
  padding-left: 6px;
  background-color: #36c97b;
  border: none;
  font-size: 18px;
  color: #fff;
  cursor: pointer;
  font: normal 16px/1.5 Tahoma, "Lucida Grande", Verdana, "Microsoft Yahei", STXihei, hei;
}
.login .main li .login_btn:hover{
  background-color: #27b469;
}
.login .main li:last-child{
  color: #8e8e8e
}
.login .foot{
  padding-top: 20px;
  color: #6a6a6a;
}