@keyframes bgColor
{
0%   {background: url(../images/1.jpg) no-repeat; background-size: 100% 100%;}
20%  {background: url(../images/2.jpg) no-repeat; background-size: 100% 100%;}
40%  {background: url(../images/3.jpg) no-repeat; background-size: 100% 100%;}
80% {background: url(../images/4.jpg) no-repeat; background-size: 100% 100%;}
100% {background: url(../images/5.jpg) no-repeat; background-size: 100% 100%;}
}

.login-pannel{width: 100%; height: auto; position: fixed; top: 0px; left: 0px; bottom: 0px;}
.login-pannel .login-box{width: 100%; height: 100%; position: relative;}
.login-pannel .login-box .login-bg{width: 100%; height: 100%; position: relative; z-index: 1; background: url(../images/1.jpg) no-repeat,url(../images/2.jpg) no-repeat,url(../images/3.jpg) no-repeat,url(../images/4.jpg) no-repeat,url(../images/5.jpg) no-repeat; background-size: 100% 100%;
animation-name:bgColor; 
animation-duration:12s;
/*变换时间*/
animation-delay:2s;
/*动画开始时间*/
animation-iteration-count:infinite;
/*下一周期循环播放*/
animation-play-state:running;
/*动画开始运行*/
backface-visibility:hidden;
animation-direction:alternate;
-webkit-backface-visibility: hidden;
/*隐藏转换的元素的背面-无效*/
transform-style: preserve-3d;
-webkit-transform-style: preserve-3d; 
}
.login-pannel .login-box .login-form{width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 2;}
.login-pannel .login-box .login-form .form-box{width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.login-pannel .login-box .login-form .form-box .form-pannel{width: 350px; height: auto; overflow: hidden;}
.login-pannel .login-box .login-form .form-box .form-pannel .form-title{width: 100%; height: 36px; line-height: 36px; color: #fff; text-align: center; font-size: 18px;}
.login-pannel .login-box .login-form .form-box .form-pannel .form-input{width: 100%; height: 50px; box-sizing: border-box; border: 1px rgba(255,255,255,0.3) solid; border-radius: 25px; margin-top: 15px;}
.login-pannel .login-box .login-form .form-box .form-pannel .form-input i{width: 48px; height: 48px; display: block; float: left; line-height: 48px; text-align: center; font-size: 22px; color: rgba(255,255,255,0.5);}
.login-pannel .login-box .login-form .form-box .form-pannel .form-input .input-box{width: auto; height: auto; position: relative; margin: 0px 15px 0px 55px;}
.login-pannel .login-box .login-form .form-box .form-pannel .form-input .input-box input{width: 100%; height: 48px; float: left; background-color: rgba(0,0,0,0); color: #fff; font-size: 14px; border: none;}
.login-pannel .login-box .login-form .form-box .form-pannel .form-input .input-box .code-input{width: 100%; height: 48px; float: left;}
.login-pannel .login-box .login-form .form-box .form-pannel .form-input .input-box .code-input .code-box{width: auto; height: auto; margin-right: 90px; position: relative;}
.login-pannel .login-box .login-form .form-box .form-pannel .form-input .input-box .code-input .code-img{width: 80px; height: 48px; float: right; box-sizing: border-box; padding: 5px;}
.login-pannel .login-box .login-form .form-box .form-pannel .form-input .input-box .code-input .code-img img{width: 100%; height: 100%;}
.login-pannel .login-box .login-form .form-box .form-pannel .login-in-btn{width: 100%; height: 50px;  border-radius: 25px; margin-top: 30px; line-height: 50px; text-align: center; color: #fff; font-size: 20px; background-color: #0095e5; cursor: pointer;}

::-webkit-input-placeholder{color: #fff;}
::-moz-placeholder{color: #fff;}
:-moz-placeholder{color: #fff;}
:-ms-input-placeholder{color: #fff;}

.layui-badge-rim{cursor: pointer;}
.browser-version{width: 100%; height: auto; line-height: 30px; font-size: 12px; color: #fff; position: absolute; bottom: 10px; right: 10px; z-index: 100; text-align: right;}