html,
body { height: 100%; }

.largeHeader { position: relative; width: 100%; background: url(../img/loginBg2.jpg) no-repeat 100%/100%; }
.largeHeader canvas { position: absolute; left: 0; top: 0; z-index: 10; }

@keyframes bodyAnimate {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@-webkit-keyframes bodyAnimate {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

.swiper-container { position: absolute; left: 50%; top: 50%; margin-top: -225px; margin-left: -200px; z-index: 15; opacity: 0; transition: opacity .3s; -webkit-transition: opacity .3s; -moz-transition: opacity .3s; -ms-transition: opacity .3s; -o-transition: opacity .3s; }
.show { opacity: 1; }
.loginBox { box-sizing: border-box; width: 400px; height: 450px; background: #fff; padding: 15px; }
.loginBox .imgBox { position: relative; width: 100px; height: 100px; margin: 10px auto; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.loginBox .imgBox .eye { position: absolute; top: 25px; width: 16px; height: 16px; border-radius: 50%; background: #000; }
.loginBox .imgBox .eye:after { content: ''; position: absolute; top: 5px; left: 3px; width: 2px; height: 2px; background: #FFFFFF; transition: all .3s; }
.loginBox .imgBox .eye:before { content: ''; position: absolute; top: -8px; left: -1px; width: 18px; height: 18px; background: #fff; border-radius: 50%; opacity: 0; transition: opacity .3s, transform .3s; -webkit-transition: opacity .3s, -webkit-transform .3s; }
.loginBox .imgBox .eye.eyeClose:before { opacity: 1; transform: translateY(4px); -webkit-transform: translateY(4px); transition: opacity .3s, transform .3s .15s; -webkit-transition: opacity .3s, -webkit-transform .3s .15s; }
.loginBox .imgBox .leftEye { left: 15px; }
.loginBox .imgBox .rightEye { right: 25px; }
.loginBox .imgBox .rightEye:after { left: 11px; }
.loginBox h3 { font-size: 22px; text-align: center; margin-bottom: 15px; }
.loginBox .layui-form-item { width: 300px; margin: 20px auto; }
.loginBox .layui-input-block { margin-left: 0; }
.loginBox .loginBtnBox { margin-top: 30px; }
.loginBox .loginBtnBox .layui-btn { width: 100%; font-size: 16px; }
.loginBox .forgetPwd { float: right; margin-right: 30px; }
.getVcode { position: absolute; top: 8px; right: 5px; }
input.error,
input.error:focus,
input.error:hover { border: 1px solid #a10; }
input.ok,
input.ok:focus,
input.ok:hover { border: 1px solid rgb(51, 171, 159); }
input.ok + i:before { font-family: "iconfont" !important; position: absolute; right: 10px; top: 7px; content: '\e645'; color: rgb(51, 171, 159); font-size: 20px; font-weight: 600; }
input.ok + i.vCode:before { right: 101px; }
button[disabled="disabled"],
button[disabled="disabled"]:hover { opacity: .5; cursor: not-allowed; }
.errorTips { position: relative; top: 5px; color: #fff; background: #a10; box-sizing: border-box; width: 100%; height: 30px; padding: 0 10px; line-height: 30px; display: block; transition: all .3s; }

/*入场canvas动画*/
#admission { box-sizing: border-box; position: fixed; left: 0; top: 0; z-index: 9999; }

/*开发者模式*/
.developer { position: fixed; width: 100%; height: 36px; line-height: 36px; padding: 0 15px; background: #ffcecf; z-index: 100; }
.developer a { color: #1E9FFF; }