/* -------------------------------------------------------------------------------------
 
---------------------------------------------------------------------------------------- */

/* Reset
---------------------------------------------------------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0;padding:0;}
table{border-collapse:collapse;width:100%;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,th,var{font-style:normal;font-weight:normal;}
ol,ul{list-style:none;}
caption{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:bold;text-rendering:optimizeLegibility;}
q:before,q:after{content:'';}
abbr,acronym{border:0;}
a{outline:none;text-decoration:none;}
article,aside,figure,footer,header,hgroup,nav,section{display:block;}
.center {text-align:center;}
/* Base
---------------------------------------------------------------------------------------- */
body {font-family:Arial;font-size:12px;}
html {-webkit-font-smoothing:antialiased;}

input:focus {outline:none;}

.clear {clear:both;}
.hidden {display:none;}
.loginPage {background:url(../img/loginbg.png) repeat 0 0;padding:120px;}
.loginPage a {cursor:pointer;}
.loginPage .logo, .loginBox {margin:0 auto;}
.loginPage .logo {background:url(../img/logo.png) no-repeat 0 0;display:block;width:176px;height:58px;margin-bottom:30px;}
.loginPage .loginBox {background:url(../img/loginbox.png) no-repeat 0 0;width:340px;height:200px;position:relative;}
.loginPage .loginBox label {display:inline-block;float:left;clear:left;width:70px;margin:20px 5px 0px 20px;line-height:40px;font-weight:bold;color:#3d698c;text-shadow:0px 1px 0px #CBD2D8;}
.loginPage .inputWrapper {background:url(../img/loginput.png) no-repeat 0 center;width:200px;height:40px;float:left;margin:20px 20px 0px 10px;border:0;}
.loginPage p {display: block;font-size: 11px;padding: 20px 0;text-align: center;color:#222;}
.loginPage .loginBox .biginput {background-color:transparent;border:0;margin:12px 0;padding:0 7px 0 5px;width:190px;}
.loginPage .loginBox span {float:left;clear:both;margin:25px 15px -39px 21px;font-size:11px;color:#545454;text-shadow:0px 1px 0px #c8d2d4;}
.loginPage .loginBox .forget {position:relative;top:22px;}
.loginPage .loginBox .forget:hover {color:#3D698C;}
.loginPage .loginBox input.btnDarkright {position:absolute;bottom:20px;right:34px;background:url(../img/loginbtn.png) no-repeat center 2px;width:80px;height:31px;border:0;font-weight:bold;font-family:Arial;color:#808080;text-shadow:0px -1px 0 #000;cursor:pointer;}
.loginPage .loginBox input.btnDarkright:hover {color:#fff;}
.loginPage .loginBox input.btnDarkleft {position:absolute;bottom:20px;left:130px;background:url(../img/loginbtn.png) no-repeat center 2px;width:80px;height:31px;border:0;font-weight:bold;font-family:Arial;color:#808080;text-shadow:0px -1px 0 #000;cursor:pointer;}
.loginPage .loginBox input.btnDarkleft:hover {color:#fff;}
.loginPage .loginBox span.alert {color:red;}

/* Wrapper
---------------------------------------------------------------------------------------- */
#wrapper {width:100%;min-width:960px;}
    
/* top menu
---------------------------------------------------------------------------------------- */
nav#top_menu {overflow:hidden;background:url(../img/topmenu_bg.png) repeat-x;height:39px;}
nav#top_menu ul.menu {float:left;}
nav#top_menu ul.menu li {float:left;padding:13px 20px 13px 5px;border-right:1px solid #000;}
nav#top_menu ul.menu li.last {border-right:0;}
nav#top_menu ul.menu li:hover {background:url(../img/topmenu_hover_bg.png) 0 0 repeat-x;}
nav#top_menu ul.menu li.active {background:url(../img/topmenu_hover_bg.png) 0 0 repeat-x;}
nav#top_menu ul.menu li a {color:#fff;font:bold 12px Arial;}
nav#top_menu ul.menu li a:hover {color:#16a3c4;text-shadow:0px 0px 5px #16a3c4;}
nav#top_menu ul.menu li.active a {color:#16a3c4;text-shadow:0px 0px 5px #16a3c4;}

/* result menu hover & active
---------------------------------------------------------------------------------------- */
ul.menu li a.result {background:url(../img/sprite-icon.png) scroll -56px -31px no-repeat transparent;padding:4px 0 3px 20px;}
ul.menu li a.result:hover, ul.menu li.active a.result {background-position:-56px -56px;}

/* mangae menu hover & active
---------------------------------------------------------------------------------------- */
ul.menu li a.manage {background:url(../img/sprite-icon.png) scroll -56px -79px no-repeat transparent;padding:4px 0 3px 20px;}
ul.menu li a.manage:hover, ul.menu li.active a.manage {background-position:-56px -103px;}

/* invoice menu hover & active
---------------------------------------------------------------------------------------- */
ul.menu li a.invoice {background:url(../img/sprite-icon.png) scroll -56px -128px no-repeat transparent;padding:4px 0 3px 20px;}
ul.menu li a.invoice:hover, ul.menu li.active a.invoice {background-position:-56px -152px;}

/* help hover & active
---------------------------------------------------------------------------------------- */
ul.menu li a.help {background:url(../img/helpBtn.png) scroll 0 3px no-repeat transparent;padding:4px 0 3px 20px;}
ul.menu li a.help:hover, ul.menu li.active a.help {background-position:0 -17px;}

/* profile
---------------------------------------------------------------------------------------- */
ul.profile {padding:12px;float:right;}
ul.profile li {float:left;margin:0 20px;color:#fff;font:bold 12px Arial;}
ul.profile li a {color:#fff;font:bold 12px Arial;}
ul.profile li a.changepass {font:normal 11px Arial;}
ul.profile li .showBox {background: none repeat scroll 0 0 #E8E8E8;box-shadow: 1px 1px 2px #000000;width:138px;display: none;padding: 15px;position: absolute;right: 147px;top: 7px;}
ul.profile li .showBox label, ul.profile li .showBox input {display:block;margin-bottom:7px;}
ul.profile li .showBox a.changepass_close {background:url(../img/close.png) no-repeat 0 0;display:block;width:16px;height:16px;float:right;position:absolute;right:5px;top:5px;}
ul.profile li .showBox input[type="submit"] {float:right;margin:10px 0 0 0;background:url(../img/btn1.png) no-repeat 0 0;border:0;padding:3px 6px;font-size:12px;font-family:Arial;cursor:pointer;height:23px;}
ul.profile li .error {font-size:11px;color:red;}
ul.profile li a.logout {background:url(../img/sprite-icon.png) no-repeat scroll 20px -32px transparent;padding:2px}
ul.profile li a.logout span {padding-right:30px;font:normal 11px Arial;}
.showBox label {color:#333333;}
/* choose menu
---------------------------------------------------------------------------------------- */
div#choose_menu {overflow:hidden;background:url(../img/choosemenu_bg.png) 0 0 repeat-x;}
div#choose_menu div.question_customer, div.daterange{float:left;padding:20px 0 10px 0;}

/* choose question & customer
---------------------------------------------------------------------------------------- */
.question_customer {width:59%;margin:0 1% 0 0;}
.question_customer select.choose_question {float:left;width:50%;}
.question_customer select.choose_customer {float:right;}

/* date range
---------------------------------------------------------------------------------------- */
div.daterange {width:40%;background:url(../img/daterange_bg.png) 0 0 repeat-x;}
div.daterange label {float:left;margin-right:20px;}
div.daterange label:first-child {margin-left:10px;}
div.daterange label span {display:block;font:italic 10px Arial;}
div.daterange label.startDate, div.daterange label.endDate {background:url(../img/option_bg.png) scroll left center no-repeat;float:left;padding:0 0 0 10px;}
div.daterange label.startDate input, div.daterange label.endDate input {border:none;background:url(../img/option_bg.png) scroll right center no-repeat transparent;height:20px;width:67px;margin:0 -8px 0 0;padding:0 8px 0 0;}

/* view
---------------------------------------------------------------------------------------- 
.view {width:10%;float:right;margin:15px 0 0 0;}
.view input[type="submit"] {border:none;background:url(../img/sprite-icon.png) scroll -5px -174px no-repeat transparent;height:31px;padding:0px 38px 2px 16px;cursor:pointer;}
*/

/* Visa */
.visa {float:right;border:none;background:url(../img/sprite-icon.png) scroll -5px -174px no-repeat;height:29px;padding:0px 36px 2px 16px;cursor:pointer;position:relative;top:-8px;}

/* table result
---------------------------------------------------------------------------------------- */
#title-result {background:url(../img/result_bg.png) 0 0 repeat-x;height:40px;border:1px solid #bbb;border-bottom:0;}
#title-result p {font:bold 14px Arial;float:left;padding:10px 0 0 5px;}
#title-result span {font-weight:normal;color:#16a3c4;}
#title-result label {float:right;border:0;background:url(../img/option_bg.png) scroll right center no-repeat transparent;height:20px;margin:10px 20px;}

/* add user, add training quorse
---------------------------------------------------------------------------------------- */
#title-result .add {float:right;}
#title-result .add a {font-size:11px;color:#333;}
#title-result .add input#MainContent_btnExport {background: url("../img/sprite-icon.png") no-repeat scroll 0 -239px transparent;border: 0 none;float: right;font-size: 11px;font-family:Helvetica;height: 27px;margin: -4px 0;padding: 0 10px 3px;cursor:pointer;}
#title-result input#MainContent_btnExport {background: url("../img/sprite-icon.png") no-repeat scroll 0 -239px transparent;border: 0 none;float: right;font-size: 11px;height: 27px;margin: 6px 0;padding: 0 10px 3px;cursor:pointer;}
a.administrator, a.traning-quorse {background:url(../img/sprite-icon.png) no-repeat 0 -237px;float:left;width:107px;margin:4px 0;padding:8px 2px;cursor:pointer;text-align:center;}
a.adduser, a.addtraining {background:url(../img/sprite-icon.png) no-repeat 0 -300px;float:left;width:105px;margin:4px 0;padding:8px 13px;cursor:pointer;text-align:left;}

/* sort table ASP
---------------------------------------------------------------------------------------- */
.sorttable th, .sorttable td {border:1px solid #bbb;}
.sorttable th:first-child, .sorttable td:first-child {text-align:center;padding:0px;background:none;}
.sorttable th {text-align:left;padding-left:5px;background:url("../img/sort.png") no-repeat scroll right center;}
.sorttable th:last-child {background:none;}
.sorttable th a {color:#000;font:bold 12px/14px Arial;}
.sorttable th a:hover {color:#16A3C4;}
.sorttable tr.title {background:url(../img/title_th_bg.png) repeat-x 0 0 transparent;height:43px;}
.sorttable td {padding:7px 5px;}
.sorttable td input {width:100%;}
.sorttable td input[type="image"] {width:auto;}

.nonsortable {background:none !important;text-align:center !important;}

/* pagination
---------------------------------------------------------------------------------------- */
tr.paging td table tr td {background-color:#999 !important;border:1px solid #888;float:left;padding:2px 5px !important;margin:5px;}
tr.paging td table tr td:hover {background-color:#bbb !important;}
tr.paging td table tr td span {color:#fff;}
tr.paging td table tr td a {color:#555;}
tr.paging td table tr td a:hover  {color:#fff;}

/* invoice wrapper
---------------------------------------------------------------------------------------- */
#invoicewrapper {background:url(../img/invoice-bg.png) repeat-x 0 0;overflow:hidden;height:421px;min-width:960px;}
.exportinvoice {float:left;width:53%;padding:27px;border-right:1px solid #fff;height:100%;}
.exportinvoice p {font:bold 14px Arial;padding:9px 0;}
.exportinvoice fieldset {width:100%;}
.exportinvoice label {float:left;clear:left;width:128px;margin:11px 0;}
.exportinvoice select {float:left;margin:10px 0;}
.exportinvoice select.choose_customer {width:55%;}
.exportinvoice select.choose_question {width:67%;}
.exportinvoice div.daterange {background:none;padding:0;width:79%;min-width:500px;float:left;clear:both;overflow:hidden;}
.exportinvoice div.daterange span {float:left;margin:10px 62px 0 0;}
.exportinvoice div.daterange label {width:auto;margin-top:10px;clear:none;}
.exportinvoice div.daterange input {float:left;background:url(../img/sprite-icon.png) no-repeat 0 -268px;border:0;margin:5px 0 0;padding:6px 24px 6px 6px;cursor:pointer;width:110px;height:30px;}

/* search result invoice
---------------------------------------------------------------------------------------- */
.searchresult {float:left;width:35%;padding:27px;border-left:1px solid #dbdbdb;height:100%;}
.searchresult fieldset {width:100%;}
.searchresult p {font:bold 14px Arial;padding:9px 0;}
.searchresult input {float:left;margin:10px 0;}
.searchresult label {float:left;clear:left;margin:11px 20px 11px 0;width:125px;}
.searchresult select {float:left;margin:10px 0;width:185px;}

/*footer
---------------------------------------------------------------------------------------- */
footer {background:#161616;overflow:hidden;height:43px;}
footer ul li {float:left;color:#fff;padding-right:25px;line-height:50px;font-size:11px;}
footer a.logo {display:block;background:url(../img/sprite-icon.png) scroll no-repeat 0 0 transparent;height:28px;width:100px;margin:7px -15px 0 0;}

/* IE 7
---------------------------------------------------------------------------------------- */
.ie7 ul#navigation {float:left;position:absolute;left:50%;}
.ie7 ul#navigation li {float:left;}
.ie7 .daterange {width:48.95%;}
.ie7 .question_customer {width:50%;}
.ie7 .daterange label.startDate input {padding-top:1px;font-size:12px;line-height:20px;}
.ie7 .daterange label.endDate input {padding-top:1px;font-size:12px;line-height:20px;}
.ie7 .exportinvoice div.daterange input#showresult {padding:5px 15px 8px 0px;margin:5px -10px;}
.ie7 .searchresult fieldset {width:60%;min-width:250px;}
.ie7 .sorttable th {background:url(../img/title_th_bg.png) repeat-x 0 0 transparent;height:43px;}
.ie7 .sorttable td {border-right:none;}
.ie7 .loginPage .loginBox span {width:200px;}
.ie7 .loginPage .loginBox span.alert {color:red;}
.ie7 #title-result p {padding:10px 0 0 5px;}
.ie7 #title-result input#MainContent_btnExport {background: url("../img/sprite-icon.png") no-repeat scroll 8px -239px transparent;padding:0;border: 0 none;float: right;font-size: 11px;font-family:Helvetica;height: 27px;margin: 5px 0;}
.ie7 #title-result .add input#MainContent_btnExport {background: url("../img/sprite-icon.png") no-repeat scroll 8px -239px transparent;padding:0;border: 0 none;float: none;font-size: 11px;height: 27px;margin: -4px;}
.ie7 .exportinvoice div.daterange span {float:left;margin:10px 70px 5px 0;}
.ie7 .exportinvoice div.daterange input#MainContent_showresult {background:url(../img/sprite-icon.png) no-repeat 16px -268px}
.ie7 .exportinvoice fieldset {min-width:50%;}
.ie7 ul.profile li .showBox {width:155px;}
.ie7 ul.profile li .showBox input[type="submit"] {padding:4px 1px 6px 3px;}
.ie7 .visa {padding-right:23px;line-height:28px;}

/* IE 8
---------------------------------------------------------------------------------------- */
.ie8 .sortable td#ie-last-child {width:60px;min-width:20px;text-align:center;}
.ie8 .exportinvoice div.daterange input#showresult {padding:7px 28px 10px 10px;}
.ie8 .daterange label.startDate input {padding-top:1px;font-size:12px;line-height:20px;}
.ie8 .daterange label.endDate input {padding-top:1px;font-size:12px;line-height:20px;}
.ie8 #title-result input#MainContent_btnExport {background: url("../img/sprite-icon.png") no-repeat scroll 0 -239px transparent;padding:0 12px 0 10px;border: 0 none;float: right;font-size: 11px;font-family:Helvetica;height: 27px;margin: 6px 0 -4px 0;}
.ie8 .exportinvoice div.daterange input#MainContent_showresult {background:url(../img/sprite-icon.png) no-repeat -3px -268px;padding-bottom:9px;padding-right:32px;}
.ie8 ul.profile li .showBox {width:155px;}
.ie8 ul.profile li .showBox input[type="submit"] {padding:3px 9px 4px 9px;}
.ie8 .visa {padding-right:42px;}

/* IE 9 */
.ie9 .visa {padding-right:42px;}

/* Chorme
---------------------------------------------------------------------------------------- */
.webkit div.view input[type="submit"] {padding:0px 38px 2px 21px;}
.webkit #title-result p {padding:10px 0 0 5px;}
.webkit #title-result .add p input#MainContent_btnExport {margin:-4px 0 0 0;}
.webkit #title-result input#MainContent_btnExport {padding:0 12px 1px;font-family:Helvetica;}
.webkit .exportinvoice div.daterange input#MainContent_showresult {margin:4px 0 0 0;padding:7px 28px 8px 11px;}
.webkit ul.profile li .showBox {width:155px;}
.webkit ul.profile li .showBox input[type="submit"] {padding:3px 9px 4px 9px;}
.webkit .visa {padding-right:43px;}

/* Extra
---------------------------------------------------------------------------------------- */
@media screen and (max-device-width: 480px){
  html {-webkit-text-size-adjust:none;-ms-text-size-adjust:none;}
}

.fancybox-inner {height:100% !important;}