@charset "utf-8";
 @font-face{
      font-family: "33535gillsansmt";
      src: url('../font/33535gillsansmt.eot');
      src: local("Gill Sans MT"), url('../font/33535gillsansmt.woff') format("woff"), url('../font/33535gillsansmt.ttf') format("truetype");
  }
  @font-face {
  font-family: 'PL-EDIT';
  src: url('../font/PL-EDIT/PL-EDIT.eot?#iefix') format('embedded-opentype'),  url('../font/PL-EDIT/PL-EDIT.woff') format('woff'), url('../font/PL-EDIT/PL-EDIT.ttf')  format('truetype'), url('../font/PL-EDIT/PL-EDIT.svg#PL-EDIT') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'supermarket';
  src: url('../font/supermarket/supermarket.eot?#iefix') format('embedded-opentype'),  url('../font/supermarket/supermarket.woff') format('woff'), url('../font/supermarket/supermarket.ttf')  format('truetype'), url('../font/supermarket/supermarket.svg#supermarket') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'DokChampa';
  src: url('../font/DokChampa/DokChampa.eot?#iefix') format('embedded-opentype'),  url('../font/DokChampa/DokChampa.woff') format('woff'), url('../font/DokChampa/DokChampa.ttf')  format('truetype'), url('../font/DokChampa/DokChampa.svg#supermarket') format('svg');
  font-weight: normal;
  font-style: normal;
}

  .fontsforweb_fontid_1416 {
      font-family: "33535gillsansmt";
  }
  header, nav, section, article, aside, footer {
   display:block;
}
.clear{clear:both;overflow:hidden;height:0}
.float-left{float:left}
.float-right{float:right}

