﻿* {font-family: Arial, Helvetica, sans-serif; font-size: 12px; margin: 0; padding: 0; box-sizing: border-box; color: #525252;}
.clear {clear: both;}
.pageWrapper {width: 790px; margin: 20px auto;}
.logo {width: 370px; margin: 0 0 30px;}
.logo img {width: 100%;}
.centerContent {display: flex; flex-direction: row;}
.leftBar {flex-basis: 47%; border: 1px solid #cfcfcf; padding: 10px 10px 20px;}
.leftBar h1 {color: #4c83ff; font-size: 16px; margin: 0 0 20px;}
.leftBar h3 {color: #525252; font-weight: normal; font-size: 12px; margin: 0 0 20px;}
.block1, .block2 {position: relative;}
.block1 label, .block2 label {float: left; color: #525252; width: 90px; margin: 2px 10px 0 0; font-size: 12px;}
#userNameBox, #passWordBox {padding: 3px; margin: 0 0 20px; width: 170px;}
.forgotPwd {margin: 20px 0 0 100px;}
.forgotPwd a {color: #4c83ff; text-decoration: none; font-size: 12px;}
.loginWrap {margin: 0px 30px 0 100px; width: 170px;}
#LoginBtn {border: 0; background: #97b85b; cursor: pointer; width: 100%; color: #fff; font-size: 14px; padding: 5px 0;}
.needHelp {margin: 20px 0 50px;}
.needHelp p {color: #999;}
.needHelp a, .rightBar p a {color: #4c83ff; font-size: 13px;}
.needHelp p span {display: block;}
.rightBar {flex-basis: 47%; margin: 0 0 0 6%; padding: 10px; border: 1px solid #cfcfcf;}
.rightBar h1 {font-size: 16px; color: #525252; margin: 10px 0 0;}
.rightBar h2 {margin: 20px 0 0;}
.rightBar ul {margin: 10px 0 0 25px;}
.rightBar ul li {line-height: 20px;}
.rightBar p {color: #525252; font-size: 13px;}
.rightBar a {font-size: 13px;}
.rightImg {width: 90%; margin: 40px auto 20px;}
.rightImg img {width: 100%;}
.copyrights {border-top: 1px solid #ccc; padding: 10px 0 0;	color: #999; margin: 30px 0 0; font-size: 14px;}
.error {color: #ff0000; margin: 0 0 10px;}
#valUserName, #valPassWord {position: absolute; top: 5px; right: 80px; font-size: 16px;}
@media all and (max-width: 960px) {.pageWrapper {width: 740px;} .needHelp {margin: 20px 0 20px;} #valUserName, #valPassWord {right: 60px;}}
@media all and (max-width: 740px) {.pageWrapper {width: 350px;} .centerContent {flex-direction: column;} .leftBar, .rightBar {width: 100%;} .rightBar {margin: 30px 0 0;}}
@media all and (max-width: 440px) {.pageWrapper {width: 90%;} #valUserName, #valPassWord {left: 260px;}}