@charset "UTF-8";

@import url("./../../code/login/style-by-system.php");
html {background-color:#fff;}
* {color:#333;font-size:12px;font-weight:normal;line-height:1.4;}
a {text-decoration:underline; color:#5d5d5d; cursor:pointer;text-shadow:0px 1px 0px rgba(255,255,255,0.5);}
body {padding:0;margin:0;height:100%; background:url(./../../data/login-bg.png) center repeat;}


/* reset */
form, input, textarea {margin:0;padding:0;color:#000;}
table {border:0px;border-collapse:collapse;border-spacing:0;}
th, td {padding:0px;text-align: left;font-weight: normal;vertical-align:top;}
:focus {outline: 0;}
ul {list-style:disc; line-height:1.6; padding:0 0 7 0; margin:0 0 7 0;}
ul li { position:relative; margin-left:32; padding:1 0 4 0;}
img {border:0 !important;}
sup {font-size:10;}
b, b *, strong, strong * {font-weight:bold;}
i, i *, em, em * {font-style:italic;}
p {padding:3 0 3 0 !important;margin:0 !important;}
input.ftext, textarea {font-size:12;padding:2; border:1px solid #ccc;}
h1, h2, h3, h4, h5, h6 {margin:0 !important; padding:0 0 6 0 !important; line-height:1; color:#9ba0b5;font-weight:bold;}
h1 {padding-bottom:26px !important;}
h1, h1 * { font-size:24px !important; padding-top:0 !important;  color:#9ba0b5;}
h2 { padding:12 0 8 0 !important;}
h2, h2 * { font-size:18px !important;}
h3 {padding:3 0 6 0 !important;}
h3, h3 * {font-size:14 !important;}
h1.firsth, h2.firsth, h3.firsth, h4.firsth, h5.firsth, h6.firsth { padding-top:0 !important;}


/* page */
#door-box { height:100%; width:18%;  z-index:2; position:absolute; top:0; left:0; text-align:right;}
#door-box .line { width:42px; height:100%; margin-left:100%; left:-42px; top:0; position:absolute; background-image:url("./../../data/login-doorborder.gif"); background-position:top right; background-repeat:repeat-y;}
#door-box .nails-top,
#door-box .nails-bottom,
#door-box .nails-middle { height:100%; width:100%; background-image:url("./../../data/login-doornails.gif"); background-position:0 0; background-repeat:no-repeat; position:absolute; top:0; left:0;}
#door-box .nails-middle { background-position:0 50%;}
#door-box .nails-bottom { background-position:0 100%;}

#light { width:100%; height:481px; background:url(./../../data/login-light.png) top right no-repeat; position:absolute; top:0; left:0; z-index:1;}

#contentLoader { width:48px; height:48px; margin:-24px 0 0 -24px; position:absolute; top:200; left:50%; z-index:9;}

#content { width:278px; padding-top:65px; background-image:url(./../../data/login-logo.png); -background-image:url(./../../data/login-ie-logo.png); background-position:91px 0px; background-repeat:no-repeat; z-index:10; position:absolute; top:0px; margin-left:50%; left:-139px; margin-top:-20px;}

#browser-list { width:278px;}
#browser-list .req-browser, #browser-list .req-browser-bg, #browser-list .req-browser-item, #browser-list .req-browser-link { width:278px; height:63px; display:block; position:absolute; top:0; left:0; overflow:hidden;}
#browser-list .req-browser-bg { width:556px;}
#browser-list .req-browser-item { height:500px; width:278px;}
#browser-list .req-browser { position:relative;}
#browser-list .req-browser .req-browser-link { z-index:8;}
#browser-list .req-browser .req-browser-item { z-index:5; background-position:0px 0px; background-image:url(./../../data/login-browsers.png); -filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=./../../data/login-browsers.png,sizingMethod=crop); -background:none;}
#browser-list .req-browser .req-browser-bg { background-image:url(./../../data/login-blist-bg.png); background-position:0px -63px; z-index:2;}
#browser-list .req-browser.first-child .req-browser-bg { background-position:0px 0px;}
#browser-list .req-browser.last-child .req-browser-bg { background-position:0px -126px;}
#browser-list .req-browser.only-child .req-browser-bg { background-position:0px -189px;}
#browser-list .req-browser.hover .req-browser-bg { left:-278px;}
#browser-list .req-browser.safari .req-browser-item {}
#browser-list .req-browser.chrome .req-browser-item { top:-63px;}
#browser-list .req-browser.firefox .req-browser-item { top:-126px;}
#browser-list .req-browser.opera .req-browser-item { top:-189px;}
#browser-list .req-browser.ie .req-browser-item { top:-252px;}

#browser-list .text, #browser-list .ps, .change-link { font-size:14px; color:#d1d1d1; text-shadow: #444444 0px 1px 0px; text-align:center; display:block;}
#browser-list .text {margin-bottom:16px;}
#browser-list .ps, .change-link {padding-top:12px; font-size:12px;}

#login-in, #forget { position:relative; width:278px; z-index:6;}
#forget { display:none;}

#login-in.fly, #forget.fly { position:absolute; top:65px; left:0px; z-index:8;}

.form-box { position:relative; width:278px; background-image: linear-gradient(bottom, #787878 0%, #888888 100%); background-image: -o-linear-gradient(bottom, #787878 0%, #888888 100%);  background-image: -ms-linear-gradient(bottom, #787878 0%, #888888 100%); background-image: -webkit-linear-gradient(bottom, #787878 0%, #888888 100%);background-image: -moz-linear-gradient(bottom, #787878 0%, #888888 100%); border-radius:4px; box-shadow: 0px 1px 0px rgba(255,255,255,0.45), inset 0px 1px 2px rgba(0,0,0,0.65);}
#login-in .login, #login-in .password, #forget .forgetemail, #login-in .text-login, #login-in .text-password, #forget .text-forgetemail {background:transparent; border:none; width:100%; height:52px; color:#fff; z-index:6; position:relative;}
#login-in .login {border-bottom:1px solid #5d5d5d;}
#login-in .password {border-top:1px solid #a0a0a0;}
#login-in .login, #login-in .password, #forget .forgetemail {text-shadow: rgba(86,86,86,1) 0px 1px 0px;}
#login-in .text-login, #login-in .text-password, #forget .text-forgetemail { position:absolute; top:0; left:0; color:#000; height:52; z-index:4; }
input:disabled { color:#a4a4a4; text-shadow: #5e5e5e 0px 1px 0px;-webkit-text-fill-color: #a4a4a4; opacity:0.8;}
#login-in .text-password { top:52px;}
#login-in .login, #login-in .password, #login-in .text-login, #login-in .text-password, #forget .forgetemail, #forget .text-forgetemail { font-size:20px; padding-left:19px;}


.button_place { background-color:#a3a3a3; position:relative; padding:5px; margin-top:15px; border-radius:6px;}
.button_place input { border-radius:4px; font-size:20px; font-weight:bold; color:#333;text-shadow: rgba(255,255,255,0.4) 0px 1px 0px; width:268px; border:none; height:35px; line-height:1.6;box-shadow: 0px 1px 0px rgba(255,255,255,0.3), inset 0px 1px 2px rgba(0,0,0,0.75);background-image: -o-linear-gradient(bottom, rgb(85,86,86) 0%, rgb(150,150,150) 50%, rgb(169,169,169) 51%, rgb(214,214,214) 100%);background-image: -moz-linear-gradient(bottom, rgb(85,86,86) 0%, rgb(150,150,150) 50%, rgb(169,169,169) 51%, rgb(214,214,214) 100%);background-image: -webkit-linear-gradient(bottom, rgb(85,86,86) 0%, rgb(150,150,150) 50%, rgb(169,169,169) 51%, rgb(214,214,214) 100%);background-image: -ms-linear-gradient(bottom, rgb(85,86,86) 0%, rgb(150,150,150) 50%, rgb(169,169,169) 51%, rgb(214,214,214) 100%); cursor:pointer;}
.button_place input:hover {background-image: -webkit-linear-gradient(bottom, rgb(95,96,96) 0%, rgb(160,160,160) 50%, rgb(179,179,179) 51%, rgb(224,224,224) 100%);background-image: -o-linear-gradient(bottom, rgb(95,96,96) 0%, rgb(160,160,160) 50%, rgb(179,179,179) 51%, rgb(224,224,224) 100%);background-image: -moz-linear-gradient(bottom, rgb(95,96,96) 0%, rgb(160,160,160) 50%, rgb(179,179,179) 51%, rgb(224,224,224) 100%);background-image: -ms-linear-gradient(bottom, rgb(95,96,96) 0%, rgb(160,160,160) 50%, rgb(179,179,179) 51%, rgb(224,224,224) 100%);}
.button_place input:active {background-image: -webkit-linear-gradient(bottom, rgb(65,66,66) 0%, rgb(130,130,130) 50%, rgb(149,149,149) 51%, rgb(194,194,194) 100%);background-image: -o-linear-gradient(bottom, rgb(65,66,66) 0%, rgb(130,130,130) 50%, rgb(149,149,149) 51%, rgb(194,194,194) 100%);background-image: -moz-linear-gradient(bottom, rgb(65,66,66) 0%, rgb(130,130,130) 50%, rgb(149,149,149) 51%, rgb(194,194,194) 100%);background-image: -ms-linear-gradient(bottom, rgb(65,66,66) 0%, rgb(130,130,130) 50%, rgb(149,149,149) 51%, rgb(194,194,194) 100%);}
.button_place input:disabled {background-image: linear-gradient(bottom, rgb(127,127,128) 0%, rgb(157,157,158) 50%, rgb(168,168,168) 51%, rgb(188,188,188) 100%);background-image: -o-linear-gradient(bottom, rgb(127,127,128) 0%, rgb(157,157,158) 50%, rgb(168,168,168) 51%, rgb(188,188,188) 100%);background-image: -moz-linear-gradient(bottom, rgb(127,127,128) 0%, rgb(157,157,158) 50%, rgb(168,168,168) 51%, rgb(188,188,188) 100%);background-image: -webkit-linear-gradient(bottom, rgb(127,127,128) 0%, rgb(157,157,158) 50%, rgb(168,168,168) 51%, rgb(188,188,188) 100%);background-image: -ms-linear-gradient(bottom, rgb(127,127,128) 0%, rgb(157,157,158) 50%, rgb(168,168,168) 51%, rgb(188,188,188) 100%) !important; color:#797979 !important; -webkit-text-fill-color: #797979 !important; text-shadow: rgba(255,255,255,0.5) 0px 1px 0px !important;}

#hint-box { position:absolute; margin-left:50%; left:-139px; width:278px; z-index:11;}
#hint-box .hint-item-content { padding:12px; border-bottom:1px solid #5d5d5d; color:#d1d1d1; text-shadow: #444444 0px 1px 0px; text-align:center; }
#hint-box .hint-item {border-bottom:1px solid #a0a0a0; position:relative; margin-top:0; background-color:rgba(0,0,0,0.1);}

#user-message { width:700px; position:relative; margin:0 auto; padding-top:120;}
#user-message div { width:600px; padding:30px 50px; border-radius:4px; background-color:rgba(0,0,0,0.1);}
#user-message div, #user-message div * {color:#d1d1d1 !important; text-shadow: #444444 0px 1px 0px; font-size:14px;}