.line-space{clear: both; height: 20px;}
.bg-gray{clear:both;
  margin:15px auto 0 auto;
  padding:10px 0;
  background:#333333;
}
body .back{
	width:1035px;
	margin : 0 auto;

}
body{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#51b9f8+0,ffffff+100 */
background: #51b9f8; /* Old browsers */
background: -moz-linear-gradient(top,  #51b9f8 0%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #51b9f8 0%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #51b9f8 0%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#51b9f8', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
color:#000000;font-family:supermarket;font-size:15px;/*letter-spacing:2px;word-spacing:2px;*/line-height: 150%;margin:0}
header{
	width:100%;height:auto;margin:0;padding:0;
}

header .box{
  width:1000px;
  height:80px;
  margin:0 auto;
  padding:0 0px  ;
  overflow:hidden;
  position:relative;
   background:  #F0EDED;

}
header .logo{
    width: 125px;
    height: 125px;
    margin: 10px 0 0 20px;
    display: block;
    position: absolute;
    background: url(../images/logo.png) left top no-repeat;
    z-index:10;
}
header .box .box-inner{
	overflow: hidden;
    position: relative;
     top:0px;left:0px;
      float:left;
      margin:0px 0px 0px 140px;
}


header .box .company-th{
    padding: 10px 0 0;
    font-size: 30px;
    color: #002184;
  /*  font-weight:bold;*/
 /*  font-family:  DokChampa,supermarket,Tahoma;*/
    /*float:left;*/
    text-shadow:0 1px 0 #5A5757;
}
header .box .company-contact{
    padding: 0 0 5px;
    font-size: 18px;
    color: #7e7e7e;
  /*  font-weight:bold;*/
  /*  text-align:left;*/
    font-family:  supermarket,Tahoma;

}
.font-nav-shadow{
	text-shadow: 3px 2px 2px rgba(74, 74, 74, 0.9);
  	/* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  /* IE 5-7 */
  filter: alpha(opacity=80);
  /* Netscape */
  -moz-opacity: 0.8;
  /* Safari 1.x */
  -khtml-opacity: 0.8;
  /* Good browsers */
  opacity: 0.8;
}
header .navbar{height:40px;width:100%;padding:0;top:5px;float:left ; position:relative;right:0;}
/*header .navbar{height:40px;width:100%;padding:0;margin: 0  auto;top:220px;float:left ; right:0;}*/
header  .navbar .navbar-inner{
    margin: 0 auto;
    overflow: hidden;
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
}

header .navbar .navbar-inner ul.nav{
    margin:0;
    padding: 0 0 0 100px; ;
    height:40px;
    max-height:40px;
    list-style: none;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0074b6+0,d1e5f1+100 */
	background:#0D8EDF;
}
header  .navbar .navbar-inner ul.nav li{
   /* line-height: 30px;*/
    font-family: supermarket,Tahoma;
     margin:0;
    padding: 0;
    min-height:40px;

}
header  .navbar .navbar-inner ul.nav li a {
	padding:10px 0px;
	/*border-right:1px solid #525151 ;*/
	margin-top:3px;
	/*text-shadow:none;*/
	text-shadow:0 1px 0 #5A5757;
}
header  .navbar .navbar-inner ul.nav li a span{color:#fff ;padding:0 0px; font-size: 16px;}
header  .navbar .navbar-inner ul.nav li a{text-align:center; }
header  .navbar .navbar-inner ul.nav li a.home{  width:100px; }
header  .navbar .navbar-inner ul.nav li a.about{  width:100px;}
header  .navbar .navbar-inner ul.nav li a.qc{  width:140px;}
header  .navbar .navbar-inner ul.nav li a.material{  width:100px;}
header  .navbar .navbar-inner ul.nav li a.product{  width:100px;}
header  .navbar .navbar-inner ul.nav li a.promotion{  width:100px;}
header .navbar .navbar-inner ul.nav li a.service{ width:100px; }
header .navbar .navbar-inner ul.nav li a.news{ width:100px; }
header  .navbar .navbar-inner ul.nav li a.contact{  width:100px;}

header .navbar .navbar-inner ul.nav li a:hover{}
header .navbar .navbar-inner ul.nav li a:hover,header .navbar .navbar-inner ul.nav li.active a,header .navbar .navbar-inner ul.nav li a:hover span{
    color: #676767;
    text-shadow: none;
    background:none;
    box-shadow:none;

}
header .navbar .navbar-inner ul.nav li.active a{
	/*height:30px;*/
	max-height:40px;
	color: #676565;
}

footer{margin:0 auto;padding:0;overflow:hidden;
	width:1000px;
	background:#F0EDED;
}
footer hr {
	border:none; border-top:1px solid #e5e5e5;margin:0 auto;
}
footer .copyright{
	background: #0D8EDF none repeat scroll 0 0;
	text-align: center;
	padding: 5px;
}
footer .copyright span{
	color: #fff;
	  font-family:  supermarket,Tahoma;
	  font-size:14px;
}

footer .contact{
  line-height:16px;
  text-align:center;
  margin:5px auto 5px auto;

  width:100%;

}
footer .contact h1{
  font-size:16px;
   margin:0px auto;
   line-height:20px;
}
footer .contact p{
  margin:5px auto 0px auto;
  font-size:13px;
  color:#595959;
}
footer .footer-line{	background:#bb1452 ; height:10px;}
footer .menu-footer{
	  width:500px; line-height:16px;  margin:10px auto 10px auto;
}
footer .menu-footer a{
	  color: #0d8fe3;font-weight:bold;  font-family:  supermarket,Tahoma; font-size:16px;padding:0 20px
}
.container{
    width: 1000px;
    margin: 0 auto;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#bee0e9+0,f7faff+100 */
background: #bee0e9; /* Old browsers */
background: -moz-linear-gradient(top,  #bee0e9 0%, #f7faff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #bee0e9 0%,#f7faff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #bee0e9 0%,#f7faff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bee0e9', endColorstr='#f7faff',GradientType=0 ); /* IE6-9 */

}
.container .content-left{
	width:240px;
	position:relative;
	float:left;
	padding-right:0px;
	padding-top:10px;
}

.container .content-right{
	width:750px;
	position:relative;
	float:left;
	padding-top:10px;
}
.nav{
	width:100%;
}
.nav ul{
	 list-style: none;
}
.nav  .icon{
	background:url('../images/bullet2.gif') center top no-repeat ;
	width:12px;
	height:12px;
	margin-top:7px;
	position:absolute;
}
.nav a:link,.nav a:active{
	color:#421200;
	font-size:14px;
	line-height:100%;
	font-weight:bold;
	margin-left:0px;
}
.nav a:hover{
	color:#D35526;
}
.container .content{
	width:100%;
	padding: 0 20px 0 20px;

}
.container .content .image-menu{
	padding: 40px 0 0 0;

}
.image-menu .image2{
	position: relative;
     top:-120px;left:-50px;
}
.menu h1{
	font-family: 'supermarket';
	font-size: 30px;
}
.menu h3{
	font-family: 'supermarket';
	font-size: 18px;
	color:#8d7802;
	 line-height:20px;
}
.container .content-box-content .menu h1,.container .content .menu-right h1{
	padding:10px 0px;
    color:#706c6c;
    margin:0;
}

.container .content .brand-title{
  	height:33px;
  	z-index:999;
 }
.container .content .brand-title h3{
	padding:0 0 0 0px;
	font-size: 16px;
	font-family: '33535gillsansmt';
    color:#ff6600;
    	font-weight:bold;
    margin:0;
    line-height:20px;
}
.container .content .menu hr{
	background:#ef4023 ;
	height:8px;
	margin:0px;
	width:280px;
}

.container .content .menu-product h1{
	padding:0 0 0 10px;
	font-size: 20px;
	font-family: '33535gillsansmt';
    color:#f90404;
    margin:0;
    line-height:20px;
}
.content .content-box-content{
	padding: 30px 0 30px 30px;
	 float:left;
	 margin-top:0px;
	 width:90%;
}
.container .content .content-box{
	padding: 20px 5px;
}
.container .content .content-box-about{
	padding: 20px 5px;
}
.container .content .content-box-contact{
	padding: 70px 20px 0 20px;
}
.container .content .content-box-product{
	padding: 0px 20px 0 20px;
	 float:left;
}
.container .content .product-nav{
	 float:left;
	 width:300px;
	 min-width:300px;
}
.hilight{
	width:100%;margin:0;padding:2px 0 0 0 ;
}
.hilight #myCarousel{
	 width: 990px;
	 height: 350px;
	 margin: 0px auto 0;
	 padding:0px 0 20px 0;
}

.hilight #myCarousel .carousel-indicators {
	right: 50%;
	/*top: auto;*/
	top:345px;
	bottom: 0px;
	margin-right: -19px;
}
/* Changes the colour of the indicators */
.hilight #myCarousel .carousel-indicators li {
	background: #c0c0c0;
	width:16px;
	height:16px;
	border-radius:8px 8px 8px 8px;
	border:#c63131;
}
.hilight #myCarousel .carousel-indicators .active {
background: #3d9062;
}
#myCarousel .carousel-control{
    width: 24px;
    height: 31px;
    border: none;
    margin: 0;
    border-radius:0px 0px 0px 0px;
    opacity:1;
}
#myCarousel .carousel-inner {
	 /*border:5px solid #fff ;*/
}

