@charset "utf-8";

/* CSS Document */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
center,
dl, dt, dd, ol, ul, li,
form, label, legend,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;


	}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
	}
ul,
ol {
  margin-top: 0;
  margin-bottom:0;
	}

ul ul,
ol ul,
ul ol,
ol ol {
  margin-bottom: 0;
	}
ul li{
	margin:0;
	padding:0;
	list-style:none;
	}

a{ 
	color: #000;
	text-decoration: none;
	}
a:hover { 
	
	}
a:visited { 
	text-decoration:none;	
	}
.bold{
	font-weight:bold;
	}
.clear{
	clear:both;
	}	
p{
	font-size:13px;
	line-height:20px;	
	}
span{

}
span:first-child {
}
.bar{
margin-bottom:10px;
}
.bar span{
line-height:30px;
/*font-size:13px;*/
}
img{
	border:none;
	}	
.text-left {
  text-align: left;
	}
.text-right {
  text-align: right;
	}
.text-center {
  text-align: center;
	}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: 'supermarket', Arial, sans-serif;
  font-weight: 500;
  line-height: 1.1;
	}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small,
.h1 small,
.h2 small,
.h3 small,
.h4 small,
.h5 small,
.h6 small {
  font-weight: normal;
  line-height: 1;
	}

h1,
h2,
h3 {
/*  margin-top: 20px;
  margin-bottom: 10px;*/
	}

h4,
h5,
h6 {
  margin-top: 10px;
  margin-bottom: 10px;
	}
	
h1,
.h1 {
  font-size: 38px;
}

h2,
.h2 {
  font-size: 32px;
	}

h3,
.h3 {
  font-size: 24px;
	}

h4,
.h4 {
  font-size: 18px;
	}

h5,
.h5 {
  font-size: 14px;
	}

h6,
.h6 {
  font-size: 12px;
	}

h1 small,
.h1 small {
  font-size: 24px;
	}

h2 small,
.h2 small {
  font-size: 18px;
	}

h3 small,
.h3 small,
h4 small,
.h4 small {
  font-size: 14px;
	}
	

.more{
	float:right;
	width:64px;
	height:27px;
	text-align:right;
	color:#000000;
	cursor:pointer;
		font:19px/20px 'supermarket', Arial, sans-serif;
}
.more a{
	color:#000000;
	cursor:pointer;
		font:15px/30px 'supermarket', Arial, sans-serif;
}
.more a:hover{
	color:#ff6c00;
}


/*******************************************************/
body{
	overflow-x:hidden;
	font-size:14px;
	line-height:140%;
	font-family:Arial, Helvetica, sans-serif;
	}
#wrapper{
	float:left;
	width:100%;
	margin:0px;
	padding:0px;
	height:auto;
	}
#container{
	float:left;
	width:100%;
	height:auto;
	position:relative;
	}
#main{
	position:relative;
	margin:0 auto;
	/*overflow:hidden;*/
	width:1020px;
	}	
.row{
	float:left;
	width:100%;
	margin:0;
	}

/********************************************************** HEADER *******************************************/
	#header{
		float:left;
		width:100%;
		height:786px;
		background:url(../images/all/head/bg-head.jpg) top center no-repeat;
	}
	.rowfixmenu{
		width:100%;
		height:98px;
	position:fixed;
	top:0;
	left:0;
	background:url(../images/all/menu/bg.png) top left repeat;
	}
	.logo-header{
	float:left;
	width:271px;
	height:auto;
	position:relative;
	}
	.logo-header .logo-header-in{
		position:absolute;
		top:0;
		left:-96px;
		width:271px;
		height:253px;
		background:url(../images/all/head/logo.png) top left no-repeat;
	}
		.logo-header .logo-header-inpic{
		position:absolute;
		top:0;
		left:-96px;
		width:271px;
		height:253px;
		display:none;
	}
	.logo-header-1{
	float:left;
	width:170px;
	height:auto;
	position:relative;
	}
	.logo-header-1 .logo-header-in-1{
		position:absolute;
		top:0;
		left:0px;
		width:170px;
		height:159px;
	}
	 .menu-top{
		float:right;
		width:749px;
		height:46px;
		position:relative;
	}
	.menu-top ul{
		float:right;
		width:auto; /* 245px */
		height:46px;
	}
	 .menu-top ul li{
		float:left;
		width:49px;
		height:46px;
	}

	/*********************Flash*************************/
