@charset "utf-8";

/*------------呼吸-全局通用(CSS3)------------*/
@-webkit-keyframes scale {
    0% {-webkit-transform:scale(1,1)}
    50% {-webkit-transform:scale(0.92,0.92)}
    100% {-webkit-transform:scale(1,1)}
}
@-moz-keyframes scale {
    0% {-moz-transform:scale(1,1)}
    50% {-moz-transform:scale(0.92,0.92)}
    100% {-moz-transform:scale(1,1)}
}
@-o-keyframes scale {
    0% {-o-transform:scale(1,1)}
    50% {-o-transform:scale(0.92,0.92)}
    100% {-o-transform:scale(1,1)}
}
@keyframes scale {
    0% {transform:scale(1,1)}
    50% {transform:scale(0.92,0.92)}
    100% {transform:scale(1,1)}
}

/*------------呼吸2-全局通用(CSS3)------------*/
@-webkit-keyframes scale2 {
    0% {-webkit-transform:scale(1,1)}
    50% {-webkit-transform:scale(1.1,1.1)}
    100% {-webkit-transform:scale(1,1)}
}
@-moz-keyframes scale2 {
    0% {-moz-transform:scale(1,1)}
    50% {-moz-transform:scale(1.1,1.1)}
    100% {-moz-transform:scale(1,1)}
}
@-o-keyframes scale2 {
    0% {-o-transform:scale(1,1)}
    50% {-o-transform:scale(1.1,1.1)}
    100% {-o-transform:scale(1,1)}
}
@keyframes scale2 {
    0% {transform:scale(1,1)}
    50% {transform:scale(1.1,1.1)}
    100% {transform:scale(1,1)}
}

@-webkit-keyframes rotation{
from {-webkit-transform: rotate(0deg);}
to {-webkit-transform: rotate(360deg);}
}


/*------------------------ Reset ------------------------*/
body {background:#3ca1ef;}
.ms{font-size:12px}
.mx{font-size:16px}
#middle {width:700px; height:285px; position:fixed; left:50%; top:50%; margin:-150px auto auto -350px;}
.login {width:279px; height:250px; top:29px; left:336px; z-index:10;}
.login .title {width:100%; height:46px; line-height: 46px; background:#ffa632; border-radius:3px 3px 0 0; color:#fff; margin-bottom:-1px;}
.login .content {width:100%; height:205px; background:#fff;padding:1.2em 2em;}
.login .content .h2 {color:#ff6600;}
.user,.password {display:block; width:100%; height:33px; border:1px solid #bbb; margin:1em 0; position:relative; border-radius:3px;}
.user.on,.password.on {border-color:#ffa826;}
.login .content label b {display:block; width:33px; height:33px; z-index: 11; position: absolute; top:0; left:0;}
.login .content label.user b {background:url(/Content/images/user.png) center center no-repeat;}
.login .content label.password b {background:url(/Content/images/pass.png) center center no-repeat;}
.enter,.reset {display:block;width:46%; height:33px; margin:.5em 0; position:relative; border-radius:5px; cursor:pointer;}
.enter {background:#66b73f;}
.enter:hover {background:#82ca5e;}
.enter:active {background:#519131;}
.reset {background:#ff9900;}
.reset:hover {background:#ffa826;}
.reset:active {background:#b26b00;}
.login .content label input {width:100%; height:100%; border:0; background:transparent; z-index: 11;}
.login .content label.user input,.login .content label.password input {width:100%; height:100%; border:0; padding:0 2em 0 3em; background:transparent; z-index: 11;}
.login .content label.enter input,.login .content label.reset input {width:100%; height:100%; border:0; background:transparent; z-index: 11;  text-align: center; color:#fff; cursor:pointer;}
/*.login .foot {width:100%; height:5px; background:url(/Content/images/logofootbg.png) repeat-x; border-radius:0 0 3px 3px; overflow: hidden;}*/

.cloud {z-index:1;}
.cloud em {display:block; position:absolute; background:#64c2ff;border-radius:100%; animation:scale2 4s linear infinite;  -webkit-animation:scale2 4s linear infinite;  -moz-animation:scale2 4s linear infinite;  -o-animation:scale2 4s linear infinite;}
.cloud em.ro1 
{
    width:172px; height:172px; background: url(/Content/images/cloud.jpg) center center no-repeat; background-size:100%100%;
    left:71px; top:50px;
    animation:scale 5s linear infinite; 
    -webkit-animation:scale 5s linear infinite;  
    -moz-animation:scale 5s linear infinite;  
    -o-animation:scale 5s linear infinite;
    
    /*-webkit-transform: rotate(360deg);
    animation: rotation 10s ease-in-out infinite;
    -moz-animation: rotation 10s ease-in-out infinite;
    -webkit-animation: rotation 10s ease-in-out infinite;
    -o-animation: rotation 10s ease-in-out infinite;*/
 }
.cloud em.ro2 {width:74px; height:74px; background:#4dbafd url(/Content/images/ro2.png) center center no-repeat; left:217px; top:54px; animation-delay:2.5s; -webkit-animation-delay:2.5s;}
.cloud em.ro3 {width:116px; height:116px; background:#64c2ff url(/Content/images/ro3.png) center center no-repeat; left:208px; top:108px;}
.cloud em.ro4 {width:71px; height:71px; background:#64c2ff url(/Content/images/ro4.png) center center no-repeat; left:55px; top:185px;animation-delay:1.5s; -webkit-animation-delay:1.5s;}
.cloud em.ro5 {width:20px; height:20px; left:0; top:187px;}
.cloud em.ro6 {width:30px; height:30px; left:35px; top:150px;}
.cloud em.ro7 {width:70px; height:70px; background:#64c2ff url(/Content/images/ro7.png) center center no-repeat; left:25px; top:70px;animation-delay:2s; -webkit-animation-delay:2s;}
.cloud em.ro8 {width:26px; height:26px; left:399px; top:0;}
.cloud em.ro9 {width:19px; height:19px; left:622px; top:182px;}
.cloud em.ro10 {width:13px; height:13px; left:676px; top:119px;animation-delay:2.5s; -webkit-animation-delay:2.5s;}
.cloud em.ro11 {width:9px; height:9px; left:640px; top:104px;}
.line {width:700px; height:280px;position:absolute; left:0; top:0; z-index: -1;}
.kehao {position:absolute; left:0; top:260px; width:325px;height:2em; color:#fff;animation:scale2 6s linear infinite;  -webkit-animation:scale2 6s linear infinite;  -moz-animation:scale2 6s linear infinite;  -o-animation:scale2 6s linear infinite;}

#footer {width:100%; height:5em; position:absolute; left:0; bottom:6%; color:#fff;}