#myCarousel .carousel-control.left{
    background: url(../images/control_left.png) no-repeat;
    left: -9px;
}
#myCarousel .carousel-control.right{
    background: url(../images/control_right.png) no-repeat;
    right: -9px;
}
ul.contact-form{
	 width:550px;
	 margin: 0 auto;
	 list-style:none;
}
ul.contact-form li {
	line-height:inherit !important;
}
ul.contact-form li .text {
  float:left;
  /*width:380px;*/
  width:250px;
 /* border:1px solid #545454 ;*/
  padding:3px 5px;
/* background:#aedd8c;*/
  margin:3px;
  color:#f90404;
}
ul.contact-form li .labeltext{
  float:left;
  width:200px;
  /*height:20px;*/
  padding:5px;
/*  border:1px solid #545454;*/
  margin:3px;
color:#a7a4a4;
text-align:right;
font-weight:bold;
}

ul.contact-form li  .des{
height:82px;
}
ul.contact-form li  .textvalid{
height:50px;
}
.btn-send-mail{
	background:#f6f3f3;
	border-radius:6x;
	padding: 2px 7px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	margin:3px 0 3px 0;
}


.product-lable{
	color: #1029e8;
}
.product-download{
	color: #d30505;
}
.content-right .content-box-content{
	padding:25px  0 0 10px;
	margin:0;
	list-style:none;
	min-height:250px;
}

