/* Grobal*/
* {margin: 0; padding: 0;}
body {font-family: Arial,Thonburi,Tahoma; font-size: 13px; color: #666; margin: 0 0 20px;background: url(../../img/bg-header.jpg) no-repeat center top;}
a {color: #666; outline: none;text-decoration: underline;}
a:hover {color: #666;text-decoration: none;}
#content .space {padding: 70px 0 0;}
#content .nospace {margin-top: -20px;}
#content .nospace2 {margin-top: -25px;}
#content .success {font-size: 18px; font-weight: bold; color:#333; padding: 0 0 10px;}

#content a.btn,
.lightbox-content a.btn {background: url(../../img/btn-left.png) no-repeat 0 0; display: block; margin: 13px auto;padding: 0 0 0 7px; text-decoration: none; line-height: 23px;}
#content a.btn span,
.lightbox-content a.btn span {display: block;background: url(../../img/btn-right.png) no-repeat right top;  height: 29px; font-size: 14px;  padding: 3px 7px 0 0;color:#fff; text-align: center;}
#content a.btnl {background: url(../../img/btn-left-l.png) no-repeat 0 0; display: block; margin: 13px auto;padding: 0 0 0 7px; text-decoration: none; line-height: 23px;}
#content a.btnl span {display: block;background: url(../../img/btn-right-l.png) no-repeat right top;  height: 41px; font-size: 24px;  padding: 9px 7px 0 0;color:#fff; text-align: center;}
img, fieldset {border: none;}
ul, ol {list-style: none;}
#content .note {font-size: 14px; line-height: 28px;}
#content .note a {color:#339900;}
#content .note2 {font-size: 14px; line-height: 22px;}
.form-msg {clear: both;display: block;}
input{padding: 2px 5px; color:#666; font-size: 13px; margin-right: 5px;}
select { color:#666; font-size: 13px;margin-right: 10px; padding: 2px 0;}
textarea {font-size: 13px; color:#666; width: 300px; height: 105px;}
#content form fieldset {padding-top: 20px;}
#content .form-msg {padding: 5px 0 3px 170px;}
#content form .require,
#content .form-msg .error,
.upload-photo .error {color:#CC0000; font-weight: normal;font-family: Thonburi,Tahoma;}
#content form .require {padding-left: 3px;}
#content form label.header {width: 168px; float: left;color:#333; font-weight: bold; padding-left: 2px;_display: inline;}
#content form .rightgroup{width: 790px;float:left;}
#content form .rightgroup .form-msg,
#content form .rightgroup .input-slidedown,
#content form .rightgroup .list{padding-left: 0;margin-left: 0;}
#content form label.header .newline {clear: both; float: left; color:#666; font-weight:normal;}
input.text,select,textarea {border: 1px solid #d5d5d5;}
.radio {margin-right: 5px;}
body #wrapper .width290 {width:290px;}
body #wrapper .width300 {width: 300px;}
body #wrapper .width130{width: 130px;}
h1 {font-size: 16px; color:#333; background: url(../../img/bg-topic.gif) repeat-x left bottom; width: 100%; line-height: 30px; margin-bottom: 20px;}
#wrapper {width: 960px; margin: 0 auto; overflow: hidden;}
#header {width: 960px; height: 156px;position: relative;}
#content {width: 920px; margin: 0 auto;}
.center {text-align: center!important;}
h1.topic {border:none; background: none; margin: 0 0 0 -20px;}
.decore {width: 363px; height: 218px; position: absolute;right:0; top: 0;}
.instruction {color:#333; font-size: 18px; padding: 40px 0 0;}
/*button*/
#content .landingpage a.regis {width: 150px;}
#content .mobilebtn {width: 120px;}
#content a.regis { width: 150px; }
#content a.regis span {width: 140px; }
#content a.close-th,#content a.resume-th {width:120px;}

/*mobile-register*/
.mobile-regis {width: 934px; height: 269px; background: url(../../img/bg-mobile-regis.gif) no-repeat; margin:30px 0 0 -20px; text-align: center; padding: 50px 0 0; float: left;}
.mobile-regis h2 {color:#333; font-size: 20px; padding: 0 0 20px;}
.mobile-regis p {font-size: 15px;}
.mobile-regis p span {display: block;}
.mobile-regis p span.username {color:#339900; text-decoration: none; display: inline;}
.mobile-regis p span.username-en {color:#1e79bc;text-decoration: none; display: inline;}
.mobile-regis p .mobile {width: 305px; font-size: 15px; text-align: center; margin: 10px 0; border: 1px solid #ccc; padding: 3px 0; color:#666;}
#content .mobile-regis p input.login {position: static; margin: 10px 0 0;}
#content .mobile-regis .form-msg {padding: 0; font-size: 14px;}
#content .mobile-regis .btn-group {width: 275px;margin: 0 auto;}
#content .mobile-regis .btn-group a {float: left; margin-right: 10px;}
#content .mobile-regis p.highlight {font-size: 18px; color:#666; padding: 20px 0; font-size: 14px;}
.mobile-regis .code {width: 180px; margin: 15px auto 10px auto; padding: 5px 0; text-align: center; background: #fff; border: 1px solid #ccc; font-size: 18px; font-weight: bold; color:#CC0000}
/*landingpage*/
.landingpage p img{width: 553px; margin: 50px auto 20px auto; display: block;}
/*login*/
.login-divide {width: 459px; height: 309px; background: url(../../img/login-form.gif) no-repeat; float: left; margin: 30px 17px 0 -20px;position: relative; overflow: hidden;}
#content .regis {margin:30px 0 0;}
#content .regis p {padding-top: 30px;text-align: center; line-height: 30px; font-size: 14px;}
#content .regis p span {display: block;}
.login-divide h2 {font-size: 16px; font-weight: bold; color:#333; height: 50px; padding: 30px 0 0 0;width: 385px; margin-left: 33px;}
.login-divide form {width: 385px; margin-left: 33px; position: static;}
.login-divide form input {font-size: 12px; color:#999; margin: 0 5px 0 0;}
.login-divide form .text {width: 295px; padding: 2px 5px;}
#content .login-divide .form-msg {padding: 0; line-height: 14px;}
#content .login-divide .form-msg label {font-size: 12px; line-height: 14px;}
#content .login-divide form li {padding: 0 0 5px; line-height: 33px; width: 385px;}
#content .login-divide form .intro {padding: 0 0 10px;}
#content form input.login { background: url(../../img/login-submit.gif) no-repeat; width: 112px; height: 28px; border: none; color:#fff; font-size: 14px; position: absolute; bottom: 60px;padding: 0; cursor: pointer; }
#content .login-divide ul li a {font-size: 12px; }
#content .login-divide a.regis {position: absolute; bottom: 42px; left: 50%; margin-left: -75px;}



/*register form*/
form {width: 920px; position: relative; overflow: hidden;}
.job-interest input.text,.work-exp input.text {width: 300px;}
fieldset.upload {width: 310px; position: absolute; top: 50px; right: 20px;}
fieldset.job-interest{clear: both; width: 960px;overflow: hidden;}
fieldset.job-interest ul li {display:table;}
#content form fieldset.job-interest .suggest {position: relative; overflow: visible!important; width: 960px;display:table;z-index:0; height: auto;padding-bottom: 10px;}
fieldset.job-interest .suggest ul {width: 310px; position: absolute; top: 21px; left: 170px; background: #fff; overflow: hidden;z-index:2; height: auto;}
fieldset.job-interest .suggest ul li a {display: block; width: 300px; padding: 2px 5px; color:#666;}
fieldset.job-interest .suggest ul li a:hover {background:#e8e8e8;color:#666;text-decoration: none;}
#content form li {overflow: hidden; clear: both;width: 960px; line-height: 20px;padding-bottom: 10px;}
form .note {font-size: 12px; color:#666; clear: both; display: block; padding:5px 0 0 170px;}
.sex label {margin-right: 5px;}
form .list {padding:0 0 10px 170px;}
#content form .list li,#content form .list p {width: 790px;}
form .input-slidedown {background: url(../../img/arrow.gif) no-repeat left top; overflow: hidden; width: 300px; margin-left: 170px;}
form .slide-detail {width: 280px; background: #E8E8E8; padding: 10px; margin: 7px 0 10px 0;}
form .slide-detail span {font-size: 15px; }
form .slide-detail a {padding-left: 5px;}
form .slide-detail ul li {width: auto!important;}
.btm li{ padding-bottom: 5px;}
.btm li li {padding-bottom: 0;}
.upload-photo .thumbnail {padding: 0;}
.upload-photo p{float:left; margin-right: 10px; padding-top: 20px; }
.upload-photo p span {display: block; }
.upload-photo .newline {clear: both; float: left;}
/*edu*/
.edu .slide-detail ul {float: left; width: 310px; }
.edu .slide-detail ul li {padding-top: 5px;}
.edu .slide-detail ul input {width: 80px;border: 1px solid #B0DE94;}
.edu .slide-detail ul input.long {width:210px;}
.edu .slide-detail label {float: left; width: 65px;}
.edu .slide-detail label.l-text {width: 150px;}
.edu .slide-detail {overflow: hidden; width: 350px;}
/*suggest box*/
.suggest ul {width: 298px; border: 1px solid #B0DE94;}
/*search*/
body #content form.search {margin: 25px 0; overflow: hidden; width: 960px;}
body #content form .searchform {width: 910px; background: #dcefd1; overflow: hidden; padding: 25px; margin: 0;}
form .searchform label {width: 165px; float: left; color:#333; font-weight: bold;}
.searchform .type {display: block; padding: 10px 0 0 165px; clear: both;}
.searchform li {padding:0 0 15px;}
.searchform .type label {float: none; font-weight: normal; color:#666; margin: 0 5px; font-size: 12px;}
#content .searchform .form-msg {display: inline; clear: none; padding: 0;}
#content .searchform .form-msg label {float: none; padding: 0;}
body #wrapper #content .searchform .button {padding:0 0 0 165px; margin: 0;}

/*searchresult*/
.searchresult th {background:#dedede; padding:15px; color:#333; font-weight: bold; border-left: 1px solid #cccccc;}
#content .searchresult h2 {margin-bottom: 20px;}
#content .searchresult table {border: 1px solid #eee; border-top: none; border-bottom: none;}
#content .searchresult tr th {text-align: left;}
#content .searchresult tr td {border-bottom: 1px solid #eee; padding: 15px;}
#content .searchresult .first {border: none;}

/*pagination*/
.pagination {font-size: 13px; font-weight: bold; padding-top: 10px;}
.pagination a {font-weight: normal;}
.pagination {text-align: right; margin: 0 0 20px 0; clear:both; overflow: hidden;}
.pagination a {
	background: #ececec; 
	padding: 1px 4px; 
	font-weight: normal; 
	color: #333; 
	text-decoration: none;
}
.pagination a:hover {background: #4caf13;}
.pagination a.active {background: #4caf13;}
.pagination span a {background: #fff;}
.pagination span a:hover {background: none;}

/*view-detail*/
#detail {padding-top: 30px; width: 960px; position: relative;}
#detail .thumbnail {position: absolute; top: 100px;; right: 350px; width: 90px; height: 93px;}
#detail .header {width: 168px; padding-left: 2px; _display: inline;float: left; color:#333; font-weight: bold;}
#detail .detail {float: right; width: 790px; }
#detail li {width: 960px; overflow: hidden; clear: both; line-height: 40px;}
#detail ul {padding-bottom: 25px; width: 960px; overflow: hidden;}
#detail ul .list {padding: 5px 0 0; float: right; width: 790px;}
#detail ul .list li {line-height: 30px;}
.edu-detail {width: 790px; float: left; overflow :hidden;}
/*static-thankyou*/
.static {text-align: center; padding: 90px 0 115px;}
.static h1 {background: none; font-size: 20px; font-weight: bold; color:#339900;}
.static h1 span {display: block;}
.static p {color:#333;font-size: 13px;}
.static .note {padding-top: 50px;}
.static .highlight {font-size: 20px;}
/*emaillist*/
.emaillist {padding-top: 20px;}
.emaillist li {display: inline;}
/*button*/
.button {width: 183px; margin: 50px auto; overflow: hidden;}
.button input {cursor: pointer;}
input.save {width: 85px!important; height: 26px; border: none; background: url(../../img/save-th.png) no-repeat!important;}
input.save-hover {
	width: 85px!important; 
	height: 26px;  
	border:none; 
	background: url(../../img/save-th.png) no-repeat 0 -26px!important;
	cursor: pointer;
}
input.cancel {width: 78px!important; border:none; height: 26px; background: url(../../img/cancel-th.png) no-repeat!important;cursor: pointer;}
input.cancel-hover {width: 78px!important; border:none; height: 26px;  background: url(../../img/cancel-th.png) no-repeat 0 -26px!important;cursor: pointer;}
input.button-search {width: 72px; height: 26px; cursor: pointer; border: none; background: url(../../img/button-search-th.png) no-repeat;cursor: pointer;}
input.button-search-hover {width: 72px; height: 26px; cursor: pointer;border: none; background: url(../../img/button-search-th.png) no-repeat 0 -26px;}
input.view-detail {width: 78px; height: 26px;  border:none; background: url(../../img/detail-th.png) no-repeat!important; cursor: pointer;}
input.view-detail-hover {
	width: 78px; 
	height: 26px;  
	border:none; 
	background: url(../../img/detail-th.png) no-repeat 0 -26px!important;
	cursor: pointer;
}
input.close{
	background: url(../../img/close-th.png) no-repeat!important; 
	width: 54px!important; 
	height: 26px;
	cursor: pointer;
	border: none!important;
}
input.close-hover{
	background: url(../../img/close-th.png) no-repeat 0 -26px!important; 
	width: 54px!important; 
	height: 26px;
	cursor: pointer;
	border: none!important;
}


/*lightbox*/
.lightbox-template .lightbox-content{width:100%;background:#fff;margin:0 auto;padding:0}
.lightbox-template h1{height:35px;color:#fff;margin-bottom:20px;background:#005aab url(../../img/login-head.gif) no-repeat;font-size:16px;padding:10px 0 0 50px; width: auto;}
.lightbox-template .close-btn{position:absolute;top:-18px;right:-18px}
.lightbox-template form{width:400px;margin:0 auto}
.lightbox-template form ul li{width:400px;font-size:15px;color:#006600;font-weight:bold;margin-bottom:10px;float:left}
.lightbox-template form ul li label{width:80px;display:block;float:left}
.lightbox-template form ul li input{width:200px;border:1px solid #99bfce;float:left;padding:3px}
.lightbox-template form ul li ul{padding-left:80px}
.lightbox-template form ul li ul li{width:320px;color:#666;font-weight:normal;font-size:13px}
.lightbox-template form ul li ul li input{width:auto;border:none;margin-right:5px}
.lightbox-template .apply-resume-confirm{width:400px;background:#fff;position:relative;margin:0 auto;padding:10px 10px 50px}
	
/*choose-type-package*/
.choose-type-package li .form-message label {padding-left: 0;}
.choose-type-package li input,.choose-type-package li label {float: none; font-weight: normal; color:#666;}
.button-set {width: 760px; background:#fff; overflow: hidden; padding:30px 0 10px 350px;}
.button-set input {margin-right: 5px;}

/*Choose career page- light box content*/
.choose-career h2 {color: #333; font-size: 15px; font-weight: bold;}
#select_item { overflow: auto; border: 1px solid #ccc; margin: 0 auto; padding: 10px; height: 180px;}
#select_item li ul {padding-left: 20px;}

/*checkbox icon*/
.tree-node{cursor:default!important;}
.tree-title{
	font-size: 13px;
	font-weight: bold;
	color: #666;
	padding-left: 5px;
	cursor: pointer;
}
#select_item ul .tree-node {font-weight: normal;}
.tree-title:hover {text-decoration: underline;}
#tt2 li{overflow: hidden;clear: both;}
#tt2 li ul li span {font-size: 13px;color:#666;font-weight: normal;	}
#tt2 li ul li  {overflow: hidden; float: left; width: 325px; padding-left: 20px; clear: none;}
.tree-indent{display: none;}
.tree-expanded{
	display:inline-block;
	width:16px;
	height:16px;
	background:url(../../img/tree_arrows.gif) no-repeat 0 1px;
	cursor: pointer!important;
}
.tree-collapsed{
	display:inline-block;
	width:16px;
	height:16px;
	background:url(../../img/tree_arrows.gif) no-repeat -18px 1px;
	cursor: pointer!important;
}
.tree-checkbox{display:inline-block;width:16px;height:16px;cursor: pointer!important;}
.tree-checkbox0{background:url(../../img/tree_checkbox_0.gif) no-repeat 0 2px;}
.tree-checkbox1{background:url(../../img/tree_checkbox_1.gif) no-repeat 0 2px;}
.choose-career .apply-resume-navigation {margin: 10px auto 0 auto;}
.apply-resume-navigation {width: 176px; margin: 10px auto 0; overflow: hidden;}
.apply-resume-navigation li {width: 78px; float: left; margin-right: 10px;}

/*work-exp*/
.work-exp {background: url(../../img/bg-topic.gif) left bottom repeat-x; overflow: hidden; padding-bottom: 50px;}
.work-exp .header span {float: left;}
.work-exp .notice {padding-top: 20px;color:#333; overflow: hidden;}
.work-exp textarea {width: 310px;}

#wrapper #content .expand,#wrapper #content .slide-detail {width: 790px;}

#content form .drive label.header { width: 220px;}
#content form .drive .car-Motorcycles { width: 500px; float: left;}
#content form .drive .car-Motorcycles li { width: 500px; overflow: hidden;}
#content form .drive .car-Motorcycles li label { margin-right: 5px;}
#content form .drive .car-Motorcycles li .header { width: 100px; float: left;}
.work-exp .notice .require { float: left; padding-right: 3px;}
.work-exp .notice p { float: left;}
.work-exp .notice p span { display: block;}

#content .language { overflow: hidden; position: absolute; right: 0; top: 10px; width: 102px;}
#content .language li { float: left; width: 46px; clear: none; padding-right: 5px;}
#content .language .thai { background: url("../../img/btn-language_th.gif") 0 0 no-repeat; border: medium none; cursor: pointer; float: left; height: 20px; overflow: hidden; width: 46px;}
#content .language .thai.active { background: url("../../img/btn-language_th-active.gif") 0 0 no-repeat;}
#content .language li span { display: none;}
#content .language .english { background: url("../../img/btn-language_en.gif") 0 0 no-repeat; border: medium none; cursor: pointer; float: left; height: 20px; overflow: hidden; width: 46px;}
#content .language .english span { display: none;}
#content .language .english.active { background: url("../../img/btn-language_en-active.gif") 0 0 no-repeat;}

.upload-photo { overflow: hidden; width: 320px;}
.upload-photo .upload-photo-detail { width: 230px; float: left;}
.upload-photo .upload-photo-detail p { padding: 10px 0 5px;}

#content input.save-en { background: url("../../img/save-en.png") no-repeat scroll 0 0 transparent !important; border: none; height: 26px; width: 60px !important;}
#content input.cancel-en { background: url("../../img/cancel-en.png") no-repeat scroll 0 0 transparent !important; border: none; height: 26px; width: 60px !important;}