/* fixed footer 
 *******************************************************************/
html, body, #page-wrap { height: 100%; }
body > #page-wrap { height: auto; min-height: 100%; }
.content-bg { padding-bottom: 337px; }  /* must be same height as the footer */

#page-footer {
	position: relative;
	margin-top: -319px; /* negative value of footer height */
	height: 337px;
	clear: both;
	min-width:1200px;
} 


/* clear fixed 
 *******************************************************************/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix { display: inline-block; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */


/* main layout 
 *******************************************************************/
.page-content {
	width: 970px;
	margin: 0 auto;
	background: url(../images/layout/footer-pattern.png) no-repeat 53px 8px ;
}


/* body 
 *******************************************************************/
body { 
	padding: 0; margin: 0; 
	background: #fef8e8 url(../images/layout/bg-sor.png) repeat-x left top;
}
#main {
	width: 960px;
	padding: 0 5px;
	background:  url(../images/layout/shadow-content.png) repeat-y left top;
	-background:  url(../images/layout/shadow-content.gif) repeat-y left top;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari 3.0 and Chrome rules here */
	#main {
		background:  url(../images/layout/shadow-content.png) repeat-y;
	}

}
.content-bg {
	/*background: url(../images/layout/pattern-content.jpg);*/
	padding-left: 20px;
	padding-right: 20px;
}


/* header 
 *******************************************************************/
#page-header {
	height: 92px;
	position: relative;
	overflow: hidden;
}
#page-header h1#page-logo {
	position: absolute;
	left: 0; bottom: 20px;
}
#page-header h1#page-logo,
#page-header h1#page-logo a {
	height: 55px; width: 121px;
	float: left;
}
#page-header h1#page-logo a {
	text-indent: -9999px;
	background: url(../images/header/sorkhonkaen-logo.gif) no-repeat left top;
}


/* navigator
 *******************************************************************/
#page-navigate {
	position: absolute;
	right: 0; bottom: 20px;
	width: 780px; height: 45px;
	background: url(../images/header/page-navigate-bg.png) no-repeat left bottom;
	-background: url(../images/header/page-navigate-bg.gif) no-repeat left bottom;
}
#page-navigate li {
	display: inline;
}
#page-navigate li a {
	background: url(../images/header/page-navigate-bg.png) no-repeat left top;
	-background: url(../images/header/page-navigate-bg.gif) no-repeat left top;
	float: left;
	text-indent: -9999px; 
	height: 46px;
	margin-left: 1px;
	opacity: 0;
}
#page-navigate li a.active { opacity: 1; }
/* #page-navigate li a:hover { opacity: 1; } */
#page-navigate li a em { display: none; }
#page-navigate li a#about { width: 87px; background-position: -1px top; }
#page-navigate li a#investor { width: 115px; background-position: -89px top;  }
#page-navigate li a#product { width: 122px; background-position: -205px top; }
#page-navigate li a#news { width: 113px; background-position: -328px top; }
#page-navigate li a#dishes { width: 128px; background-position: -442px top; }
#page-navigate li a#job { width: 106px; background-position: -571px top; }
#page-navigate li a#rss { width: 102px; background-position: -678px top; }


/* navigator tools
 *******************************************************************/
.page-tools {
	position: absolute;
	right: 0px; top: 5px;
	width: 172px;;
}
.contact-number {
	padding-left: 18px;
	line-height: 18px;
	height: 18px;
	float: left;
	background: url(../images/header/icon-contact.png) no-repeat left center;
	font-size: 14px;
	font-weight: bold;
	color: #e1000d;
}
.contact-number span { display: none; }
.lang-tools { float: right; width: 53px; height: 19px; overflow: hidden; margin-left: 5px; }
.lang-tools li { display: inline; }
.lang-tools a {
	float: left;
	height: 19px;
	width: 26px;
	background: url(../images/header/tools-lang.png) no-repeat left bottom;
	-background: url(../images/header/tools-lang.gif) no-repeat left bottom;
	text-indent: -9999px;
}
.lang-tools a.lang-en { background-position: left -38px; }
.lang-tools a.lang-th { background-position: right -38px; width: 27px; }
.lang-tools a.lang-en:hover { background-position: left -19px; }
.lang-tools a.lang-th:hover { background-position: right -19px; }
.lang-tools .active a.lang-en { background-position: left -0px; }
.lang-tools .active a.lang-th { background-position: right -0px; }