.content-box-content .product-list{
	padding:0;
	margin:0;
	list-style:none;
}
.content-box-content .product-list li{
	float:left;
	margin:0 20px 40px 0;
	position:relative;
}
.content-box-content .product-list li.end-row{
	margin-right:0;
}
 .content-box-content .product-list li img{
	border:1px solid #285d02;
	width:270px;
	height:170px;

}
 .content-box-content .product-list li .description{
/*	display:none;
}
.content .content-box-content .product-list li:hover .description{*/
	background: #0072bc;


	line-height:16px;
	/*position:absolute;*/
	/*bottom:0;*/
	left:0;
	width:262px;
	height:32px;
	margin:0 auto;
	padding:5px;
	overflow:hidden;
	display:block;
	font-size:14px;
	/*white-space:nowrap;*/
}
.content-box-content .product-list li .description a{
	font-size: 18px;
	/*font-family: '33535gillsansmt';*/
    color:#fff;
}
 .content-box-content .product-list li .description a:hover{
	color:#d86c0d;
}

 .content-box-content .product-list li .description p{
	margin:0;
	padding:0;
	width:168px;
	height:35px;
	overflow:hidden;
	color:#fff;
}
 .content-box-content .product-list li .icons img{
 	z-index:999;
	width:40px;
	height:40px;
	position:absolute;
	/*bottom:0;*/
	right:0;
}


.content-box-content .news-list{
	padding:0;
	margin:0;
	list-style:none;
}
ul.news-list li .thumbnail{
	display:block;
	position:relative;
	width:280px;
	height:200px;
	overflow:hidden;
	border:none;
	padding:0;
	margin:0;
}

 .content-box-content .news-list li{
	float:left;
	margin:0 20px 20px 0;
	position:relative;
}
 .content-box-content .news-list li.end-row{
	margin-right:0;
}
 .content-box-content .news-list li img{
	border:1px solid #285d02;
	width:278px;
	height:196px;
}
 .content-box-content .news-list li .description{
	display:none;
}
 .content-box-content .news-list li:hover .description{
	background: rgba(0, 0, 0, 0.65);
	line-height:16px;
	color:#fff;
	position:absolute;
	bottom:0;
	left:0;
	width:270px;
	height:35px;
	margin:0 auto;
	padding:5px;
	overflow:hidden;
	display:block;
	font-size:14px;
	/*white-space:nowrap;*/
}
 .content-box-content .news-list li .description p{
	margin:0;
	padding:0;
	width:278px;
	height:35px;
	overflow:hidden;
}


 .content-box-content .product-type-list{
	padding:0;
	margin:0;
}
 .content-box-content .product-type-list li{
	float:left;
	margin:0 20px 20px 0;
	position:relative;
	width:700px;
	list-style:none;
}
 .content-box-content .product-type-list li h3 a{
	/*font-family:'33535gillsansmt';*/
	font-size:20px;
	color:#FF7C08;
	line-height:150%;
}
ul.product-type-list li .thumbnail{
	display:block;
	position:relative;
	/*width:100%;
	height:100%;*/
	overflow:hidden;
	border:none;
	padding:0;
	margin:0;
	float:left;
}

 .content-box-content .product-type-list li .description{
	line-height:180%;
	color:#5C5C5C;
	position:relative;
	bottom:0;
	left:0;
	width:400px;
	margin:0 auto;
	overflow:hidden;
	display:block;
	font-size:14px;
	float:left;
	left:20px;
	font-family: '33535gillsansmt';
	/*white-space:nowrap;*/
}
 .content-box-content .product-type-list li .description   >ul{margin:0;}
 .content-box-content .product-type-list li .description  >ul >  li{	margin:0;list-style-type: disc !important ;  width:400px !important ;}
