@charset "utf-8";
* { margin:0; padding:0;}
@font-face {
    font-family: 'muli';
	src: url('../font/CaviarDreams-webfont.eot');
    src: url('../font/CaviarDreams-webfontd41d.eot?#iefix') format('embedded-opentype'),
         url('../font/CaviarDreams-webfont.woff') format('woff'),
         url('../font/CaviarDreams-webfont.ttf') format('truetype'),
         url('../font/CaviarDreams-webfont.svg#caviar_dreamsregular') format('svg');
}
@font-face {
    font-family: 'quarklight';
    src: url('../font/quark-light-webfont.eot');
    src: url('../font/quark-light-webfontd41d.eot?#iefix') format('embedded-opentype'),
         url('../font/quark-light-webfont.woff') format('woff'),
         url('../font/quark-light-webfont.ttf') format('truetype'),
         url('../font/quark-light-webfont.svg#quarklight') format('svg');
    font-weight: normal;
    font-style: normal;
}
html, body {
	margin:0 auto;
	font-family: Arial, Tahoma;
	font-weight: normal;
	font-size: 14px;
	color:#666;
	text-decoration: none;
	width: 1000px;
	height: 100%;
	background-image: url(../images/bg.jpg);
	background-repeat: repeat-x;
	background-position: top;
}
a { outline: 0;}
a:link, a:visited{ text-decoration: none; color: #333;}
a:hover { text-decoration: none; color: #666;}
img { border: 0;}
.flLeft { float: left; }
.flRight { float: right; }
.clear { clear: both;}
.center { text-align: center;}
.mgt { margin-top: 15px;}
.colWhite { color: #FFF;}
.hidden { display: none;}
#top {
	display: block;
	height: 97px;
}
#middle {
	background: url(../images/bg_middle.jpg) 0 0 repeat-y;
	padding: 0 9px;
	display: block;
}
#bottom {
	background: url(../images/bg_bottom.jpg) 0 0 no-repeat;
	display: block;
	height: 21px;
}
#copyright {
	background-color: #eee;
	text-align: center;
	padding: 0px 3px 5px 3px;
}
.logo {
	padding-top: 20px;
}
.lang a { 
	display: inline-block;
	width: 24px;
	height: 19px;
	margin-top: 35px;
	margin-right: 3px;
}
.en { background: url(../images/lang.jpg)  0 0 no-repeat;}
.en:hover, .en.curlang { background: url(../images/lang.jpg)  0 -24px no-repeat;}
.th { background: url(../images/lang.jpg)  -32px 0 no-repeat;}
.th:hover, .th.curlang { background: url(../images/lang.jpg)  -32px -24px no-repeat;}
.cn { background: url(../images/lang.jpg)  -62px 0 no-repeat;}
.cn:hover, .cn.curlang { background: url(../images/lang.jpg)  -62px -24px no-repeat;}
.motto {
	color: #71ab0b;
	text-transform: uppercase;
	margin-right: 5px;
	margin: 2px 5px 5px 0;
}
.mottobt {
	border-bottom: 1px solid #eee;
}
.pBanner { text-align: center;}
.pBanner a {
	display: inline-block;
	width: 223px;
	height: 189px;
	margin: 19px 8px;
	position: relative;
}
.pBanner a div {
	display: inline-block;
	line-height: 32px;
	color: #FFF;
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0 10px;
	text-transform: uppercase;
}
.pBanner a:hover div { color: #FFF; background-color: #a8e53c;}
.pBannerAgri { background: url(../images/product.jpg)  0 0 no-repeat;}
.pBannerAgri:hover { background: url(../images/product.jpg)  0 -189px no-repeat;}
.pBannerAbout { background: url(../images/product.jpg)  -669px 0 no-repeat;}
/*.pBannerAbout:hover { background: url(../images/product.jpg)  -669px -180px no-repeat;}*/
.pBannerMetal { background: url(../images/product.jpg)  -223px 0 no-repeat;}
.pBannerMetal:hover { background: url(../images/product.jpg)  -223px -189px no-repeat;}
.pBannerMineral { background: url(../images/product.jpg)  -446px 0 no-repeat;}
.pBannerMineral:hover { background: url(../images/product.jpg)  -446px -189px no-repeat;}
.hmContent {
	line-height: 24px;
	letter-spacing: 25;
	margin: 15px 50px 0px 50px;
	text-align: justify;
}
.mot {
	text-align: center;
	color: #71ab0b;
	padding: 29px;
	font-size: 24px;
}
.head {
	font-family: 'muli', Arial, 'quarklight', Tahoma;
	font-size: 28px;
	text-transform: uppercase;
	color: #4e7607;
	border: 1px solid #71ab0b;
	padding: 12px 10px;
	display: inline-block;
	margin: 3px 8px 0 0;
	font-weight: bold;
}
.inContent {
	margin: 15px 0 0 0;
}
.crContent {
	line-height: 24px;
	letter-spacing: 25;
	margin: 15px 30px 0px 30px;
	text-align: justify;
}
.arrow {background: url(../images/arrow.jpg)  0 0 no-repeat; width: 43px; height: 48px; display: inline-block; vertical-align: top; margin-top: 5px;}
.arrowb {background: url(../images/arrowb.jpg)  0 0 no-repeat; width: 43px; height: 48px; display: inline-block; vertical-align: top; margin-top: 5px; margin-right: 8px;}
.barloxx {background: url(../images/barloxx.jpg)  0 0 no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.agri {background: url(../images/barloxx.jpg)  0 -48px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.gi {background: url(../images/barloxx.jpg)  0 -96px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.heavy {background: url(../images/barloxx.jpg)  0 -144px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.light {background: url(../images/barloxx.jpg)  0 -192px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.tincan {background: url(../images/barloxx.jpg)  0 -240px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.bushling {background: url(../images/barloxx.jpg)  0 -288px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.anti {background: url(../images/barloxx.jpg)  0 -336px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.lime {background: url(../images/barloxx.jpg)  0 -384px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.dolo {background: url(../images/barloxx.jpg)  0 -432px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.qz {background: url(../images/barloxx.jpg)  0 -480px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.vermi {background: url(../images/barloxx.jpg)  0 -528px no-repeat; width: 502px; height: 48px; display: inline-block; vertical-align: top; margin: 5px 0 0 10px;}
.about { margin-top: -10px;}
.qcIndent { margin-left: 35px;}
.netBox span {
	display: inline-block;
	width: 279px;
	height: 172px;
	margin: 5px;
	position: relative;
	border: 1px solid #71ab0b;
	font-size: 12px;
	text-align: left;
	vertical-align: top;
	line-height: normal;
}
.netBox span:hover, .netThai.active { color: #FFF;}
.netThai { background: url(../images/map1.jpg)  0 0 no-repeat;}
.netThai:hover, .netThai.active { background: url(../images/map1.jpg)  0 -172px no-repeat;}
.netMy { background: url(../images/map1.jpg)  -279px 0 no-repeat;}
.netMy:hover { background: url(../images/map1.jpg)  -279px -172px no-repeat;}
.netJp { background: url(../images/map1.jpg)  -558px 0 no-repeat;}
.netJp:hover { background: url(../images/map1.jpg)  -558px -172px no-repeat;}
.netIn { background: url(../images/map2.jpg)  0 0 no-repeat;}
.netIn:hover { background: url(../images/map2.jpg)  0 -172px no-repeat;}
.netKr { background: url(../images/map2.jpg)  -279px 0 no-repeat;}
.netKr:hover { background: url(../images/map2.jpg)  -279px -172px no-repeat;}
.netId { background: url(../images/map2.jpg)  -558px 0 no-repeat;}
.netId:hover { background: url(../images/map2.jpg)  -558px -172px no-repeat;}
.netBd { background: url(../images/map3.jpg)  0 0 no-repeat;}
.netBd:hover { background: url(../images/map3.jpg)  0 -172px no-repeat;}
.netUs { background: url(../images/map3.jpg)  -279px 0 no-repeat;}
.netUs:hover { background: url(../images/map3.jpg)  -279px -172px no-repeat;}
.netAu { background: url(../images/map3.jpg)  -558px 0 no-repeat;}
.netAu:hover { background: url(../images/map3.jpg)  -558px -172px no-repeat;}
.netThai div, .netMy div, .netKr div, .netId div, .netBd div, .netUs div { margin: 10px 20px 10px 15px;}
.netJp div, .netIn div { margin: 50px 15px;}
.netAu div { margin: 5px 15px}
.bdCenter { border-left: 1px solid #a8e53c; padding-left: 10px; width: 52%}
.csrBox {
	display: inline-block;
	margin: 5px 30px 10px 3px;
	width: 166px;
	text-align: center;
	vertical-align: top;
}
.csrImg {
	background-color: #71ab0b;
	height: 111px;
}
.csrImg img {
	margin: -4px -3px;
}
.contLeft {
	margin-top: 10px;
	width: 40%;
	display: inline-block;
	vertical-align: top;
}
.contBox {
	width: 52%;
	/*width: auto;*/
	min-height: 200px;
	vertical-align: top;
	margin-left: 20px;
	border: 1px solid #999;
	background-color: #e6e6e6;
	padding: 5px;
	font-size: 14px;
}
.comName {
	font-size: 18px;
	font-weight: bold;
	color: #4e7607;
	text-transform: uppercase;
}
.contHead {
	padding: 0 5px;
	line-height: 32px;
	text-align: center;
	border-bottom: 1px solid white;
}
.txtHead {
	display: inline-block;
	width: 80px;
	margin: 15px 10px 0 8px;
}
.txtField {
	font-family: Arial, Tahoma;
	font-size: 14px;
	color: #4e7607;
	padding: 4px;
	border: 1px solid #a5a5a5;
	width: 310px;
}
#Tel.txtField { width: 150px;}
textarea.txtField { 
	overflow-y: scroll;
	width: 310px; 
	height: 100px;
	resize: none;
}
.button {
	color: #FFF;
	background-color: #4e7607;
	padding: 8px 16px;
	border: none;
	font-size: 14px;
	margin: 20px 30px;
	font-family: Arial, Tahoma;
}
#prodGallery {
	margin-top: 10px;
	padding-bottom: 30px;
	text-align: center;
}
#prodGallery a:hover img {
	opacity:0.7;
	filter:alpha(opacity=70);
}
.prodImgGal {
	width: 100px;
	height: 100px;
	margin: 1px 2px;
}
.sub {
	vertical-align: sub;
    font-size: smaller;
}
table {
    border-collapse: collapse;
}
table, th, td {
   border: 1px solid #71ab0b;
   height: 29px;
}
th {
	background-color: #71ab0b;
	color: #FFF;
	font-weight: normal;
}