@charset "utf-8";
body {
    font-family: "Microsoft YaHei" !important;
    width: 100%;
    /*min-width: 460px;*/
    overflow: hidden;
    min-height: 620px;
    position: relative;
    background: url(/sunbox/img/login/login_bg_yy.png) no-repeat center center;
    background-size: cover;
}

body:before,body:after{
    position: absolute; top: 0; left: 50%; content: ""; z-index: -1;
}
@-webkit-keyframes ball-scale {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1); }
    30% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0.7; }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0.2; } }

@keyframes ball-scale {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1); }
    30% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0.7; }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0.2; } }
body:before{
    width: 100%; margin-left: -50%; min-height: 620px;
    /*background-image: url(/static/img/login/xing01.png);	*/
    background-position: 0 0;
    background-size: 100%;
    background-repeat: no-repeat;
    /* -webkit-animation: ball-scale 4s 0s ease-in-out infinite; */
    /*   animation: ball-scale 4s 0s ease-in-out infinite; */
}
@-webkit-keyframes spin-rotate {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg); }


    25% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg); }

    50% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg); }
    75% {
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg); }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg); }
}

@keyframes spin-rotate {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg); }

    25% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg); }
    50% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg); }
    75% {
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg); }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg); }


}
body:after{
    /*width: 1200px; margin-left: -600px; min-height: 1200px;*/
    /*background-image: url(/static/img/login/qiu03.png);	*/
    /*background-position: bottom; center;
    background-repeat: no-repeat;*/
    /*-webkit-animation: spin-rotate 50s 0s infinite linear;*/
    /*animation: spin-rotate 50s 0s infinite linear;*/
}



div,h3,p,input,label,button{
    margin:0;padding:0;outline: none;
}
.fr{
    float: right;
}
.login {
    width: 355px;
    padding: 0 20px;
    border-radius: 5px;
    position: absolute;
    top: 50%;
    right: 12%;
    margin-top: -200px;
    background-color: rgba(200,230,201,.6);
    /*box-shadow: 0 0 10px 0 rgba(0,29,68,0.4);*/
    z-index: 99;
}
/*设置手机端的登录界面*/
@media screen and (max-width: 500px){
    .login {
        right: 10px;
    }
}
@media screen and (max-width: 321px){
    .login {
        right: 1%;
        width: 98%;
        padding: 0 10px;
    }

}

.login .row {
    margin: 0;
    padding: 0;
}

.logo {
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    display: inline-block;
    float: left;
    margin: 0 10px 0 5px;
}

.logo img {
    width: 100%;
    vertical-align: middle;
    display: block;
}

h3.sysname {
    font-size: 23px;
    line-height: 1;
    font-weight: 500;
    padding: 28px 0;
    margin:0;
    color: #2e3c42;
    position: relative;
    text-align: left;
}
h3.sysname:after,h3.sysname:before{
    content: "";position: absolute;
    left: 0;
}
h3.sysname:before{
    width: 40px;height: 40px;display: block; top:13px;
    /*background-image: url(/static/img/login/power-logo.png);*/
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
h3.sysname:after{
    bottom:0;right:0; background-color: #dcdddd;
}

.loginbox {
    width: 100%;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .3);
    border-radius: 8px;
    background-color: #fff;
    overflow: hidden;
    margin: 20px 0 10px 0;
}


.login-input {
    /*padding: 20px 30px 20px 30px;*/
    overflow: hidden;
}

.login-input .input-name,
.login-input .input-password {
    /*width: 280px;*/
    height: 42px;
    margin-bottom: 15px;
    /*overflow: hidden;*/
    position: relative;
    border: 1px solid transparent;
}
.login-input .input-name .login-icon,.login-input .input-password .login-icon{
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 40px;
    height: 40px;
    z-index: 100;
    background: #e4f3ec url(/sunbox/img/login/login_ico_spirit.png) no-repeat center 10px;
}
.login-input .input-password .login-icon{
    background-position: center center;
}
.login-input .input-name .icon02{
    background-position: center -95px;
}