.w-pagination{
	float:left;
	margin:10px 20px 0 0;
	color:#fff;
}
.w-pagination span{
	line-height:20px;
}
.w-pagination ul{
	-webkit-box-shadow:none;
     -moz-box-shadow:none;
          box-shadow:none;
}
.w-pagination ul li{
}
.w-pagination ul li a{
	background-color:#d86c0d;
	border:none;
	margin:0 3px;
	-webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
}
.w-pagination ul li.active a, .w-pagination ul li a:hover{
	background-color:#a51f52;
	color:#ffffff;
}
.w-pagination  ul li.disabled a,.w-pagination  ul li.disabled a:hover{
	color:#fff;
	filter: Alpha(Opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
}
.w-pagination  ul li:first-child a,.w-pagination  ul li:last-child a{
	background:none;
	-webkit-border-radius: 0;
     -moz-border-radius: 0;
          border-radius: 0;
		  border:none;
		  color:#fff;
}
.w-pagination  ul li .icon-arrow-left{
	background:url(../images/icon/ico_left.png) left center no-repeat;
	width:10px;
	margin:0;
}
.w-pagination  ul li a .icon-arrow-right{
	background:url(../images/icon/ico_right.png) right center no-repeat;
	width:10px;
	margin:0;
}
/*a, a:hover{
	color:#FFF;
	text-decoration:none;
}
*/
a.nav-link:link ,a.nav-link :active{
	color:#1498eb;
	text-decoration:none;
}
a.nav-link:hover{
	color:#01D226 /*E410A8*/;
	text-decoration:none;
}
 ol ul{
 	color:#fff;
 }
 .bank{
 	text-align : center;
 }




 .container .navleft{height:auto;width:100%;padding:0;margin:0;float:left ; position:relative;right:0;}
.container  .navleft .navleft-inner{
    width:100%;
    margin: 0 auto;
    overflow: hidden;
    border:none;
    background:none;
    border-radius: 0;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;

    /*border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
   background:#5fdabb;*/
}

.container .navleft .navleft-inner ul.nav{
    margin:10px;
    list-style: none;
    background:#fff;
	width:90%;

}
.container  .navleft .navleft-inner ul.nav li{

    border:none;
    border-bottom: thin dotted #787a79;
   padding:3px 0 ;
}
.container  .navleft .navleft-inner ul.nav li a span{color:#717070 ;padding:0 10px;}
.container  .navleft .navleft-inner ul.nav li a{
	color: #717070;padding:3px 0 3px 10px ;margin:0 0 0 0px;text-align:left; font-size: 18px; }
.container  .navleft .navleft-inner ul.nav li a:hover{}
.container  .navleft .navleft-inner ul.nav li a:hover,header .navleft .navleft-inner ul.nav li.active a,header .navleft .navleft-inner ul.nav li a:hover span{
   /* -webkit-box-shadow:none;
     -moz-box-shadow:none;
    box-shadow:none;*/
    color: #63f82f;
    text-shadow: none;
	 font-size: 18px;
}
.container  .navleft .navleft-inner ul.nav li.active a{
	/*height:30px;*/

	color: #676565;
}
.container  .navleft .search{
	  margin:10px;
	width:90%;
}

.container  .navleft  .menu h1{
	color: #424342;
    font-family: CSChatThai,"33535gillsansmt";
    font-size: 20px;
    font-weight: bold;
    line-height: 20px;
    margin: 0;
    padding: 5px;;
}
.container .navleft .menu{
	width:100%;
	margin:0 auto;
	background: #cecece; /* Old browsers */
background: -moz-linear-gradient(top,  #cecece 0%, #bdbdbd 51%, #bdbdbd 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cecece), color-stop(51%,#bdbdbd), color-stop(100%,#bdbdbd)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #cecece 0%,#bdbdbd 51%,#bdbdbd 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #cecece 0%,#bdbdbd 51%,#bdbdbd 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #cecece 0%,#bdbdbd 51%,#bdbdbd 100%); /* IE10+ */
background: linear-gradient(to bottom,  #cecece 0%,#bdbdbd 51%,#bdbdbd 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cecece', endColorstr='#bdbdbd',GradientType=0 ); /* IE6-9 */
}
.container  .navleft  .menu .con{
	background:url('../images/bullet.gif') center top no-repeat ;
	width:16px;
	height:15px;
	margin-top:4px;
	position:absolute;
}



.content .content-box-content .catalog-list {
	padding:0;
	margin:0;
	list-style:none;
}
.content .content-box-content .catalog-list li{
	float:left;
	margin:0 20px 20px 0;
	border: none;
	border-bottom: thin dotted #787a79;
	width:90%;
}
.content .content-box-content .catalog-list li .description{
	position: relative;
	float:left;
}
.content .content-box-content .catalog-list li .ext{
	position: relative;
	float:right;
}
.content .content-box-content .catalog-list li .description p a{
	color: #676565;
	font-size:14px;
}
table.product{
	width:100%;
}
table.product td.thumbnail{
	width:220px;
	border:none;
	padding:10px;
}
table.product td.product-descript{
	vertical-align:top;
	width:480px;
}
table.product td.product-descript h3{
	font-size:17px;
	line-height:110%;
}