*{margin:0px; padding:0px;}
body{width:100%; height:100%;}
.cleatfix:after{content: ""; display: block; clear: both; visibility: hidden;}
.bg-1{background: url("../img/bg/bg1.png") no-repeat; position: fixed; top:0; left:0; width: 100%; height: 100%; z-index: -1;background-size: cover; -webkit-background-size:cover; -moz-background-size:cover; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/static/templates/edu/img/bg/bg1.png', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/static/templates/edu/img/bg/bg1.png', sizingMethod='scale')";animation: showBg 1s; -webkit-animation: showBg 1s;-moz-animation: showBg 1s;-o-animation: showBg 1s;}
.bg-2{background: url("../img/bg/bg2.png") no-repeat; position: fixed; top:0; left:0; width: 100%; height: 100%; z-index: -1; background-size: cover; -webkit-background-size:cover; -moz-background-size:cover; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/static/templates/edu/img/bg/bg2.png', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/static/templates/edu/img/bg/bg2.png', sizingMethod='scale')";}
.bg-3{background: url("../img/bg/bg3.png") no-repeat; position: fixed; top:0; left:0; width: 100%; height: 100%; z-index: -1; background-size: cover; -webkit-background-size:cover; -moz-background-size:cover; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/static/templates/edu/img/bg/bg3.png', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/static/templates/edu/img/bg/bg3.png', sizingMethod='scale')";} 
.bg-1.bg-1-add{animation: showBg 1s; -webkit-animation: showBg 1s;-moz-animation: showBg 1s;-o-animation: showBg 1s;}
.bg-2.bg-2-add{animation: showBg 1s; -webkit-animation: showBg 1s;-moz-animation: showBg 1s;-o-animation: showBg 1s;}
.bg-3.bg-3-add{animation: showBg 1s; -webkit-animation: showBg 1s;-moz-animation: showBg 1s;-o-animation: showBg 1s;}
.bg-1.bg-1-remove{animation: hideBg 0.2; -webkit-animation: hideBg 0.2;-moz-animation: hideBg 0.2;-o-animation: hideBg 0.2;}
.bg-2.bg-2-remove{animation: hideBg 0.2; -webkit-animation: hideBg 0.2;-moz-animation: hideBg 0.2;-o-animation: hideBg 0.2;}
.bg-3.bg-3-remove{animation: hideBg 0.2; -webkit-animation: hideBg 0.2;-moz-animation: hideBg 0.2;-o-animation: hideBg 0.2;}
#loginWindow{width: 601px; height: 347px; position: absolute; background-color: #FFFFFF; right: 0px; top:50%; margin:auto 0;margin-top: -174px; border-radius: 3px; -moz-border-radius:3px; -webkit-border-radius:3px; behavior: url("../lib/iecss3.htc");overflow: hidden;}
#loginWindow .loginLogo{width:450px; height:88px; background: url(../img/login_logo.png) no-repeat; position: absolute; left: 56px; top:47px;}
#loginWindow .loginTitle{position: absolute; left: 240px; top:33px;}
#loginWindow .loginTitle h2.en{font-size: 26px; color: #00a2d4; font-style: normal; font-weight: 100;}
#loginWindow .loginTitle h2.cn{font-size: 35px; color: #00a2d4;}
#loginWindow .role{position: absolute; left: 32px; top:166px;}
#loginWindow .role div{display: inline-block; overflow: hidden;}
#loginWindow .role > div{margin-left: 30px;}
#loginWindow .role .teacher,#loginWindow .role .student,#loginWindow .role .parent{float: left;}
#loginWindow .role .radio{width: 18px; height: 18px; cursor: pointer; background: url("../img/img.png") no-repeat -480px -120px; display: inline-block;margin-right: 4px;}
#loginWindow .role .radio.on,#loginWindow .role .radio:hover{background-position: -454px -120px;}
#loginWindow .role .role_name{font-size: 13px; color: #484848;cursor: pointer;display: inline-block;float:left;}
#loginWindow .role .role-hide{display: none;}
#loginWindow .rememberMe{position: absolute;right:107px;top: 166px;width:70px;text-align: right;}
#loginWindow .rememberMe .checkbox-hide{display: none;}
#loginWindow .rememberMe .checkbox{float:left;width: 18px; height: 18px; cursor: pointer; background: url("../img/checkbox.png") no-repeat 0px 0px; display: inline-block;}
#loginWindow .rememberMe .checkbox.on{ background-image: url("../img/checkbox_checked.png");}
#loginWindow .rememberMe .remeber_label{display: inline-block; overflow: hidden;cursor: pointer;}
#loginWindow .input-window{position: absolute; left: 32px; top:198px; width: 100%;}
#loginWindow .input-window > div{display: inline-block; border: 1px solid #dcdcdc; margin-left: 10px;}
#loginWindow .input-window > div:first-child{margin-left: 30px;}
#loginWindow .input-window  .user-name,#loginWindow .input-window  .user-pwd{display: inline-block;width:210px;float:left;}
#loginWindow .input-window  .user-name > div,#loginWindow .input-window  .user-pwd > div{float: left; height: 44px; width: 34px; text-align: center; position: relative;}
#loginWindow .input-window  .user-name .name-inner:after,#loginWindow .input-window  .user-pwd .pwd-inner:after{width: 21px; height: 21px; display: block; content: "";position: absolute; top: 0px; bottom: 0px; margin:auto 16px;}
#loginWindow .input-window  .user-name .name-inner:after{background: url("../img/user.png") no-repeat;}
#loginWindow .input-window  .user-pwd .pwd-inner:after{background: url("../img/pwd.png") no-repeat;}
#loginWindow .input-window input{width: 163px; font-size: 20px; border: 0px; outline: none; float: left; margin-left: 10px;  margin-top: 10px;  box-shadow: none; padding: 2px 0px;}
#loginWindow .input-window .submit-btn{width: 53px; height: 53px; cursor: pointer; background: url("../img/img.png") no-repeat -547px -92px; position: relative; top: -16px; right: 60px; border: 0px; margin-left: 16px; text-indent: -9999px; float: right;}
#loginWindow .input-window .loginWarning{position: absolute;left: 20px;bottom: -21px;background-color: #F8C4E1;width: 209px;height: 25px;line-height: 25px;font-size: 12px;color: #FD5081;text-align: center;border-radius: 3px;}
#loginWindow .bg-change{position: absolute; left: 30px; top: 281px; margin-left: 31px;width:300px;}
#loginWindow .bg-change .smallBox{float: left;}
#loginWindow .bg-change > div{float:left;width: 34px; height: 39px; display: inline-block; margin-right: 31px;cursor:pointer;}
#loginWindow .bg-change .mask1,#loginWindow .bg-change .mask2,#loginWindow .bg-change .mask3{position:absolute;left:0; background: url("../img/img.png") no-repeat -502px -100px;}
#loginWindow .bg-change .mask2{left:65px}
#loginWindow .bg-change .mask3{left:130px}
#loginWindow .bg-change .bg1.on{background:url("../img/bg/bg1.png") no-repeat -761px -614px;}
#loginWindow .bg-change .bg2.on{background:url("../img/bg/bg2.png") no-repeat -141px -51px;;}
#loginWindow .bg-change .bg3.on{background:url("../img/bg/bg3.png") no-repeat;}
#loginWindow .bg-change .bg1{background:url("../img/bg/bg1_h.png") no-repeat -761px -614px;}
#loginWindow .bg-change .bg2{background:url("../img/bg/bg2_h.png") no-repeat -141px -51px;}
#loginWindow .bg-change .bg3{background:url("../img/bg/bg3_h.png") no-repeat;}
.radio, .checkbox {
  padding-left: 0px;
}
.clients-download {position:absolute; right:10px;bottom:5px;list-style-type: none;}
.clients-download li{float:left;margin-left:10px;}
.clients-download li span{margin-right: 4px;}
.clients-download li a{font-size:16px;color:#fff;}
.clients-download li a:hover{text-decoration: underline;}

@keyframes showBg{
        0% {opacity: 0;}
        100% {opacity: 1;}
}
@-webkit-keyframes showBg{
        0% {opacity: 0;}
        100% {opacity: 1;}
}
@-moz-keyframes showBg{
        0% {opacity: 0;}
        100% {opacity: 1;}
}
@-o-keyframes showBg{
        0% {opacity: 0;}
        100% {opacity: 1;}
}

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

@-webkit-keyframes hideBg {
    0% {opacity: 1;}
    100% {opacity: 0;}
}
@-moz-keyframes hideBg {
    0% {opacity: 1;}
    100% {opacity: 0;}
}
@-o-keyframes hideBg {
    0% {opacity: 1;}
    100% {opacity: 0;}
}
.login_form_tip{position: absolute;left:62px;top:250px;font-size: 12px;}
.login_form_tip p{display: none;}
.login_form_tip .alert-block{border:none !important;background: none  !important;padding:0 !important;margin-bottom: 0 !important;}
.login_form_tip .alert-block ul{padding: 0;margin: 0;}
.login_form_tip .alert-block li{list-style-type: none;}