/* footer 
 *******************************************************************/
#page-footer {
	background: url(../images/layout/pattern-footer.png) repeat-x left bottom;
}
#page-footer .page-content {
	position: relative;
	height: 337px;
}


/* footer-data 
 *******************************************************************/
#footer-warp { height: 270px; padding-top: 30px; }
#footer-warp .footer-content { float: left; }
#footer-warp .footer-content h3,
#footer-warp .footer-content strong,
#footer-warp .footer-content p { color: #FFF; }
#footer-warp .contact-information { margin-left:73px; width:300px; }

#footer-warp .footer-content h3 { display:block; font-size:20px; font-weight:normal; height:30px; line-height:30px; text-shadow:1px 1px 3px #000000; }
#footer-warp .footer-content strong { display:block; font-size:14px; height:20px; line-height:20px; }
#footer-warp .footer-content p { font-size:12px; }
#footer-warp .footer-content p.contact-number { background: none; display: block; font-size: 13px; margin-top: 2px; padding: 0; }

.sorkhonkaen-annual-report { margin-top: 15px; margin-left: -15px; }
#annual-download { margin-left:27px; width:200px; }
#contact-head-office { }
#contact-factory {}
#contact-form { position:absolute; right:0; top:28px; width: 340px; }
#footer-warp .button-simple { margin-top: 15px; }


/* footer-form
 *******************************************************************/
#contact-form form { width: 350px; margin-left: -10px; }
#contact-form form label { display: none; }
#contact-form form .form-row { clear: both; margin-bottom: 10px; margin-left: 10px; -margin-left: 5px; }
#contact-form form .row-multiple { float: left; height: 20px; clear: none; }
#contact-form form .form-input { 
	background: transparent url(../images/form/input-text.png) no-repeat left top; 
	-background: transparent url(../images/form/input-text.gif) no-repeat left top; 
	width: 141px; 
	height: 20px; 
	line-height: 20px; 
	font-family: tahoma; 
	border: 0; padding: 0 5px; 
	font-size: 12px; 
	color: #777; 
}
#contact-form form .input-textarea { 
	background: transparent url(../images/form/input-textarea.png) no-repeat left top; 
	-background: transparent url(../images/form/input-textarea.gif) no-repeat left top; 
	width: 299px; 
	height: 101px; 
	padding: 5px; 
	font-family: tahoma; 
	font-size: 12px; 
	-margin-left: 5px;
}


#contact-form form .form-row .button-simple { margin-top: 5px; }
.nyroModalClose { 
	position: absolute; 
	top: 3px; right: 3px;
	width: 31px; height: 31px;
	text-indent: -9999px;
	background: url(../images/layout/button-popup-close.png) no-repeat left top;
	-background: url(../images/layout/button-popup-close.gif) no-repeat left top;
}


/* footer-simple-button
 *******************************************************************/
.button-simple,
.button-simple span { 
	display: inline-block; 
	background: url(../images/layout/button-simple-oreang.png) no-repeat left top;
	-background: url(../images/layout/button-simple-oreang.gif) no-repeat left top; 
	height: 26px; line-height: 22px; 
	margin: 0; padding: 0; 
	text-decoration: none; 
	color: #FFF; 
	font-size: 12px; 
	font-style: normal; 
	
	cursor: pointer;
	-position: relative;
}
.button-simple { background-position: left top; padding-left: 15px; margin-right: 10px; clear: both; }
.button-simple span { background-position: right top; padding-right: 20px; margin-right: -10px; text-align: center; }
.button-simple span em { font-size: 10px; margin-left: 5px; font-style: normal; }


/* footer-bar
 *******************************************************************/
#footer-bar {
	position: absolute;
	height: 33px; width: 100%;
	line-height: 33px;
	bottom: 0;
}
#footer-bar * { color: #FFF; font-size: 12px; text-decoration: none; }
#footer-bar .copy-right {
	float: left;
	margin-left: 25px;
}
#footer-bar .terms-and-policy {
	float: right;
	margin-right: 15px;
}
#footer-bar .terms-and-policy li {
	display: inline;
	padding: 0 10px;
}
#footer-bar .terms-and-policy li:first-child {
	border-right: solid 1px #FFF;
}
#footer-bar .terms-and-policy li a:hover { text-decoration: underline; }