.login-input input {
    width: 100%;
    height: 40px;
    /*padding: 5px 10px;*/
    /*border: 1px solid #efefef;*/
    /*background-color: #efefef;*/
    border: 0;
    padding: 0 10px 0 50px;
    line-height: 40px;
    box-sizing: border-box;
}
.login-input input:focus{
    /*border-color: #1ab394 !important;*/
}

.login-set {
    width: 280px;
    margin-bottom: 15px;
    overflow: hidden;
}

.login-set p {
    display: inline-block;
    float: right;

    height: 17px;
    font-size: 12px;
    line-height: 17px;
    color: #a5a5a5;
}

.login-set input[type=checkbox] {
    width: 17px;
    height: 17px;
    margin-left: 9px;
    display: inline-block;
    float: right;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAYAAAA7bUf6AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAALpJREFUeNrslLEKwjAQhv8m2VNCRETnPppSfB2l0DdrZkHEtLZ7SryDDG4twU1/uOHCfV+y5IoYI5xzBsCZqqbaYTl3qobqUlXVq+i6bk/NzRiDsiyhlFo0hBAwjiOGYeD2wERtrQVL1oYvYkYIAe99LejspLVGThJ3ZImVUmZJErcR+EL+kp+Q+Hmes+DEPVnSTtOUJUlcy5KGPhH6vsfaF/EczzPHfJH2if3YJ9sVnkfaJ1faJ/4twABLMEdLBPr4lAAAAABJRU5ErkJggg==);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.login-set input[checkbox=checkbox]{
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAYAAAA7bUf6AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARdJREFUeNrcVMFKxDAQfUlzXNtSIqK74K039aMUl+Jv6B+sLCzsR4mn9qSwIGJaa/GYUmdChaUrNsiefDAkk3nvJYFkRNd1KIoiAXBDkVEcYxwvFEuKRZqm7yLP8yklmyRJEMcxlFKjDtZa1HWNqqo4nbEi01qDTXzBG7FGSgljTMYm8yiKXPG5sVg/Nm6kW+5ACOA0VLg8C93IOjK5llTTQRA40uqhwdPHzwYMXuc68xi97lBukzaf1us6Q54c7uSDIU9iD/jPJmIfJrMD5SU6magdE9O2rUuuzkNMJ78bcX1+Ebp5r3sDfcC7siy7v4B1pL/lkyzp/YMWvp1HwTzms471ou8nequfHHn4vPb95J76ifkSYAAht6mS6lXrKwAAAABJRU5ErkJggg==);
}
.loginbtn{
    width: 100%; overflow: hidden;
    margin: 20px auto;
    text-align: center;
}
.loginbtn button.register,.loginbtn button.sign {
    height: 40px;
    border: 0px;
    border-radius: 3px;
    background-color: #009de8;
    background: -webkit-linear-gradient( #9dcb6b, #7db249 ); /* Safari 5.1 - 6.0 */
    background: -o-linear-gradient( #9dcb6b, #7db249  ); /* Opera 11.6 - 12.0 */
    background: -moz-linear-gradient( #9dcb6b, #7db249 ); /* Firefox 3.6 - 15 */
    background: linear-gradient( #9dcb6b, #7db249  ); /* 标准的语法（必须放在最后） */
    text-align: center;
    line-height: 40px;
    font-size: 18px;
    color: #fff;
    font-weight: normal;
    padding: 0;
    display: inline-block;

}
.loginbtn button.register{
    width: 120px; float: left; margin-right:10px;
}
.loginbtn button.sign{
    width: 150px; float: left;
}
.copybox {
    position: fixed;
    bottom: 3%;
    font-size: 12px;
    text-align: center;
    width: 100%;
    left: 0;
}
.updatepwd{text-decoration:underline;margin-right:5px;color:#37a9e0; font-size:13px;}
#btnReadSerialNo{padding:9px 22px;}
#login,#register{height: 40px;width:150px;border: 0px;border-radius: 3px;background: linear-gradient(#9dcb6b,#7db249);background: #007f72;text-align: center;line-height: 40px;font-size: 18px;color: #fff;font-weight: normal;padding: 0;display: inline-block;cursor: pointer;}
#verifyInput{border: 1px solid transparent;}
.input_focus{border-color: green !important;}