.bg-mask,body,html{width:100%;height:100%}:focus{outline:0}
body{font-size:12px;font-family:'Helvetica Neue',Helvetica,'Microsoft Yahei',sans-serif;margin:0;padding:0;overflow-x:hidden;border:none!important;overflow:hidden;background-size:100% 100%;user-select:none}

.bg-mask,.login,.login-bg,.project-title{position:absolute;border:none}
.bg-mask{z-index:-2;opacity:.3}


.login-bg{z-index:-1;opacity:.75;box-shadow:0 0 8px 4px #333}
/* 页面开合 */
.project-title{font-size:32px;top:50%;left:50%;margin-top:-216px;margin-left:-200px;font-weight:700;background:0 0;line-height:48px;height:48px;width:400px;text-align:center}

.project-title img.logo{height:72px;position:absolute;margin-top:-72px;left:50%;transform:translateX(-50%)}
.login{display:block;width:336px;height:268px;top:-225px;left:50%;margin-top:-128px;padding:12px 24px;font-family:'Segoe UI',Tahoma,sans-serif;font-size:16px;font-weight:400;line-height:32px;opacity:.85}
/* 输入框设置 */
.login .login-title{font-size:24px;font-weight:700;display:block;margin-bottom:18px}
.login .line .label,.login .line input{line-height:48px;height:48px;box-sizing:border-box;font-size:16px}
/* 验证码的布局 */
.login .login-title>i{margin-right:12px}
.login .line{height:48px;margin:2px 0;width:100%;position:relative}
.login .line .label{
    /* display:inline-block; */
    width:48px;
    text-align:center;
    border-right:none;
    float:left
}

.login .no-veri-code .veri-code-line,body.center-mode .login.no-veri-code .veri-code-line{display:none}
.login .line .label.fa-refresh{cursor:pointer}
.login .line img.captcha{height:48px;float:left;width:108px;border-left:none;border-right:none;text-align:center;line-height:48px;box-sizing:border-box;padding:11px 6px 11px 0;font-style:italic;font-weight:700;cursor:pointer;user-select:none}
.login .line .captcha-mask{height:48px;width:156px;box-sizing:border-box;position:absolute;top:0;left:0;line-height:48px;z-index:1;cursor:pointer;border-right:none;text-align:center}
.login .line input{padding:0 4px;box-shadow:none;border-radius:0;width:calc(100% - 48px)}
.login .line input.code{width:calc(100% - 156px);font-style:italic}
.login .login-btn{margin-top:2px;width:100%;height:36px;line-height:36px;padding:0}
.login .tips{line-height:22px;padding:1px;margin:4px auto 2px;text-align:center;vertical-align:middle}
.login .tips.ui-state-error{font-size:14px;padding:0}
.login.no-veri-code{height:228px;margin-top:-118px}

body.center-mode .login-bg{border-left:none;border-right:none;width:100%;height:0;top:50%;transform:translateY(-50%)}
body.center-mode .project-title{margin-top:-138px}
body.center-mode .login{top:50%;display:none;margin-left:-192px;margin-top:-88px}
body.center-mode .login.no-veri-code{height:228px;margin-top:-78px}
body.left-mode .login-bg{width:0;height:100%;left:0}
body.left-mode .project-title{left:19.1%}
body.left-mode .login{left:19.1%;transform:translateX(-50%)}
body.right-mode .login-bg{width:0;height:100%;right:0}
body.right-mode .project-title{left:81.9%}
body.right-mode .login{left:81.9%;transform:translateX(-50%)}

@media screen and (max-width:720px){
    body.center-mode,
    body.left-mode,
    body.right-mode{
        background-size:auto 100%;background-repeat:no-repeat;background-position:center center
    }
    body.center-mode .login-bg,
    body.left-mode .login-bg,
    body.right-mode .login-bg{
        height:100%!important;min-height:unset;width:100%!important;top:0;left:0;transform:unset;box-shadow:none;opacity:.9
    }
    body.center-mode .project-title,
    body.left-mode .project-title,
    body.right-mode .project-title{
        left:50%;transform:unset;margin-top:-186px
    }
    body.center-mode .login,
    body.left-mode .login,
    body.right-mode .login{
        display:block;background:0 0;left:50%;transform:translateX(-50%);box-sizing:border-box;height:232px;margin-left:unset;margin-top:-108px;opacity:.95
    }
    body.center-mode .login .login-title,
    body.center-mode>div.ui-state-error,
    body.left-mode .login .login-title,
    body.left-mode>div.ui-state-error,
    body.right-mode .login .login-title,
    body.right-mode>div.ui-state-error{
        display:none
    }
    body.center-mode .login input,
    body.left-mode .login input,
    body.right-mode .login input{-webkit-appearance:none}
}

.en-lang-switch{position:absolute;height:32px;line-height:32px;top:0}
.en-lang-switch .en-lang-list{opacity:0;position:absolute;top:130%;left:50%;margin-left:-98px;transition:all .2s ease-in-out;visibility:hidden;max-height:400px;overflow:auto;z-index:333}
.en-lang-switch .en-lang-list .en-lang-item{width:148px;height:32px;line-height:30px;padding-left:24px;padding-right:24px;cursor:pointer;position:relative;border-bottom:solid 1px transparent;border-top:solid 1px transparent}
.en-lang-switch .en-lang-list .en-lang-item.current::before,.en-lang-switch .en-lang-list .en-lang-item:not(.current):hover::before{content:'●';position:absolute;top:0;left:8px}
.en-lang-switch.center.smallscreen,.en-lang-switch.left,.en-lang-switch.right{border:none;background:0 0}
.en-lang-switch .en-lang-list .en-lang-item.current{font-weight:900}
.en-lang-switch.open .en-lang-list,
.en-lang-switch:hover .en-lang-list{visibility:visible;top:100%;opacity:1}
.en-lang-switch.center{left:50%;transform:translateX(-50%);padding:0 12px;border-top:none}
.en-lang-switch.right{left:81.9%;transform:translateX(-50%)}
.en-lang-switch.left{left:19.1%;transform:translateX(-50%)}