@charset "utf-8";
/* CSS Document */
/*#/top_account{display:none;}*/
.icon_hide{display:none;}
.icon_block{display:block !important; }

.display_none{display:none;}
/*.display_block{display:block !important;}*/

 h2{padding:5px 0 15px 0;}

#logo_group{width:93.8%; padding:10px 3% 10px 3%; border:1px solid #3b5998; background:#eef1fa; border-radius:5px; text-align:center;}
#logo_group a{width:30%; margin-right:21px; padding:10px 0 100px 0; text-align:center; border-radius:10px; display:inline-block; position:relative;}
#logo_group .icon_hide{position:absolute; top:-10px; left:0px; width:97.3% !important; background:#fff; opacity:0.3; height:98%; border-radius:5px; z-index:500;}
#logo_group a#logo_1{background:url(../../img/home_car.png) no-repeat 10px 140px; background-color:#fff; border:2px solid #000; color:#000;}
#logo_group a#logo_2{background:url(../../img/home_pickup.png) no-repeat 10px 140px; background-color:#fff; border:2px solid #24a630; color:#24a630;}
#logo_group a#logo_3{background:url(../../img/home_van.png) no-repeat 10px 145px; background-color:#fff; margin-right:0px; border:2px solid #2f81b1; color:#2f81b1;}
#logo_group a span{font-size:22px; padding:0 0 0px 0;}
#logo_group a#logo_1:hover,#logo_group a#logo_2:hover,#logo_group a#logo_3:hover{background-color:#eee !important;}
#logo_group img{width:95px; background:#fff; padding:3px; margin-top:10px; opacity:0.9;}