#flash{
	top:0;
	left:0;
	width:100%;
	height:786px;
	/*background:url(../images/all/head/bg-head.jpg) top center no-repeat;*/
	background:url(../images/all/head/bg-head.png) top center no-repeat;
	position:absolute;
	}
/*********************Flash*************************/	

	
/*****************************fontsize**********************************/
 .fontsize{
	/*top: 32px;
	right: 6px;
	position: absolute;*/
	top:0;
	right: 490px;
	position:absolute;
	margin-top:14px;
	width: 76px;
	height: auto;
	/*z-index: 99999;*/
}

 .fontsize .font-right{
	float:left;
	width:76px;
	height:auto;
}
.fontsize .font-right ul{
	float:left;
	width:91px;
	height:auto;
}
 .fontsize .font-right ul li{
	float:left;
	padding:0px 6px;
	border-right:1px solid #5a006b;
	height:auto;
}
 .font-small{
	font-size:16px;
	line-height:19px;
	color:#6e6e6e;
}
 .font-small a{
	font-size:16px !important;
	line-height:19px;
	color:#6e6e6e;
}
 .font-small a:hover{
	font-size:16px;
	text-decoration:none;
	line-height:19px;
	color:#b601d7;
}
 .font-medium{
	font-size:20px;
	line-height:18px;
	color:#6e6e6e;
}
 .font-medium a{
	font-size:20px !important;
	line-height:18px;
	color:#6e6e6e;
}
 .font-medium a:hover{
	font-size:20px;
	text-decoration:none;
	line-height:18px;
	color:#b601d7;
}
.font-big{
	font-size:24px ;
	line-height:18px;
	color:#6e6e6e;
}
 .font-big a{
	font-size:24px !important;
	
	line-height:18px;
	color:#6e6e6e;
}
 .font-big a:hover{
	font-size:24px;
	text-decoration:none;
	line-height:18px;
	color:#b601d7;
}
/*****************************fontsize**********************************/
/*********************language*******************/
.language{
	/*top:54px;
	right:0px;*/
	position:absolute;
	top:0;
	right:257px;
	margin-top:10px;
	width:194px;
	height:51px;
	/*position:absolute;
	z-index:9999;*/
	}
/*********************language*******************/
/*********************overview*******************/
.overview{
	float:left;
	margin-top:283px;
	width:100%;
	height:auto;
	position:relative;
}
.overview-left{
	float:left;
	display:block;
	width:310px;
	height:auto;
	position:relative;
}
.overview-left .overview-pic{
	top:0;
	left:0;
	width:375px;
	height:365px;
	position:absolute;
	z-index:2
}
 .overview-right{
	float:right;
	width:100%;
	display:block;
	height:auto;
}
.overview-right .overview-map{
	top:90px;
	right:0;
	width:358px;
	height:198px;
	position:absolute;
	z-index:2;
}
.overview-right .overview-text{
	position:absolute;
	top: 100px;
    right: 250px;
	width:370px;
	height:198px;
	z-index:3;
}
/*********************overview*******************/
/*********************ourbrands*******************/
.ourbrands{
	float:left;
	width:100%;
	height:auto;
	position:relative;
}
.ourbrands .ourbrands-top{
	float:left;
	width:100%;
	height:auto;
	position:relative;
	text-align:center;
	font-size:30px;
	line-height:89px;
	color:#30b3c7;
}
.ourbrands .ourbrands-mid{
	float:left;
	width:100%;
	height:auto;
	position:relative;
}
.ourbrands .ourbrands-mid ul{
	float:left;
	width:100%;
	height:auto;
	position:relative;
}
.ourbrands .ourbrands-mid ul li{
	float:left;
	width:250px;
	height:auto;
	position:relative;
}
	.ourbrands .ourbrands-mid ul li span.silverbell{
	float:left;
	width:250px;
	height:380px;
	}
	.ourbrands .ourbrands-mid ul li span.bigbell{
	float:left;
	width:250px;
	height:380px;
	}
	.ourbrands .ourbrands-mid ul li span.andaman{
	float:left;
	width:250px;
	height:380px;
	}
	.ourbrands .ourbrands-mid ul li span.siamsauce{
	float:left;
	width:250px;
	height:380px;
	}
	.brands-pic{
	float:left;
	width:100%;
	height:380px;
	}
	.brands-text{
	float:left;
	margin-top:-32px;
	width:250px;
	height:auto;
	text-align:center;
	font-size:19px;
	color:#6d6d6d;
	}
	.brands-text a{
	color:#6d6d6d;
	}
	.brands-text a:hover{
	color:#f1620c;
	}
	.view-all{
	float:left;
	width:250px;
	height:auto;
	}
	.view-all .view-btn{
	margin:0 auto;
	width:87px;
	height:30px;
	text-align:center;
	background:url(../images/all/brands/btn-viewall.png) top center no-repeat;
	font-size:13px;
	line-height:32px;
	color:#FFF;
	font-weight:bold;
	}
	.view-all .view-btn a{
	font-size:13px;
	line-height:32px;
	color:#FFF;
	font-weight:bold;
	}
	.view-all .view-btn a:hover{
	font-size:13px;
	line-height:32px;
	color:#f7ffae;
	font-weight:bold;
	}
