.login-page{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .3s ease-out;transition:opacity .3s ease-out;z-index:10;overflow:hidden}.login-page.page-fade-out{opacity:.1}.login-page div.exit{position:absolute;top:14px;right:12px;z-index:5;font-size:14px;letter-spacing:2px;color:rgba(28,228,235,.5);border:1px solid #063536;padding:8px 14px;border-radius:4px;background-color:rgba(6,53,54,.5);opacity:.7}.login-page div.exit>span{margin-right:5px}.login-page .login-dialog{position:relative;border:2px solid #001e74;background:rgba(0,30,116,.85);padding:15px;border-radius:4px;width:500px;left:5%;background-clip:content-box;z-index:2;opacity:0;-webkit-transform:translateY(-150px);transform:translateY(-150px);-webkit-transition:all .75s ease-out;transition:all .75s ease-out;will-change:opacity,transform}.login-page .login-dialog.active{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}.login-page .login-dialog:before{content:"";position:absolute;left:-2px;bottom:-2px;width:15px;height:15px;border-bottom:2px solid #0e4cff;border-left:2px solid #0e4cff;border-bottom-left-radius:4px}.login-page .login-dialog:after{content:"";position:absolute;right:-2px;bottom:-2px;width:15px;height:15px;border-bottom:2px solid #0e4cff;border-right:2px solid #0e4cff;border-bottom-right-radius:4px}.login-page .login-dialog>h3{position:relative;text-align:center;font-size:30px;letter-spacing:6px;line-height:2.8;font-weight:700;padding-top:12px}.login-page .login-dialog>h3:before{content:"";position:absolute;left:-17px;top:-17px;width:15px;height:15px;border-top:2px solid #0e4cff;border-left:2px solid #0e4cff;border-top-left-radius:4px}.login-page .login-dialog>h3:after{content:"";position:absolute;right:-17px;top:-17px;width:15px;height:15px;border-top:2px solid #0e4cff;border-right:2px solid #0e4cff;border-top-right-radius:4px}.login-page .login-dialog>div{margin-left:25px;margin-right:25px}.login-page .form-item{position:relative;border-bottom:1px dotted hsla(0,0%,100%,.35);margin-bottom:16px;padding:10px 0;height:35px}.login-page .form-item:after{content:"";position:absolute;display:block;left:0;bottom:-1px;width:0;height:2px;background-color:#4172ff;-webkit-transition:width .4s ease-out;transition:width .4s ease-out;will-change:width}.login-page .form-item label{position:absolute;top:26px;left:0;font-size:15px;-webkit-transition:top .4s ease-out,font-size .4s linear;transition:top .4s ease-out,font-size .4s linear;will-change:top,font-size;letter-spacing:2px}.login-page .form-item input{left:0;width:100%;bottom:2px;height:35px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#4172ff;font-size:16px;font-weight:700;padding:0}.login-page .form-item img,.login-page .form-item input{position:absolute;background:transparent;border:none;outline:none}.login-page .form-item img{display:block;right:0;bottom:4px;width:100px;height:42px;cursor:pointer}.login-page .form-item.active:after{width:100%}.login-page .form-item.top label{top:0;font-size:12px}.login-page div.remember-account{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:26px;letter-spacing:1px;color:hsla(0,0%,100%,.8);cursor:pointer;-webkit-transition:color .35s ease-out;transition:color .35s ease-out;margin-bottom:20px}.login-page div.remember-account:before{content:"";display:block;width:12px;height:12px;border-radius:1px;border:1px solid hsla(0,0%,100%,.85);margin-right:8px;margin-top:2px}.login-page div.remember-account:hover{color:#fff}.login-page div.remember-account:after{display:none;content:"✔";position:absolute;top:0;left:0;text-align:center;font-size:1.15em;padding:2px 0 0 1px}.login-page div.remember-account.active:after{display:block}.login-page div.login-button{position:relative;text-align:center;font-size:18px;line-height:2.5;letter-spacing:10px;margin-bottom:30px;border:1px solid hsla(0,0%,100%,.2);border-radius:30px;cursor:pointer;overflow:hidden;z-index:0}.login-page div.login-button:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:hsla(0,0%,100%,.1);z-index:-1;-webkit-transform-origin:center center;transform-origin:center center;-webkit-transition:background-color .35s ease,-webkit-transform .45s ease-out;transition:background-color .35s ease,-webkit-transform .45s ease-out;transition:transform .45s ease-out,background-color .35s ease;transition:transform .45s ease-out,background-color .35s ease,-webkit-transform .45s ease-out;will-change:transform,background-color;-webkit-transform:scaleX(0);transform:scaleX(0)}.login-page div.login-button:hover:before{-webkit-transform:scale(1);transform:scale(1);background-color:hsla(0,0%,100%,.4)}.login-page .sphere{position:absolute;left:0;top:0;width:100%;height:100%;z-index:1}@media screen and (max-width:1400px){.login-page .login-dialog{width:400px;padding:10px}.login-page .login-dialog>h3{font-size:24px}.login-page .login-dialog>h3:before{left:-12px;top:-12px}.login-page .login-dialog>h3:after{right:-12px;top:-12px}.login-page .form-item{margin-bottom:5px}.login-page .form-item input,.login-page .form-item label,.login-page div.login-button,.login-page div.remember-account{font-size:14px}}@media screen and (max-width:1200px){.login-page .login-dialog{width:350px;padding:5px;left:3%}.login-page .login-dialog>h3{font-size:23px;padding-top:3px;letter-spacing:3px}.login-page .login-dialog>h3:before{left:-7px;top:-7px}.login-page .login-dialog>h3:after{right:-7px;top:-7px}.login-page .form-item{margin-bottom:6px}.login-page .form-item label{font-size:12px}.login-page .form-item input{font-size:14px}.login-page .form-item img{width:90px;height:36px}.login-page div.login-button{font-size:14px;margin-bottom:20px}.login-page div.remember-account{font-size:12px;margin-bottom:10px}}@media screen and (max-width:1000px){.login-page .login-dialog{left:2%}.login-page .login-dialog>h3{line-height:2.5}.login-page .login-dialog>div{margin-left:20px;margin-right:20px}.login-page .sphere{margin-left:-3%}}