@charset "utf-8";

*{ word-wrap: break-word; outline:none; }
html, body { height:100%; margin:0; -webkit-text-size-adjust:none; }
body { background:url("../images/admin/login_bg.jpg") center top no-repeat;}
h2, h5, h6 { margin: 0;}
input { outline:none}

.login-layout { width: 320px; margin: -200px auto auto -160px; position: absolute; z-index: 3; top: 50%; left: 50%; }
.login-layout .top { color: #FFF; width: 100%px; height: 60px; margin: 0 auto; position: relative; z-index: 1;}
.login-layout .top h5 { font-size: 13px; line-height: 20px; display: block; height: 20px; position: absolute ; z-index: 1; top: 0; left: 0;}
.login-layout .top h5 em { font-family:Tahoma; font-size: 10px; font-style: normal; margin-left: 4px;}
.login-layout .top h2 { font-size: 32px; line-height: 36px; display: block; height: 36px; position: absolute ; z-index: 1; top: 20px; left: 0;}
.login-layout .top h6 { font-size: 11px; line-height: 16px; display: block; height: 16px; position: absolute ; z-index: 1; top: 44px; left: 224px;}

#error{position: absolute; right: 0; bottom: -10px; color: red;}
.login-layout .box { height: 40px; margin: 30px 0 0 0;}
.login-layout .box span { display: block; padding: 0; margin: 0 0 33px 0; position: relative; z-index: 1;}
.login-layout .box span label { font-size: 14px; line-height: 20px; color: #fff; display: block; height: 20px; padding-right: 10px; position: absolute; z-index: 9; top: 10px; left: 20px;}

.input-text, .input-password, .input-code { font-size: 14px; color: #fff; line-height: 28px; filter: progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#CCFFFFFF', endColorstr='#CCFFFFFF'); background:rgba(0,0,0,0.2); height: 28px; *float: left/*IE7*/; padding: 6px 0; border: 0; 
border-radius: 18px; position: relative; z-index: 1; /*box-shadow: inset 1px 1px 0 rgba(0,0,0,0.5); -webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,0.5)*//*webkit*/;}
.input-text:focus, .input-password:focus, .input-code:focus { color: #fff; background:rgba(0,0,0,0.3); /*box-shadow: 1px 1px 0 0 rgba(0,0,0,0.25);*//*IE8*/  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')"; /*IE5.5-7*/ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');}
.input-text, .input-password { width: 260px; padding-left: 60px;}
.input-code { width: 160px; padding-left:20px;}

.code { background-color: #FFFFFF; width:160px; height: 38px; border: solid 1px #555; border-radius: 4px; position: absolute; z-index: 9; top: 0px; left: -170px; display: none; box-shadow: 0 2px 2px 2px rgba(0,0,0,0.25);}
.code .arrow { background:url(../images/login/login_code.gif) no-repeat 0 0; display: block; width: 14px; height: 7px; position: absolute; left: 21px; bottom: -7px;}
.code img { width: auto; height:30px; position: absolute; z-index: 1; top: 4px; left: 4px;}
.code .close { display: block; width: 10px; height: 10px; padding: 1px; position: absolute; z-index: 1; top: 4px; right: 4px;}
.code .close:hover, .login-layout .box span .code .change:hover { background-color: #CCC; border-radius: 5px; -webkit-border-radius: 5px/*webkit*/;}
.code .close i { background: url(../images/login/login_code.gif) no-repeat 0 -7px; display: block; width: 10px; height: 10px; opacity: 0.5;}
.code .change { display: block; width: 10px; height: 10px; padding: 1px; position: absolute; z-index: 1; bottom: 4px; right: 4px;}
.code .change i { background: url(../images/login/login_code.gif) no-repeat -10px -7px; display: block; width: 10px; height: 10px; opacity: 0.5;}
.code .close:hover i , .login-layout .box span .code .change:hover i { opacity: 1;}

.input-button { font-size: 15px; color: #FFF; filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#BF000000', endColorstr='#BF000000');background:rgba(0,138,220,0.8); width: 125px; height: 40px; padding:6px 0; border: 0; border-radius: 18px; cursor: pointer;}
::-webkit-input-placeholder{color:#fff;}
:-moz-placeholder {color: #fff;} 
::-moz-placeholder {color: #fff;} 
:-ms-input-placeholder { color: #fff;} 
.input-button:hover { background:rgba(0,138,220,1);}

.login-layout .box .username-box{}
.login-layout .box .username-box i{width:20px; height:20px; display: block; position: absolute; top:10px; right:10px; background:url('../images/login/username_ico.png') center center no-repeat; z-index: 9;}
.login-layout .box .username-box i.active{width:20px; height:20px; display: block; position: absolute; top:10px; right:10px; background:url('../images/login/username_active_ico.png') center center no-repeat; z-index: 9;}
.login-layout .box .password-box{}
.login-layout .box .password-box i{width:20px; height:20px; display: block; position: absolute; top:10px; right:10px; background:url('../images/login/password_ico.png') center center no-repeat; z-index: 9;}
.login-layout .box .password-box i.active{width:20px; height:20px; display: block; position: absolute; top:10px; right:10px; background:url('../images/login/password_active_ico.png') center center no-repeat; z-index: 9;}
.login-layout .box .captcha-box{width:180px; display: inline-block;}
.login-layout .box .login-box{width:125px; margin-left:9px; display: inline-block;}

.bottom {  font-family: Verdana, Tahoma; line-height: 16px; color: #FFF; text-shadow: 1px 1px 0 rgba(0,0,0,0.25); text-align: center; width: 600px; margin-left: -300px; position: fixed; bottom: 60px; left: 50%;}
.bottom a { color: #FFFFFF; text-decoration: none;}
.bottom a:hover { color: #FF0; text-decoration: blink;}
.bottom h5 {font-size: 12px;}
.bottom h6 { font-size: 10px;}