/*********************ourbrands*******************/
/*********************slogan*******************/
	.slogan{
	margin:0 auto;
	width:542px;
	height:auto;
	position:relative;
	}
	.slogan .slogan-in{
		position:absolute;
		top:109px;
	width:542px;
	height:auto;
	text-align:center;
	font-weight:bold;
	color:#FFF;
	 text-shadow: 1px 2px 2px #847b6a;
	}
/*********************slogan*******************/
/*********************ourproduct*******************/
.ourproduct{
	float:left;
	width:100%;
	height:auto;
	position:relative;
}
.spoon{
	top:-10px;
	left:-70px;
	width:677px;
	height:233px;
	position:absolute;
	z-index:999;
}
.ourproduct .product-top{
	float:left;
	padding-top:30px;
	width:221px;
	height:98px;
	font-size:30px;
	line-height:35px;
	font-weight:bold;
}
.ourproduct .product-mid{
	float:left;
	width:100%;
	height:auto;
	position:relative;
}
/************product-select*****************/
.ourproduct .product-mid .select{
	position:absolute;
	    top: -53px;
    left: 70px;;
	width:919px;
	height:auto;
}
	
	.select-text{
		float:left;
		width:100%;
		height:auto;
	}
	.fish-text-1{
	margin:0 auto;
	padding:10px 0;
	width:50%;
	height:auto;
	font-size:36px;
	line-height:36px;
	text-align:center;
	background:url(../images/all/container4/dotted.png) bottom left repeat-x;
	color:#476885;
	}
	
		.fish-text-2{
	margin:0 auto;
	padding:10px 0;
	width:50%;
	height:auto;
	font-size:14px;
	line-height:20px;
	text-align:center;
	color:#5b500a;
	min-height: 100px;	
	}
		.fish-text-3{
	margin:0 auto;
	width:50%;
	height:auto;
	text-align:center;
	}
	.select-pic{
		float:left;
		margin-top:-30px;
		width:919px;
		height:733px;
		position:relative;
	}
	.select-pic .select-pic-slide{
		position:absolute;
		top:0;
		left:0;
		width:919px;
		height:733px;
		z-index:2;
	}
	.select-pic .select-pic-slide ul{
		float:left;
		width:919px;
		height:733px;
	}
	.select-pic .select-pic-slide ul li{
		float:left;
		width:919px;
		height:733px;
	}
	.select-pic .select-icon-slide{
		position:absolute;
		bottom:413px;
		left:0px;
		width:919px;
		height:31px;
		text-align:center;
		z-index:9999;
	}
	/************product-select*****************/