.po_icon{width:93.8%; padding:10px 3% 10px 3%; border:1px solid #3b5998; margin-top:25px; background:#eef1fa; border-radius:5px; text-align:center;}
.po_icon a{border:2px solid #3b5998; background:#fff; width:45.0%; margin-top:0; line-height:25px; margin-right:10px; margin-left:10px; padding:30px 0 20px 0; text-align:center; border-radius:20px; display:inline-block; color:#333; font-weight:bold; position:relative;} 
.po_icon a:hover{background:#eee;}
.po_icon .po_price{padding:5px 0 0 0; display:block; clear:both; font-size:13px;}
.po_icon a#po_1{border-color:#000; }
.po_icon a#po_1 .po_price{color:#000;}
.po_icon a#po_2{border-color:#24a630; color:#24a630;}
.po_icon a#po_2 .po_price{color:#24a630;}
.po_icon a#po_3{border-color:#2f81b1; color:#2f81b1; margin-right:0px;}
.po_icon a#po_3 .po_price{color:#2f81b1;}
.po_icon .icon_hide{position:absolute; top:2px; left:3px; width:97.3% !important; background:#fff; opacity:0.3; height:98%; border-radius:5px; z-index:500;}

.img_type{margin-top:10px;}

#po_type{padding:30px 0; width:100%;}
#po_type a{
	display:block; width:99.5%; 
	border:1px solid #adb6c7; padding:12px 0;
	font-size:18px; margin:0 0 5px 0;
	color:#3c5ca5; border-radius:10px; 
	background:#eef1fa;
}
#po_type a:hover{
	background:#7989c4; color:#fff;
}

.tun{background:#558FF5; color:#fff; padding:5px 0; width:100%; text-align:center; font-size:14px; margin:0; border-radius:7px 7px 0 0;}

#po1_box h2{}
/*#poSelect_frm{width:100%;}
#poSelect_frm label{width:45%; background:#65A5FB; clear:both; float:left; color:#fff; padding:5px 5% 5px 0px; text-align:right; border-bottom:1px solid #fff;}
#poSelect_frm p span,#poSelect_frm div span{width:50%; padding:2px 0 0 0; *width:49.9%; float:left; display:block;}
#poSelect_frm div span{color:#fff; font-size:11px; padding-left:0px;}
#poSelect_frm #old_paper label{height:110px;}
#poSelect_frm #driver label{min-height:45px;}
#poSelect_frm #driver label.lb_hide{min-height:370px;}
#poSelect_frm #driver #code{text-align:left; padding:10px 2%; float:left; background:#FBFFE2; width:45%; color:#404040; margin:5px 0 5px 5px; line-height:16px;}
#poSelect_frm div table{margin-left:5px; padding:0 0 5px 0;}
#poSelect_frm div table .select_2{width:80%;}
#poSelect_frm div .select_1{width:20%; float:left; height:20px;}
#poSelect_frm div i{font-size:11px; font-style:normal; color:#fff; clear:both; white-space:nowrap; float:left; line-height:22px; padding:0 3px 0 5px;}
#poSelect_frm p span input[type=radio]{float:left;}
#poSelect_frm p span b{float:left; padding:0 7px 0 3px; color:#fff; font-size:11px; line-height:18px;}
#poSelect_frm p{padding:0px 0; margin:0;}
#poSelect_frm input[type=submit]{margin-top:20px; font-size:18px;}*/

.i-frm{padding:5px 0 0px 0; color:#000; font-size:14px; font-style:italic; text-align:center; width:100%;}
#index-search{width:60%; margin:25px auto 10px auto;}
#index-search .p{text-align:center; position:relative; z-index:1;}
#index-search .select{
	display:block; overflow:hidden;
	width:100%; text-align:center; margin:0px auto 5px auto;
   	height: 34px; border-radius:10px; overflow: hidden;
	border:1px solid #ccc; box-shadow:0px 0px 3px #ccc;
   	background: -webkit-linear-gradient(top,#ffffff, #f1f1f1); 
	background: -o-linear-gradient(top,#ffffff, #f1f1f1); 
	background: -moz-linear-gradient(top,#ffffff, #f1f1f1); 
	background: -ms-linear-gradient(top,#ffffff, #f1f1f1);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f1f1f1',GradientType=0 );!important
	background: linear-gradient(top,#ffffff, #f1f1f1); 
	background-image:url(../img/bg-white.png) -20px 0);
}
#index-search .select{float:none; position:relative; z-index:1;}
#index-search select{width:100%; height:100%; align-items:center; float:left; background:none; font-size:14px; border:none; text-align:center; cursor:pointer; opacity:0; filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; position:absolute; top:0px; left:0px; z-index:10;}
.fake-btn{
	display:none;
	width:100%; text-align:center; margin:0px auto 15px auto;
	border:1px solid #ccc; box-shadow:0px 0px 3px #ccc;
	font-size:13px; padding:7px 0; border-radius:10px;
	cursor:pointer;background-color:#fff;
	background: -webkit-linear-gradient(top,#ffffff, #f1f1f1); 
	background: -o-linear-gradient(top,#ffffff, #f1f1f1); 
	background: -moz-linear-gradient(top,#ffffff, #f1f1f1); 
	background: -ms-linear-gradient(top,#ffffff, #f1f1f1);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f1f1f1',GradientType=0 );!important
	background: linear-gradient(top,#ffffff, #f1f1f1); 
	background-image:url(../img/bg-white.png) -20px 0);
	position:relative;
}
.submit-btn{
	width:100%; text-align:center; margin:0px auto 15px auto;
	border:1px solid #ccc; box-shadow:0px 0px 3px #ccc;
	font-size:13px; padding:9px 0; border-radius:10px;
	cursor:pointer;
	position:relative;
}
.fake-txt{position:absolute; top:8px; left:0; color:#000; z-index:9; width:100%; text-align:center; font-size:13px;}
.i-select{position:absolute; background:url(../img/i-select.jpg) right top no-repeat; top:8px; right:7px; width:19px; height:19px; z-index:6;}





#old_paper,#driver{display:none;}
#howto{width:100%; padding:10px 0; text-align:center; display:none;}
#howto img{background:#fff; border-radius:3px; padding:5px;}



.readmore{color:#000 !important; float:right; white-space:nowrap;  display:block !important; text-decoration:underline; padding:10px 0px 10px 0 !important; width:auto !important; margin:0 !important; font-weight:normal !important; border:none !important; border:none !important; background:none !important;}

.garage{color:#000 !important; float:left; white-space:nowrap;  display:block !important; text-decoration:underline; padding:10px 0px 10px 0 !important; width:auto !important; margin:0 !important; font-weight:normal !important; border:none !important; border:none !important; background:none !important;}
#po1_box .readmore{color:#fff !important; clear:both;}

.box_type{position:relative; clear:both; float:left; }
.po_h{font-size:18px;}
.po_price{font-size:16px;}

.table_detail{clear:both; float:left; width:100%; padding:15px 0 0 0;}
.table_detail table{border-collapse:collapse; width:100%; clear:both; float:left;}
.table_detail td{border:1px solid #ccc; font-size:12px;}
.table_detail thead td{background:#baf0ff; color:#000; padding:7px 0;}
.table_detail tbody td{background:#fff; color:#404040; padding:5px 0;}
.table_detail thead td.gold_col{background:#e4d158;} 
.table_detail thead td.silver_col{background:#CBCBCB;} 
.table_detail tbody td.first_col{text-align:left; padding-left:10px;}
.table_detail tbody tr:nth-child(even) td{background:#f0fdfe;}
.table_detail thead td.not_show{background:none; border-top:none; border-left:none;}

.po_note{text-align:left; font-size:12px; padding:10px 0 0 0;}
.po_note p{}
.po_note h3{font-weight:bold; font-size:12px;}
.po_note .warning{color:#f00;}


.tbl-market-plan{border-collapse:collapse; margin:10px 0 20px 0; display:none; font-size:13px;}
.tbl-market-plan td{border:1px solid #444; background:#fff;} 
.tbl-market-plan thead td{background:#ddd; padding:10px 0;}
.tbl-market-plan tbody td{padding:5px 5px; text-align:right;}
.col-3-lass{color:#f00;}
#tbl-act-10 tbody td.col-3{background:#ffc100;}
#tbl-act-16 tbody td.col-3{background:#94ce45;}
#tbl-po3-37 tbody td.col-3{background:#e7bab8;}
#tbl-po3-47 tbody td.col-3{background:#fffe00;}
#tbl-po3plus-119 tbody td.col-3{background:#00b0f2;}
#tbl-po2plus-131 tbody td.col-3{background:#9b3600;}



.eng{cursor:pointer; text-decoration:underline; margin:0;  padding:10px 0 15px 0 !important; color:#000;}
.eng:hover{}

.mini{margin-left:5px;}

#btn_tax{padding:10px 0; color:#fff; width:60%; font-size:15px; margin:20px auto 20px auto; clear:both; float:none;}
/*#btn_tax{background:none; color:#3829F9; text-decoration:underline; border:none; padding:0px; padding-left:3px;}*/

.tax_link{width:75%; padding:30px 0 20px 20%;}
#tax_show{padding:10px 0; clear:both; float:left; width:100%;}
#tax_show span{display:block; float:left;}
#tax_show form{width:100%;}
#tax_show p{padding:5px 0; margin:0; clear:both; float:left; width:100%;}
#tax_show .input_number{border:1px solid #ddd; line-height:22px; height:20px; width:120px; padding:0 5px; text-align:right !important;  clear:both; float:left;}
.tax_label,.tax_value,.tax_baht{display:block;}
.tax_label{width:35%; clear:both; float:left; text-align:left; padding-left:10%;}
.tax_value{width:19%; padding-right:1%; text-align:right !important; float:left;}
.tax_baht{width:25%; text-align:left; float:left; *width:24%;}
#tax_show p.tax_total{border-top:1px solid #ccc; border-bottom:1px solid #ccc; padding:20px 0; margin:10px 0; clear:both; float:left; width:100%;}
.tax_total .tax_value{ color:#DB0003;}
#tax_btn{clear:both; margin:15px 0 0 0; width:60%; font-size:16px;}
.howto{font-size:14px; float:right; clear:both; display:block; padding:0px 0 0 0 !important; text-decoration:underline; white-space:nowrap;}
#tax_total{font-size:14px; color:#D30205;}
#btn_tax2{width:200px; float:left; margin:10px 0 0 0;}
#car_sl{width:337px;}

/* CMIDVS */
#tbl-type{width:100%; clear:both; float:left; margin:30px 0 0px 0;}
#tbl-type table{width:100%; border-collapse:collapse; cursor:pointer; text-align:center;}
#tbl-type table td{border:1px solid #fff; background:#e7faff; padding:12px 2%;}
#tbl-type table thead td{background:#718cc0; color:#fff;}
#tbl-type table td.col-1{width:20%;}
#tbl-type table td.col-2{width:55%; text-align:left;}
#tbl-type table td.col-3{width:35%;}
#tbl-type table tbody tr:nth-child(even) td{background:#d8effd;}
#tbl-type .btn_1{width:90px; padding:5px 0px; display:inline-block;}
#cmidvs #logo_group a{width:45%;}
#cmidvs #logo_group a#logo_1,#cmidvs #logo_group a#logo_2{background-position:center bottom;}


.age_lb{width:73px; text-align:right;}
#drvAge1,#drvAge2{margin-top:3px; width:61px; height:17px;}

#tblTaxCal{background:#fff; border-collapse:collapse; clear:both; margin:15px 0 0 0; width:100%;}
#tblTaxCal td{border:1px solid #999; padding:5px 5px; font-size:14px; color:#444;}
#tax_alert{color:#C02427; font-size:15px;}

@media only screen and (max-width:979px){
	.br{clear:both; float:left;}
	#poSelect_frm label.sort_label{padding:20px 5% 20px 0;}
	.box{margin-right:5px;}
	.silver, .gold{background-size:auto 45px; background-position:bottom right; text-align:left !important; padding:10px 0 30px 5px !important; font-size:11px !important; margin-bottom:10px;}
	.readmore{}
	
	#poSelect_frm div i{width:100%; text-align:left;}
	#poSelect_frm div .select_1{width:30%;}
	#poSelect_frm div .first_sl{padding-left:5px;}
	#poSelect_frm #driver label{min-height:95px;}
	.lb_hide{display:none;}	
	#poSelect_frm #driver #code{margin-left:0px; width:96%;}
	
	#howto img{width:95%;}
	
	#btn_tax{float:left; width:100%;}
	.tax_link{padding-left:0;}
	.tax_label,.tax_value,.tax_baht{padding:0; width:30%;}
	#tax_show .input_number{width:90%;}
	#tax_btn{float:left; width:100%;}
	#car_sl{width:204px;}
	.card_id_lb{width:100%;}
	#card_id{margin:3px 0 0 30%; width:187px;}
	#tax_province{clear:both; float:left; margin-left:30%; margin-top:5px;}
	#drvAge1,#drvAge2{margin-top:0px; margin-left:5px;}
	
	#index-search{width:80%; margin:10px auto 5px auto;}
	
	/* CMIDVS */
	#cmidvs #logo_group a{width:40%;}
	#cmidvs #logo_group img{width:95px;}
	#logo_group a#logo_1{background-position:center bottom !important;}
	#logo_group a#logo_2{background-position:center bottom !important;}
}


@media only screen and (max-width:479px){
	#logo_group a{margin-right:3px; padding:10px 0 45px 0; background-size:100% auto !important; background-position:0px 115px !important; font-size:11px; letter-spacing:-1px;}
	#logo_group a#logo_1{background-position:0px 115px !important;}
	#logo_group a#logo_2{background-position:0px 115px !important;}
	#logo_group img{width:80%;}
	#logo_group a span{font-size:9px; letter-spacing:-1px;}
	
	
	.po_icon a{margin-right:5px; padding:15px 0; border-radius:20px; width:40%; font-size:11px; letter-spacing:-1px;}
	.po_icon img{width:70%;}
	.po_icon img.caltex_logo{width:75px;}
	
	#index-search{width:88%;}
	
	/* CMIDVS */
	#tbl-type table td{font-size:10px; padding:20px 2%;}
	#tbl-type .btn_1{width:65px; }
	#cmidvs #logo_group a{width:45%;}
	#cmidvs #logo_group a{background-size:130px auto !important; background-position:center bottom !important; padding-bottom:70px;}
}



@media only screen and (min-width:480px) and (max-width:767px){
	#logo_group a{margin-right:0px; padding:10px 0 60px 0; background-size:100% auto !important; background-position:0px 125px !important;}
	#logo_group a#logo_1{background-position:0px 125px !important;}
	#logo_group a#logo_2{background-position:0px 125px !important;}
	#logo_group img{width:60%;}
	#cmidvs #logo_group img{width:40%;}
	#logo_group a span{font-size:20px;}
	
	.po_icon a{margin-right:10px; padding:15px 0; border-radius:20px; width:40%;}
	.po_icon img{width:70%;}
	.po_icon img.caltex_logo{width:75px;}
	
	#cmidvs #logo_group a{background-size:160px auto !important; background-position:center bottom !important;}
	
}