/* box 
 *******************************************************************/
.content-box { position: relative; margin-bottom: 10px; }
.content-box .middle { padding: 0 10px; }


/* box 620 
 *******************************************************************/
.content-box-620 { width: 620px; }
.content-box-620 .top { height: 10px; background: url(../images/layout/box-620-top.png); -background: url(../images/layout/box-620-top.gif); overflow: hidden; }
.content-box-620 .middle { background: url(../images/layout/box-620-middle.png) repeat-y left top; -background: url(../images/layout/box-620-middle.gif) repeat-y left top; }
.content-box-620 .bottom { height: 10px; background: url(../images/layout/box-620-bottom.png) no-repeat; -background: url(../images/layout/box-620-bottom.gif); overflow: hidden; }


/* box 930 
 *******************************************************************/
.content-box-930 { width: 930px; margin-left: -5px; }
.content-box-930 .top { height: 10px; background: url(../images/layout/box-930-top.png); -background: url(../images/layout/box-930-top.gif); overflow: hidden; }
.content-box-930 .middle { background: url(../images/layout/box-930-middle.png) repeat-y left top; -background: url(../images/layout/box-930-middle.gif) repeat-y left top; }
.content-box-930 .bottom { height: 10px; background: url(../images/layout/box-930-bottom.png); -background: url(../images/layout/box-930-bottom.gif); overflow: hidden; }


/* content header
 *******************************************************************/
#content-header {
	padding: 15px 0;
	margin: 0 15px 15px;
}
#content-header h1 {
	float: left;
	color: #fffdfa;
	height: 30px;
	line-height: 30px;
	padding: 0 10px 0 15px;
	border-left: 4px solid #E1000D;
	font-size: 20px;
}
#content-header p {
	float: left;
	font-size: 11px;
	padding-left: 20px;
	width: 500px;
	border-left: solid 1px #CCC;
	color: #666;
	height: 30px;
	line-height: 15px;
}
#page-th #content-header p { width: 600px; }
#page-en #content-header p { width: 600px; }
.dashes {
	border-bottom: dashed 1px #B4B3B0;
}

.button-gotop_th,.button-gotop_en {
	margin-left:836px;
	position:absolute;
	background: url(../images/layout/button-gotop-en.png) no-repeat left top;
	display:block;
	float:right;
	height:25px;
	margin-bottom:-8px;
	*margin-bottom:-20px;
	-margin-bottom:-20px;
	text-indent:-9999px;
	width:83px;
	margin-top:3px;
}
.button-gotop_th{
	width:93px;
	background: url(../images/layout/button-gotop-th.png) no-repeat left top;
}

/* fixed header width for sIFR */
#content-header h1 { overflow: hidden; }

#page-en.page-aboutus #content-header h1 {}
#page-en.page-investor #content-header h1 { width: 188px; }
#page-en.page-product #content-header h1 {}
#page-en.page-news #content-header h1,
#page-en.page-news_detail #content-header h1 { width: 200px; }
#page-en.page-dish #content-header h1,
#page-en.page-dish_detail #content-header h1 { width: 231px; }
#page-en.page-job #content-header h1 { width: 182px; }

#page-th.page-aboutus #content-header h1 { width: 105px; }
#page-th.page-investor #content-header h1 { width: 160px; }
#page-th.page-product #content-header h1 { width: 170px; }
#page-th.page-news #content-header h1,
#page-th.page-news_detail #content-header h1 { width: 150px; }
#page-th.page-dish #content-header h1,
#page-th.page-dish_detail #content-header h1 { width: 155px; }
#page-th.page-job #content-header h1 { width: 120px; }

/* fixed header text */
#page-en.page-aboutus #content-header p {}
#page-en.page-investor #content-header p {}
#page-en.page-product #content-header p {}
#page-en.page-news #content-header p {}
#page-en.page-news_detail #content-header p {}
#page-en.page-dish #content-header p,
#page-en.page-dish_detail #content-header p { width: 590px; }
#page-en.page-job #content-header p {}

#page-th.page-aboutus #content-header p {}
#page-th.page-investor #content-header p {}
#page-th.page-product #content-header p {}
#page-th.page-news #content-header p {}
#page-th.page-news_detail #content-header p {}
#page-th.page-dish #content-header p {}
#page-th.page-dish_detail #content-header p {}
#page-th.page-job #content-header p {}