.ourproduct .product-mid .normal-left{
	position:absolute;
	left: -83px;
    top: -16px;
	width:470px;
	height:432px;
	z-index:9;
}
.ourproduct .product-mid .normal-right{
	position:absolute;
	right: -168px;
    top: -60px;
	width:470px;
	height:432px;
	z-index:9;
}
.ourproduct .product-bottom{
	float:left;
	width:100%;
	height:auto;
}
/*********************ourproduct*******************/
/********************************************************quality-standard******************************************************/
.quality-standard{
	float:left;
	width:100%;
	height:auto;
}
.quality-standard .qs-top{
	float:left;
	text-align:center;
	width:100%;
	height:50px;
}
.quality-standard .qs-mid{
	float:left;
	width:100%;
	height:auto;
	background:url(../images/all/container5/bg.png) top center no-repeat;
}
.quality-standard .qs-mid ul{
	float:left;
	margin-top:36px;
	width:100%;
	height:auto;
}
.quality-standard .qs-mid ul li{
	float:left;
	padding:0px 12px;
	display:block;
	width:221px;
	height:auto;
	border-right:dotted 2px #c3d1db;
}
.quality-standard .qs-mid ul li:last-child{
	border-right:0;
}
.quality-standard .qs-mid ul li span.qs-pic{
	float:left;
	display:block;
	width:221px;
	height:151px;
}
.quality-standard .qs-mid ul li span.qs-text{
	float:left;
	display:block;
	width:221px;
	height:28px;
	text-align:center;
	font-weight:bold;
	color:#fdd83c;
}
.quality-standard .qs-mid ul li span.qs-text a{
	font-weight:bold;
	color:#fdd83c;
}
.quality-standard .qs-mid ul li span.qs-text a:hover{
	font-weight:bold;
	color:#fff;
}
/********************************************************quality-standard******************************************************/
/********************************************************link******************************************************/
.link{
	float:left;
	padding-top:37px;
	width:100%;
	height:auto;
}
.link-list{
	float:left;
	width:100%;
	height:auto;
}
.link-list .link-top{
	float:left;
	width:100%;
	height:auto;
	color:#27577c;
	font-size:17px;
	font-weight:bold;
}
.link-list .link-mid{
	float:left;
	width:100%;
	height:auto;
}
.link-list .link-mid ul{
	float:left;
	width:100%;
	height:auto;
}
.link-list .link-mid ul li{
	float:left;
	display:block;
	width:100%;
	height:auto;
	list-style:none;
	text-decoration:none;
}
.link-list .link-mid ul li a{
	color:#27577c;
}
.link-list .link-mid ul li a:hover{
	color:#e07c1b;
}
/********************************************************link******************************************************/
/*********************************************************footer***************************************************************/
#footer{
	float:left;
	margin-top:-425px;
	width:100%;
	height:425px;
}
#footer .footerin{
	margin:0 auto;
	width:700px;
	height:425px;
	position:relative;
}
#footer .footerin .logo-footer{
	margin:0 auto;
	width:113px;
	height:172px;
	display:block;
}

#footer .footerin .address{
	margin:0 auto;
	width:100%;
	height:auto;
	text-align:left;
	color:#bb8e46;
	text-align:center;
}

#footer .footerin .tel{
	margin:0 auto;
	width:100%;
	height:auto;
	text-align:left;
	color:#fceabd;
	text-align:center;
	background:#8d6846;
	font-size:13px;
	line-height:25px;
	-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
#footer .footerin .email{
	margin:0 auto;
	width:100%;
	height:auto;
	text-align:left;
	color:#9b6b1f;
	text-align:center;
	font-size:18px;
	line-height:30px;
}
#footer .footerin .copyright{
	margin:0 auto;
	width:100%;
	height:auto;
	text-align:center;
	color:#000;
	font-size:13px;
}
#footer .footerin .copyright a{
	font-size:13px;
	color:#366c01;
}
#footer .footerin .copyright a:hover{
	font-size:13px;
	color:#1fc1d9;
}
#attr {
	margin:0 auto;
	margin-top:10px;
	width:70%;
	text-align:right;
	left: 699px;
	}
	
	
.admin-system{
	position:relative;
	float:left;
	width:110px;
	height:15px;
	color:#000;
	padding:3px;
	font-size:12px;
	line-height:16px;
	text-align: left;	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background-position:4% 50%;
	}
	.admin-system a{
	color:#000;
	}
	.admin-system a:hover{
		color:#5a4026;
	}
.admin-system .notification{
	position:absolute;
	top:4px; right:0px;
	width:32px;
	height:15px;
	color:#fff;
	background-color:#ba142b;
	text-align:center;
	font-size:11px;
	line-height:16px;
}
.admin-system a{
	display:block;
	width:100%;
}
.stat{
	float:left;
	width:50px;
	height:18px;
	margin:3px 0 0 5px;
	padding-right:5px;
	background:#2d805d;
	color:#fff;
	border:#3eaa7f 1px solid;
	line-height:18px;
	}
.hi-stat{
	float:left;
	width: auto;
	height:18px;
	margin:3px 0 0 5px;	
	}	

/*********************************************************footer***************************************************************/
@media (max-width: 900px) {
body{
overflow-x:scroll;
}
}
	
@media (max-width: 1024px) {
	.ourbrands .ourbrands-mid ul li{
		width:240px;
	}
	.spoon{
		display:none;
	}
	.quality-standard .qs-mid ul li {
		width:217px;
	}
	.logo-header .logo-header-in{
		display:none;
	}
	.logo-header .logo-header-inpic{
		display:block;
	}
}


@media (max-width: 1440px) {
.spoon img{
width:70%;
display:block;
}
}