@charset "utf-8";

/*
###########################################
Bangkok Post Version 2.0
copyright: Post Publishing PCL. since 2008

author: radiz (thaiCSS)
some styles credit to: Mc_Cathie (thaiCSS)
###########################################
*/

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, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;
	
}

* {
	padding: 0;
	margin: 0;
	outline: none;
	list-style-type: none;
	text-decoration: none;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: rgb(0,0,0);
	background: rgb(33,60,112) url(../img/bg/bg_container.gif);
	padding-bottom: 0px;
}

/*
############################
Junk style sheets goes here
############################
*/

.addBorder {_padding-top: 10px; /padding-top: 10px}
.buzzBoombox {width: 300px; height: 267px; padding-top:13px;}
	
/*
##################
Content Container
##################
*/

#container {
	width: 100%;
	clear: both;
	background: rgb(255,255,255);
}

#wrapper {
		width: 1000px;
		margin: 0 auto;
		background: transparent url(../img/bg/bg_contentWrapper.png);
}

#wrapper {behavior: url(../pngfix/iepngfix.htc);}

.endingShadow {
	width: 984px;
	height: 8px;
	margin: 0 auto;
	background: url(../img/bg/bg_endingShadow.png);
}

.endingShadow {behavior: url(../pngfix/iepngfix.htc);}


/*
##################
Start bkkPost Tab
##################
*/

#bkkPostTab {
	width: 982px;
	height: 20px;
	margin: 0 auto;
	font-size: 10px;
	position: relative;
	z-index: 9;
}

#bkkPostTab:after {content: "."; clear: both; height: 0; display: block; visibility: hidden;}

	#bkkPostTab #memberAssistance {
		width: 200px;
		height: 15px;
		color: rgb(33,60,112);
		float: left;
		padding-top: 5px;
	}
	
		#memberAssistance li {
			display: block;
			float: left;
			padding: 2px 5px 0;
			border-right: 1px dotted rgb(197,197,197);
		}
		
		#memberAssistance li a {color: rgb(33,60,112);}
		#memberAssistance li a:hover {color: rgb(247,148,29);}
	
	#bkkPostTab #globalAssistance {height: 20px; float: right;}
		
		#globalAssistance p.dateTime {float: left; color: rgb(33,60,112); padding-top: 7px;}
		
		#globalAssistance .assistanceTabs {
			width: 380px;
			height: 15px;
			float: left;
			padding-left: 20px;
			margin: 5px 5px 0 0;
			background: url(../img/bg/bg_assistanceTabs.png) no-repeat;
		}
		
		#globalAssistance .assistanceTabs {behavior: url(../pngfix/iepngfix.htc);}
		
			.assistanceTabs li {
				color: rgb(255,255,255);
				float: left;
				padding: 2px 5px 0;
				border-right: 1px dotted rgb(112,112,112);
			}
			
			.assistanceTabs li a {color: rgb(255,255,255);}
			.assistanceTabs li a:hover {color: rgb(33,60,112);}
			
		#globalAssistance .truehits {height: 17px; float: left; padding: 3px 0 0 3px;}
		
/*
#############
Start header
#############
*/

#header {
	width: 960px;
	height: 195px;
	margin:  -4px auto 0;
	background: rgb(255,255,255) url(../img/bg/bg_header.gif) no-repeat;
	position: relative;
	padding: 20px 20px 0;
	_z-index: 8;
}

	h1.mainTitle {font-size: 0; height: 0; visibility: hidden;}
	
	#header .headerAd {
		width: 960px;
		height: 90px;
		position: absolute;
		top: 80px;
		left: 20px;
		z-index: 900;
	}
	
		.headerAd:after {content: "."; clear: both; height: 0; display: block; visibility: hidden;}
		
		.headerAd .mini1stBanner, .headerAd .mini2ndBanner {
			width: 98px;
			height: 84px;
			background: transparent url(../img/bg/bg_miniHeaderAd.gif) no-repeat;
			padding: 5px;
		}
			
			.headerAd .mini1stBanner {float: left; margin-right: 1px; overflow: hidden;}
			.headerAd .mini2ndBanner {float: right; margin-right: -3px; overflow: hidden;}
				
			.headerAd .leaderAd {
				width: 728px;
				height: 90px;
				position: relative;				
				z-index: 999 !important;
				float: left;
				margin: 2px 0 0 10px;
				overflow: hidden;
			}
			
			/* Change When rollOver by javaScript */
			.headerAd .leaderAdExpand {
				width: 728px;
				height: 300px;
				position: relative;				
				z-index: 999 !important;
				float: left;
				margin: 2px 0 0 10px;
			}
			
			.headerAd .alignCenter {text-align: center;}
			
	#header p.homepage {
		width: 468px;
		height: 51px;
		font-size: 12px;
		float: left;
	}
	
	#header #topPageSearch {
		width: 321px;
		height: 27px;
		font-size: 12px;
		color: rgb(255,255,255);
		background: url(../img/bg/bg_headerSearch.jpg) no-repeat;
		float: right;
		padding: 8px 0 0 10px;
	}
		
		#topPageSearch a {color: rgb(255,255,255); text-decoration: underline;}
		#topPageSearch a:hover {text-decoration: none;}
		
		#topPageSearch .fixPosition {margin-bottom: -5px;}
		#topPageSearch #searchWords {width: 132px; height: 16px; border: 2px solid rgb(61,96,164);}
		
	/*
	################
	Main Navigation
	################
	*/

	#mainNavigation {
		width: 960px;
		height: 26px;
		position: absolute;
		left: 10px;
		top: 189px;
		z-index: 0;
	}
	
		#mainNavigation ul {width: 765px; height: 26px; padding-left: 15px;}
		#mainNavigation ul li {float: left; font-size: 12px;}
		
		#mainNavigation ul li a {
			display: block;
			text-decoration: none;
			height: 26px;
			background-position: 0 0;
			background-repeat: no-repeat;
		}
		
		#mainNavigation ul li a:hover {background-position: 0 -26px;}
		#mainNavigation ul li a.active {background-position: 0 -26px;}
		#mainNavigation ul li span {visibility: hidden;}
		
		#mainNavigation ul li#news a {background-image: url(../img/navigation/news.jpg); width: 49px; padding-right: 2px;}
		#mainNavigation ul li#business a {background-image: url(../img/navigation/business.jpg); width: 73px; padding-right: 2px;}
		#mainNavigation ul li#opinion a {background-image: url(../img/navigation/opinion.jpg); width: 60px; padding-right: 2px;}
		#mainNavigation ul li#travel a {background-image: url(../img/navigation/travel.jpg); width: 58px; padding-right: 2px;}
		#mainNavigation ul li#leisure a {background-image: url(../img/navigation/leisure.jpg); width: 61px; padding-right: 2px;}
		#mainNavigation ul li#entertainment a {background-image: url(../img/navigation/entertainment.jpg); width: 113px; padding-right: 2px;}
		#mainNavigation ul li#Editorial a {background-image: url(../img/navigation/Editorial.jpg); width: 113px; padding-right: 2px;}
		#mainNavigation ul li#entertainment1 a {background-image: url(../img/navigation/Khubornakiri.jpg); width: 113px; padding-right: 2px;}
		#mainNavigation ul li#entertainment2 a {background-image: url(../img/navigation/Sentinel.jpg); width: 113px; padding-right: 2px;}
		#mainNavigation ul li#entertainment3 a {background-image: url(../img/navigation/Flight.jpg); width: 133px; padding-right: 2px;}
		#mainNavigation ul li#entertainment4 a {background-image: url(../img/navigation/Khuborpyrthei.jpg); width: 148px; padding-right: 2px;}
		#mainNavigation ul li#Home a {background-image: url(../img/navigation/auto.jpg); width: 49px; padding-right: 2px;}
		#mainNavigation ul li#life a {background-image: url(../img/navigation/life.jpg); width: 49px; padding-right: 2px;}
		#mainNavigation ul li#tech a {background-image: url(../img/navigation/tech.jpg); width: 44px; padding-right: 2px;}
		#mainNavigation ul li#job a {background-image: url(../img/navigation/job.jpg); width: 37px; padding-right: 2px;}
		#mainNavigation ul li#forum a {background-image: url(../img/navigation/forum.jpg); width: 55px; padding-right: 2px;}
		#mainNavigation ul li#classifieds a {background-image: url(../img/navigation/Sports.jpg); width: 82px; padding-right: 2px;}

		/*
		###############################
		Added on 8 December:
		for Switch back to old version
		###############################
		*/
		
		#mainNavigation ul li#switchBack {float: right !important; margin-right: -160px; margin-left: 60px;}
		#mainNavigation ul li#switchBack a {padding-top: 5px; color: rgb(204,0,0); text-decoration: underline;}
		#mainNavigation ul li#switchBack a:hover {text-decoration: none;}

/*
################
Information Tab
################
*/

#infoTab {
	width: 980px;
	height: 22px;
	margin: 0 auto;
	padding-top: 10px;
	background: rgb(33,60,112);
	overflow: hidden;
	_position: relative;
}

	#infoTab .subCategories {font-size: 12px; color: rgb(255,255,255);}
		.subCategories li {
			display: block;
			border-right: 1px dotted rgb(78,115,187);
			padding: 0 7px;
			float: left;
		}
		
		.subCategories li.noBorder {border-right: 0!important;}
		
		.subCategories li a {color: rgb(255,255,255);}
		.subCategories li a:hover {color: rgb(80,138,182);}
		
		.subCategories li.addBookMark {font-size: 90%;}
		.subCategories li.addBookMark a {color: rgb(58,151,221); text-decoration: underline;}
		.subCategories li.addBookMark a:hover {color: rgb(58,151,221); text-decoration: none;}
		
		p.suggest {font-size: 12px; float: right; padding-right: 10px;}
			p.suggest a {color: #ffffff; text-decoration: underline;}
			p.suggest a:hover {color: rgb(80,138,182); text-decoration: none;}
		
/*
########
Content
########
*/

#content {
	width: 984px;
	margin: 0 auto 5px;
	padding-bottom: 5px;
	background: rgb(255,255,255);
	overflow: hidden;
	_position: relative;
}

	#dailyPost {width: 665px; float: left;}
		
		/*
		################
		today highlight
		################
		*/
		
		#dailyPost #todayHighlight {
			width: 665px;
			height: 350px;
			background: rgb(22,47,95);
			color: rgb(255,255,255);
		}
		
		#todayHighlight li.topHighlight {
			width: 424px;
			height: 350px;
			float: left;
		}
		
		.topHighlight a, .otherHighlight a {color: rgb(255,255,255);}
		.topHighlight a:hover, .otherHighlight a:hover {text-decoration: underline;}
			
			li.topHighlight h2 {
				width: 410px;
				font-size: 24px;
				color: rgb(255,255,255);
				padding: 10px 0 0 10px;
			}
			
				li.topHighlight h2 a {color: rgb(255,255,255); text-decoration: none;}
				li.topHighlight h2 a:hover {color: rgb(255,255,255); text-decoration: underline;}
			
			li.topHighlight p.topHighlightPic {
				width: 415px;
				height: 220px;
				margin-bottom: 5px;
				padding-left: 5px;
			}
			
			li.topHighlight div.topHighlightDetails {width: 420px; height: 80px;}
			
				.topHighlightDetails h3 {
					font-size: 14px;
					color: rgb(255,255,255);
					padding-left: 5px;
					margin-bottom: 5px;
				}
				
				.topHighlightDetails p {font-size: 12px; padding-left: 5px; margin-bottom: 5px;}
				
				.topHighlightDetails p.moreTopStories {
						font-size: 10px;
						text-align: right;
						padding-left: 5px;
						margin-bottom: 0;
					}

					.moreTopStories a {color: rgb(80,138,182);text-decoration: underline;}
					.moreTopStories a:hover {color: rgb(80,138,182); text-decoration: none;}
				
			li.otherHighlight {
				width: 231px;
				height: 81px;
				background: url(../img/bg/bg_otherHighlight.jpg) repeat-x;
				overflow: hidden;
				padding: 2px;
				border-top: 2px solid rgb(22,47,95);
			}
			
			li.otherHighlight:after {content: "."; height: 0; visibility: hidden; display: block; clear: both;}
			
				li.otherHighlight p.otherHighlightPic {width: 63px; height: 82px; float: right;}
				li.otherHighlight h3 {font-size: 11px; color: rgb(255,255,255);}
				li.otherHighlight p {font-size: 11px;}
				
			li.specialHighLight {width: 235px; height: 85px; border-top: 2px solid rgb(22,47,95);}
			
		/*
		###############
		the Local News
		###############
		*/
		
		#dailyPost #localNews {width: 665px; background: rgb(255,255,255); overflow: hidden;}
		
			#localNews .leftColumn {width: 325px; float: left; padding: 10px 0 0 5px;}			
			#localNews .rightColumn {width: 325px; float: right; padding: 10px 5px 0 0;}
			
		
		/*
		###############
		Global Use Box
		###############
		*/
		.gradientBox {
			width: 305px;
			height: 175px;
			padding: 10px;
			background: url(../img/bg/bg_categoriesBox.jpg) no-repeat;
			margin-bottom: 5px;
		}
		.gradientBox6 {
			width: 305px;
			height: 190px;
			padding: 10px;
			background: url(../img/bg/gradient1.jpg) no-repeat;
			margin-bottom: 5px;
		}
		.gradientBox7 {
			width: 305px;
			height: 190px;
			padding: 10px;
			background: url(../img/bg/gradient.jpg) no-repeat;
			margin-bottom: 5px;
		}
		.gradientBox8 {
			width: 275px;
			height: 190px;
			padding: 10px 10px 10px 15px;
			background: url(../img/bg/gradient2.jpg) no-repeat;
			margin-bottom: 5px;
		}
		.gradientBox2 {
			width: 275px;
			height: 185px;
			padding: 15px 10px 10px 15px;
			margin: 0 auto;
			background: url(../img/bg/bg_categoriesBox2.jpg) no-repeat;
		}
		
		.gradientBox3 {
			width: 275px;
			height: 255px;
			padding: 15px 10px 10px 15px;
			background: url(../img/bg/bg_categoriesBox3.jpg) no-repeat;
			position: relative;
		}
		
		.gradientBox4 {
			width: 385px;
			height: 255px;
			padding: 15px 15px 10px;
			background: url(../img/bg/bg_categoriesBox4.jpg) no-repeat;
			position: relative;
			
		}
		
		.gradientBox5 {
			width: 305px;
			height: 120px;
			padding: 10px;
			background: url(../img/bg/bg_categoriesBox5.jpg) no-repeat;
		}
		
		.forumBox {
			width: 325px;
			height: 275px;
			background: url(../img/bg/bg_forumBox1.jpg) no-repeat;
			padding: 15px 15px 10px;
			clear: both;
		}
				
			.gradientBox h2, .gradientBox2 h2, .gradientBox3 h2, .gradientBox4 h2,
			.gradientBox5 h2, .forumBox h2, .innerpageForum h2, #horo_game h2
			{font-size: 14px; color: rgb(30,121,188); margin-bottom: 8px;}
			
			.gradientBox6 h2, .gradientBox7 h2,.gradientBox8 h2
			{font-size: 14px; color:#ffffff; margin-bottom: 8px;}
			
			.gradientBox h2 a, .gradientBox2 h2 a, .gradientBox3 h2 a, .gradientBox4 h2 a,
			.gradientBox5 h2 a, .gradientBox6 h2 a,.forumBox h2 a, .innerpageForum h2 a, #horo_game h2 a
			{color: rgb(30,121,188);}
			
			.gradientBox h2 a:hover, .gradientBox2 h2 a:hover, .gradientBox3 h2 a:hover, .gradientBox4 h2 a:hover,
			.gradientBox5 h2 a:hover, .gradientBox6 h2 a:hover, .forumBox h2 a:hover, .innerpageForum h2 a:hover, #horo_game h2 a:hover
			{color: #FF0000; text-decoration: none;}
			
			.gradientBox2 h3 a, .gradientBox3 h3 a, .gradientBox4 h3 a {color: rgb(103,166,212);}
			
			.forumBox h3 a  {color: rgb(33,60,112);}
			
			.gradientBox2 h3 a:hover, .gradientBox3 h3 a:hover,
			.gradientBox4 h3 a:hover, .forumBox h3 a:hover
			{color: rgb(30,121,188);}
				
			/* Style for highlight section */
			.gradientBox ol li, .gradientBox6 ol li,.gradientBox5 ol li,
			.innerpageForum ol li {height: 115px; margin-bottom: 8px; overflow: hidden;}
			
			.gradientBox ol li p.newspic, .gradientBox5 ol li p.newspic,
			.innerpageForum ol li p.newspic {
				width: 90px;
				height: 60px;
				float: left;
				margin-right: 10px;
			}
			
			.gradientBox ol li h3, .gradientBox6 ol li h3,.gradientBox5 ol li h3,
			.innerpageForum ol li h3 {font-size: 12px; color: rgb(33,60,112); margin-bottom: 5px;}
			
			.gradientBox ol li p, .gradientBox6 ol li p, .gradientBox5 ol li p, .innerpageForum ol li p {font-size: 12px;}			
			.gradientBox ol li h3 a, .gradientBox6 ol li h3 a,.gradientBox5 ol li h3 a, .innerpageForum ol li h3 a {color: rgb(33,60,112);}
			
			.gradientBox ol li h3 a:hover, .gradientBox6 ol li h3 a:hover,.gradientBox5 ol li h3 a:hover,
			.innerpageForum ol li h3 a:hover {color: rgb(33,60,112); text-decoration: underline;}
				
			.gradientBox ol li.smallThumb, .gradientBox6 ol li.smallThumb, .gradientBox5 ol li.smallThumb {
				height: 32px;
				margin-bottom: 5px;
				border-bottom: 1px dotted rgb(72,72,72);
				padding-bottom: 5px;
			}
			
			.gradientBox ol li.smallThumb p.newspic, .gradientBox6 ol li.smallThumb p.newspic, .gradientBox5 ol li.smallThumb p.newspic {
				width: 52px;
				height: 32px;
				float: left;
				margin-right: 10px;
			}
			
			.gradientBox ol li.smallThumb h3, .gradientBox6 ol li.smallThumb h3, .gradientBox5 ol li.smallThumb h3 
			{font-size: 12px; color: rgb(72,72,72); margin-bottom: 5px;}
			
			.gradientBox ol li.smallThumb p, .gradientBox5 ol li.smallThumb p {font-size: 10px;}
			.gradientBox ol li.smallThumb h3 a, .gradientBox5 ol li.smallThumb h3 a {color: rgb(72,72,72);}
			.gradientBox ol li.smallThumb h3 a:hover, .gradientBox5 ol li.smallThumb h3 a:hover
			{color: rgb(72,72,72); text-decoration: underline;}
			
			
			.gradientBox5 form.game {margin-top: 20px;}
			.gradientBox5 form.game label {
				width: 90px; 
				text-align: right;
				margin-right: 10px;
				display: block;
				float: left;
				color: #213C70;
				font-size: 12px;
				font-weight: bold;
			}
			
			.gradientBox5 .holoList li {height: 74px; line-height: 15px;}
			.gradientBox5 .holoList li select {margin-top: 3px;}
			.gradientBox5 .holoList li h2 {margin-bottom: 5px;}
			.gradientBox5 .holoList li .holopic {width: 48px; float: left;}
			.gradientBox5 .holoList li .holopic img {behavior: url(../pngfix/iepngfix.htc);}
			.gradientBox5 .holoList li form label {font-size: 12px;}
			.gradientBox5 .holoList li form label.labelLeft {width: 125px; display: block;float: left;}
			.gradientBox5 .holoList li form label.labelLeft select {width: 120px;}
			
			.gradientBox5 .holoList li.loveMeter {height: 140px;}
			.gradientBox5 .holoList li.loveMeter .holopic {margin-top: 3px;}
			.gradientBox5 .holoList li.loveMeter form {margin: 5px 0 8px; overflow: hidden;}
			.gradientBox5 .holoList li.loveMeter p a {color: #213C70;}
			.gradientBox5 .holoList li.loveMeter p a:hover {text-decoration: underline;}

			
			/* Style for Quick Vote */
			.gradientBox2 h3 {
				font-size: 12px;
				color: rgb(103,166,212);
				margin-bottom: 10px;
				_margin-bottom: 0; /* for M$IE6 */
				/margin-bottom: 0; /* for M$IE7-8 */
			}
			
			.gradientBox2 ul {font-size: 12px;}
			
			.gradientBox2 ul li {
				margin-bottom: 1px;
				_margin-bottom: 0; /* for M$IE6 */
				/margin-bottom: 0; /* for M$IE7-8 */
				/padding-bottom: 1px; /* for M$IE7-8 */
			}
			
			.gradientBox2 #serch-for-bangkokpost ul li{
				padding-bottom:8px;
			}
			
			.gradientBox2 #serch-for-bangkokpost #keyword{
				width:100%;
			}
			
			.gradientBox2 #serch-for-bangkokpost ul li label{
				float:left;
				width:100px;
			}
			
			/* Style for Video */
			.gradientBox2 ul.videoList {font-size: 100%!important;}
			.gradientBox2 ul.videoList li {height: 77px; margin-bottom: 5px;}
			.gradientBox2 ul.videoList li p {font-size: 12px;}
				
				.gradientBox2 ul.videoList li p.videoThumb {
					width: 100px;
					height: 73px;
					padding: 4px 0 0 4px;
					background: url(../img/bg/bg_videoThumbs.png) no-repeat;
					float: left;
					margin-right: 2%;
				}
				
				.gradientBox2 ul.videoList li p.videoThumb {behavior: url(../pngfix/iepngfix.htc);}
				
			/* Quick Vote */
			.gradientBox2 form#quickVote {overflow: hidden;}
			.gradientBox2 form#quickVote:after {content: "."; clear: both; height: 0; display: block; visibility: hidden;} 
				.gradientBox2 form#quickVote p.thumb {
					width: 90px;
					height: 60px;
					float: right;
					padding: 5px 5px 0 0;
				}
				
			/* Style for Mini Forum */
			.gradientBox2 ul.forumList {padding-left: 15px;}
			.gradientBox2 ul.forumList li {
				margin-bottom: 3px;
				list-style: disc outside !important;
				_margin-bottom: 0;
				/margin-bottom: 0;
			}
			
			.gradientBox2 ul.forumList li a {color: rgb(0,0,0); text-decoration: underline;}
			.gradientBox2 ul.forumList li a:hover {color: rgb(0,0,0); text-decoration: none;}
			
			/* Style for Directory */
			.gradientBox3 ul {width: 275px;}				
				.gradientBox3 ul li {
					margin-bottom: 10px;
					_margin-bottom: 0; /* for M$IE6 */
					/margin-bottom: 0; /* for M$IE7-8 */
				}
				
				.gradientBox3 ul li h3 {font-size: 14px; color: rgb(103,166,212);}
				.gradientBox3 ul li p {font-size: 12px;}	
			
			.gradientBox3 p.byBuzz {
				width: 45px;
				height: 47px;
				position: absolute;
				bottom: 0;
				right: 10px;
				background: transparent url(../img/icons/icon-buzz.png) no-repeat;
			}
			
			.gradientBox3 p.byBuzz a {
				width: 45px;
				height: 47px;
				display: block;
			}

			.gradientBox3 p.byBuzz a span {visibility: hidden;}
			
			p.byBuzz {behavior: url(../pngfix/iepngfix.htc);}
			
			/* Style for Blogs */
			.gradientBox4 ul.blogList {width: 385px;}
			.gradientBox4 ul.blogList li {margin-bottom: 8px; _margin-bottom: 0; /* for M$IE6 */}
				
				.gradientBox4 ul.blogList li p.blogThumb {
					width: 90px;
					height: 60px;
					float: right;
					padding: 15PX 0 5px 5px;
				}
				
				.gradientBox4 ul.blogList li h3 {font-size: 14px; color: rgb(103,166,212); margin-bottom: 5px;}
				
				.gradientBox4 ul.blogList li h3 em {
					display: block;
					font-size: 60%;
					font-style: normal;
					color: rgb(151,35,138);
				}
				
				.gradientBox4 ul.blogList li p {font-size: 12px;}
				
			/* Style for Forum */
			.forumBox .hightlightForum {width: 325px; overflow: hidden;}
				.hightlightForum p.forumThumb {
					width: 90px;
					height: 60px;
					float: left;
					padding: 0 10px 15px 0;
				}
				
				.hightlightForum h3 {font-size: 12px; color: rgb(33,60,112); margin-bottom: 5px;}
				.hightlightForum p {font-size: 12px;}
				
				.hightlightForum ul.forumListLeft {width: 190px; float: left; font-size: 12px;}
				.hightlightForum ul.forumListRight {width: 190px; float: right; font-size: 12px;}
				
					ul.forumListLeft li, ul.forumListRight li {
						margin-bottom: 5px;
						padding: 3px 0;
						border-bottom: 1px dotted rgb(72,72,72);
					}
					
					ul.forumListLeft li a, ul.forumListRight li a {color: rgb(33,60,112);}
					ul.forumListLeft li a:hover, ul.forumListRight li a:hover {color: rgb(30,121,188);}
					
			/* Inner Page Forum Box */
			.innerpageForum {
				width: 305px;
				height: 310px;
				padding: 10px;
				background: url(../img/bg/bg_innerPageForum.jpg) no-repeat;
			}
			
				.innerpageForum ol {margin-bottom: 15px;}
				.innerpageForum ul {font-size: 12px; line-height: 140%; padding-left: 15px;}
					.innerpageForum ul li {list-style: disc outside !important;}
				
				.innerpageForum ul a {color: rgb(72,72,72);}
				.innerpageForum ul a:hover {color: rgb(97,97,97);}
				
			/* For Most View */
			.gradientBox2 ul.mostViewList {
				width: 275px;
				height: 135px;
				font-size: 12px;
				color: rgb(72,72,72);
				margin: 0 auto 10px;
				padding: 5px 0;
				border-bottom: 1px dotted rgb(72,72,72);
				border-top: 1px dotted rgb(72,72,72);
			}
			
				ul.mostViewList:after {content: "."; height: 0; display: block; clear: both; visibility: hidden;}
			
				ul.mostViewList li p.interviewThumb {
					float: left;
					width: 90px;
					height: 60px;
					margin-right: 5px;
				}
				
				ul.mostViewList li h3 {font-size: 120%; margin-bottom: 5px;}
				ul.mostViewList li h3 a:hover {text-decoration: underline;}
				ul.mostViewList li p {margin-bottom: 5px;}
				
				ul.mostViewList li a {color: rgb(72,72,72); text-decoration: none;}
				ul.mostViewList li a:hover {color: rgb(72,72,72); text-decoration: underline;}
				
	/*
	###############################
	Today Hightlight Sidebar Phase
	###############################
	*/
	
	.sideBar {width: 300px; float: right; padding: 0 10px 0 0;}
		
		/*
		##############
		Breaking News
		##############
		*/
		
		#breakingNews {
			width: 300px;
			height: 220px;
			margin: 0 auto;
			background: url(../img/bg/bg_breakingNews.jpg) no-repeat;
		}
		
		#breakingNews1 {
			width: 327px;
			height: 220px;
			margin: 0 auto;
			background: url(../img/bg/bg_breakingNews-red.jpg) no-repeat;
		}
			#breakingNews2 {
			width: 327px;
			height: 220px;
			margin: 0 auto;
			background: url(../img/bg/bg_breakingNews-pink.jpg) no-repeat;
		}
			
			#breakingNews h2 {
				font-size: 14px;
				color: rgb(255,255,255);
				padding: 12px 0 0 12px;
				margin-bottom: 10px;
			}
			#breakingNews1 h2 {
				font-size: 14px;
				color: rgb(255,255,255);
				padding: 12px 0 0 12px;
				margin-bottom: 10px;
			}
			#breakingNews2 h2 {
				font-size: 14px;
				color: rgb(255,255,255);
				padding: 12px 0 0 12px;
				margin-bottom: 10px;
			}
			#breakingNews p.rssFeed {
				width: 20px;
				height: 20px;
				font-size: 10px;
				background: url(../img/bg/bg_rss-feed.png) no-repeat;
				_background: url(../img/bg/bg_rss-feed.gif) no-repeat; /* for M$IE6 */
				_display: inline; /* for M$IE6 */
				float: right;
				margin: 8px 8px 0 0;
			}
			
				p.rssFeed a {display: block; width: 20px; height: 20px;}
				p.rssFeed a span {visibility: hidden;}
			
			#breakingNews ul.breakingList {
				width: 275px;
				height: 130px;
				font-size: 12px;
				margin: 0 auto 10px;
				padding: 5px 0;
				border-bottom: 1px dotted rgb(0,0,0);
				border-top: 1px dotted rgb(0,0,0);
				overflow:hidden;
			}
			
			#breakingNews1 ul.breakingList {
				width: 275px;
				height: 130px;
				font-size: 12px;
				margin: 0 auto 10px;
				padding: 5px 0;
				border-bottom: 1px dotted rgb(0,0,0);
				border-top: 1px dotted rgb(0,0,0);
				overflow:hidden;
			}
			#breakingNews2 ul.breakingList {
				width: 275px;
				height: 130px;
				font-size: 12px;
				margin: 0 auto 10px;
				padding: 5px 0;
				border-bottom: 1px dotted rgb(0,0,0);
				border-top: 1px dotted rgb(0,0,0);
				overflow:hidden;
			}
				ul.breakingList li p.interviewThumb {
					float: left;
					width: 90px;
					height: 93px;
					margin-right: 5px;
				}
				
				ul.breakingList li {clear: both; _overflow: hidden;} /* Added on 26 November 2008 */			
				ul.breakingList li:after {content: "."; clear: both; display: block; height: 0; visibility: hidden;} /* Added on 26 November 2008 */
				
					ul.breakingList li span.time {width: 52px; display: block; float: left;} /* Added on 26 November 2008 */
					ul.breakingList li span.content {width: 215px; display: block; float: right;} /* Added on 26 November 2008 */
				
				ul.breakingList li h3 {font-size: 140%; margin-bottom: 5px;}
				ul.breakingList li h3 a:hover {text-decoration: underline;}
				ul.breakingList li p {margin-bottom: 5px;}
				
				ul.breakingList li a {color: rgb(30,121,188); text-decoration: none;}
				ul.breakingList li a:hover {color: rgb(33,60,112); text-decoration: none;}
			
			#breakingNews p.moreBreakingNews { 
					font-size: 12px;
					padding-top: 7px;
					padding-right: 10px;
					text-align: right;
			}
			
			#breakingNews1 p.moreBreakingNews { 
					font-size: 12px;
					padding-top: 7px;
					padding-right: 10px;
					text-align: right;
			}
			#breakingNews2 p.moreBreakingNews { 
					font-size: 12px;
					padding-top: 7px;
					padding-right: 10px;
					text-align: right;
			}
				p.moreBreakingNews a {color: #ffffff; text-decoration: none;}
				p.moreBreakingNews a:hover {color: rgb(154,180,229); text-decoration: underline;}
				
		/*
		##################
		Sidebar's Ads Box
		##################
		*/
		
		.boomboxSize1 {width: 300px; height: 250px; position: relative;}
		
		.expandBBNormal { /* for normal state */
			width: 300px;
			height: 250px;
			position: absolute;
			left: 0;
			top: 0;
			direction: rtl;
			clip: rect(0,300px,250px,0);
			overflow: hidden;
			z-index: 990;
		}
		
		.expandBBExpand { /* for expanded state */
			width: 600px;
			height: 250px;
			position: absolute;
			left: -300px;
			top: 0;
			direction: rtl;
			clip: rect(0,600px,250px,0);
			z-index: 990;		
		}
		
		.boomboxSize2 {
			width: 250px;
			height: 90px;
			padding-top: 10px;
			text-align: center;
			background: url(../img/bg/bg_adsBox2.jpg) no-repeat;
		}
		
/* 
#########################
Today News by Categories
#########################
*/
	
#todayNews {width:984px; clear: both; margin-bottom: 10px;}
	
	#todayNews ul.newsCategories {width: 965px; margin: 0 auto;  overflow: hidden;}
	ul.newsCategories:after {content: "."; clear: both; height: 0; display: block; visibility: hidden;}
		
		
		ul.newsCategories li {
			width: 165px;
			height: 185px;
			background: url(../img/bg/bg_todayNews.jpg) no-repeat;
			float: left;
			padding: 10px 10px 0;
		}
		
		ul.newsCategories li h2 {font-size: 12px; color: rgb(255,255,255);}
		ul.newsCategories li h2 a {color: rgb(255,255,255); text-decoration: none;}
		ul.newsCategories li h2 a:hover {color: rgb(255,255,255); text-decoration: underline;}
		
		ul.newsCategories li h3 {font-size: 11px; color: rgb(30,121,188);}
		ul.newsCategories li h3 a {color: rgb(30,121,188); text-decoration: none;}
		ul.newsCategories li h3 a:hover {color: rgb(30,121,188); text-decoration: underline;}
		
		ul.newsCategories li p {font-size: 11px;}
		
		ul.newsCategories li.varietyGreen, ul.newsCategories li.varietyViolet, 
		ul.newsCategories li.varietyRed, ul.newsCategories li.varietyBlue,
		ul.newsCategories li.varietyGrey, ul.newsCategories li.varietyOrange
		{margin-right: 10px;}
		
		ul.newsCategories li.noMargin {margin-right: 0 !important;}
		
			ul.newsCategories li.varietyGreen h2, ul.newsCategories li.varietyViolet h2,
			ul.newsCategories li.varietyRed h2, ul.newsCategories li.varietyBlue h2,
			ul.newsCategories li.varietyGrey h2, ul.newsCategories li.varietyOrange h2 {
				font-size: 14px;
				font-weight: normal;
				color: rgb(255,255,255);
				padding: 2px 0 2px 5px;
				margin-bottom: 5px;
			}
		
				ul.newsCategories li.varietyGreen h2 {background: rgb(60,132,19);}
				ul.newsCategories li.varietyViolet h2 {background: rgb(274,148,29);}
				ul.newsCategories li.varietyRed h2 {background: rgb(78,64,87);}
				ul.newsCategories li.varietyBlue h2 {background: rgb(171,106,134);}
				ul.newsCategories li.varietyGrey h2 {background: rgb(54,47,45);}
				ul.newsCategories li.varietyOrange h2 {background: rgb(44,92,85);}
				
/*
#################
Post Directories
#################
*/

#postDirectories {width: 725px; float: right;}
	
	.rightColumn {width: 300px; float: right; padding: 0 10px 0 0;}
		.rightColumn form {margin-bottom: 10px;}
		
		.rightColumn .boomboxSize1 {margin-bottom: 10px;}
	
	.leftColumn {width: 415px; float: left; margin-left: -2px;}
	
/*
#################
Today Information
#################
*/

#todayInfo {
	width: 250px;
	height: 287px;
	float: left;
	background: url(../img/bg/bg_todayInfo.jpg) no-repeat;
	margin-left: 8px;
	_display: inline; /* for M$IE6 */
}

	#todayInfo h2 {
		font-size: 14px;
		color: rgb(255,255,255);
		padding: 12px 0 0 12px;
		margin-bottom: 20px;
	}
	
	/*
	#######################
	Today Information Tab
	added on: 26 Dec. 2008
	
	nothing fantasy in IEs
	#######################
	*/
	
	#todayInfo ul#infoNav {
		width: 228px;
		height: 35px;
		margin: 0 auto;
		padding-left: 10px;
		overflow: hidden;
		position: relative;
		z-index: 65;
	}
	
	ul#infoNav:after {content: "."; clear: both; height: 0; display: block; visibility: hidden;}
	
		ul#infoNav li {
			font-size: 12px;
			font-weight: bold;
			float: left;
		}
		
		ul#infoNav li#exchangeRate a {
			width: 95px;
			height: 30px;
			display: block;
			border-top: 1px solid rgb(173,173,173);
			border-left: 1px solid rgb(173,173,173);
			border-right: 1px solid rgb(173,173,173);
			border-bottom: 1px solid rgb(173,173,173);
			text-align: center;
			padding-top: 3px;
			margin-right: 1px;
			-moz-border-radius-topright: 5px;
			-webkit-border-top-right-radius: 5px;
			-moz-border-radius-topleft: 5px;
			-webkit-border-top-left-radius: 5px;
		}
		
		ul#infoNav li#petrolPrice a {
			-moz-border-radius-topleft:5px;
			-moz-border-radius-topright:5px;
			border:1px solid #ADADAD;
			display:block;
			height:25px;
			margin-right:1px;
			padding-top:8px;
			text-align:center;
			width:53px; 
		}
		
		ul#infoNav li#moreInfo a {
			width: 65px;
			height: 30px;
			display: block;
			padding-top: 3px;
			border-top: 1px solid rgb(173,173,173);
			border-left: 1px solid rgb(173,173,173);
			border-right: 1px solid rgb(173,173,173);
			border-bottom: 1px solid rgb(173,173,173);
			text-align: center;
			-moz-border-radius-topright: 5px;
			-webkit-border-top-right-radius: 5px;
			-moz-border-radius-topleft: 5px;
			-webkit-border-top-left-radius: 5px;
		}
		
		ul#infoNav li a {color: rgb(149,149,149);}
		ul#infoNav li a:hover {color: rgb(31,124,193);}
		
		ul#infoNav li#exchangeRate a.active, ul#infoNav li#petrolPrice a.active, ul#infoNav li#moreInfo a.active
		{color: rgb(31,124,193); border-bottom: 1px solid rgb(255,255,255) !important;}
	
	#todayInfo .detailSlot {
		width: 238px;
		margin: -1px auto 0;
		padding-top: 10px;
		border-top: 1px solid rgb(173,173,173);
		position: relative;
		z-index: 60;
	}
	
/*
###########
Footer Ads
###########
*/

#footerAds {
	width: 738px;
	height: 110px;
	margin: 0 auto 10px;
	padding-top: 10px;
	_padding-top: 20px; /* for M$IE6 */
	clear: both;
	position: relative;
}

	#footerAds p.adsby {
		font-size: 14px;
		color: rgb(103,166,212);
		position: absolute;
		top: 7px;
		_top: 2px; /* for M$IE6 */
		right: 5px;
	}
	
	#footerAds p.buzzAds {
		width: 728px;
		height: 90px;
		margin: 15px auto 0;	
	}
	
/*
###############
Information Box
###############
*/

#infoBox {
	width: 964px;
	height: 190px;
	margin: 0 auto;
	padding: 10px;
	background: rgb(243,243,243);
}

	/* All in Post */
	#infoBox .allInPost {
		width: 290px;
		height: 180px;
		float: left;
		background: rgb(179,193,220);
		padding: 5px;
		margin-right: 9px;
	}
	
		.allInPost h2 {font-size: 16px; color: rgb(30,121,188); margin-bottom: 10px;}
		
		.allInPost .leftList {
			width: 145px;
			float: left;
			font-size: 12px;
			line-height: 140%;
			color: rgb(33,60,112);
		}
		
		.allInPost .rightList {
			width: 145px;
			float: right;
			font-size: 12px;
			line-height: 140%;
			color: rgb(33,60,112);
		}
		
		.allInPost a {color: rgb(33,60,112);}
		.allInPost a:hover {color: rgb(30,121,188);}
		
	/* Thailand Info */
	#infoBox .thailandInfo {
		width: 420px;
		height: 180px;
		float: left;
		padding: 5px;
	}
		.thailandInfo h2 {font-size: 16px; color: rgb(30,121,188); margin-bottom: 10px;}
		
		.thailandInfo .leftList {
			width: 205px;
			float: left;
			font-size: 12px;
			line-height: 140%;
			color: rgb(33,60,112);
		}
		
		.thailandInfo .rightList {
			width: 205px;
			float: right;
			font-size: 12px;
			line-height: 140%;
			color: rgb(33,60,112);
		}
		
		.thailandInfo a {color: rgb(65,65,65);}
		.thailandInfo a:hover {color: rgb(30,121,188);}
		
	/* E-Newsletter */
	#infoBox .eNewspaper {
		width: 200px;
		height: 180px;
		float: right;
		padding: 5px 5px 5px 10px;
		border-left: 1px solid rgb(170,170,170);
	}
	
		.eNewspaper h2 {font-size: 16px; color: rgb(30,121,188); margin-bottom: 10px;}
		.eNewspaper p.eNewspaperThumb {width: 190px; margin: 0 auto;}
		
	.eNewspaper h2 a, .thailandInfo h2 a, .allInPost h2 a {color: rgb(30,121,188); text-decoration: none;}
	.eNewspaper h2 a:hover, .thailandInfo h2 a:hover, .allInPost h2 a:hover {color: rgb(30,121,188); text-decoration: underline;}

/*
###############
Information Box
###############
*/

#horo_game {
	width: 984px;
	clear: both;
	font-size: 12px;
	overflow: hidden;
	_display: inline;
}

#horo_game p {margin-bottom: 8px;}
#horo_game h3 {margin-bottom: 8px;}

#horo_game p.more {text-align: right; position: absolute; right: 10px; bottom: 10px;}
#horo_game p.more a {color: rgb(41,41,41); font-weight: bold;}
	
	#horo_game #what_new {
		width: 227px;
		height: 259px;
		float: left;
		padding: 10px;
		margin: 10px 5px 10px 10px;
		background: url(../img/bg/bg_what-new.jpg);
		position: relative;
		_margin: 10px 5px 10px 5px;
	}
	
	#horo_game #what_new h3 {font-size: 12px; color: rgb(0,0,0);}
	
	
	
	#horo_game #what_new ul li a {color: rgb(33,60,112); font-weight: bold; margin-top: 10px;}
	#horo_game #what_new ul li a:hover {color: #ff0000; text-decoration: underline;}
	
	#horo_game #game {
		width: 392px;
		height: 259px;
		float: left;
		padding: 10px;
		margin: 10px 0;
		background: url(../img/bg/bg_game.jpg);
	}
	
	#horo_game #game ul li {width: 392px; float: left; clear: both;}
	#horo_game #game ul li .thumbnail {float: left; margin-right: 10px;}
	#horo_game #game ul li h3 {font-size: 14px; margin: 0;}
	#horo_game #game ul li h3 a {color: rgb(33,60,112);}
	#horo_game #game ul li h3 a:hover {text-decoration: underline;}
	#horo_game #game ul li p a {font-weight: bold; text-decoration: underline; color: rgb(33,60,112);}
	#horo_game #game ul li p a:hover {text-decoration: none;}
	
	#horo_game #game form label {
		display: block; 
		width: 90px; 
		float: left; 
		text-align: right; 
		margin-right: 10px;
		color: rgb(33,60,112);
		font-weight: bold;
	}
	
	#horo_game #horoscope {
		width: 276px;
		height: 259px;
		float: right;
		margin: 10px 10px 10px 0;
		padding: 10px;
		background: url(../img/bg/bg_horoscope.jpg);
		position: relative;
		_margin: 10px 5px 10px 0;
	}
	
	#horo_game #horoscope h3 {color: rgb(33,60,112); font-size: 14px;}
	
		#horo_game #horoscope form {
			width: 211px; 
			height: 60px; 
			padding: 5px 0 0 65px; 
			background: url(../img/bg/bg_horoscope-form.png) no-repeat;
			behavior: url(../pngfix/iepngfix.htc);
		}
		
		#horo_game #horoscope form label {display: block; margin-bottom: 8px;}
	
/*
##############
Footer Section
##############
*/

#footer {width: 964px; margin: 0 auto; padding: 30px 10px; font-size: 12px; color: rgb(255,255,255);}
#footer a {color: rgb(255,255,255);}
#footer a:hover {color: rgb(255,255,255); text-decoration: underline;}

/*		
####################################################
Sub Chanel Page Style Sheets added on 12 Sept. 2008
####################################################
*/

/* Sub Chanel Review Categories */
#subChanelReview {width: 665px; float: left;}
	.levelNavigaton {
		font-size: 14px;
		font-weight: bold;
		padding: 10px 0 0 10px;
		color: rgb(30,121,188);
	}
	
	#subChanelReview .horoScopeContent {padding: 20px 0 10px;}
	
	.levelNavigaton a {text-decoration: underline; color: rgb(30,121,188);}
	.levelNavigaton a:hover {text-decoration: none; color: rgb(30,121,188);}
	
	/* Repeat Gradient Box */
	.innerRepeatBox {width: 665px; margin: 4px 0 5px;}
	
		.innerRepeatBox .topCorner {
			width: 665px;
			height: 40px;
			background: transparent url(../img/bg/bg_topCorner.jpg) no-repeat;
		}
		
		.innerRepeatBox .bottomCorner {
			width: 665px;
			height: 32px;
			background: transparent url(../img/bg/bg_bottomCorner.jpg) no-repeat;
		}
		
		.innerRepeatBox .subChanelDetail {
			width: 615px;
			margin: -20px auto 0;
			padding: 0 15px;
			border-left: 1px solid rgb(178,178,178);
			border-right: 1px solid rgb(178,178,178);
			overflow: hidden;
		}
		
			.subChanelDetail h2 {font-size: 16px; color: rgb(30,121,188); margin-bottom: 10px;}
			.subChanelDetail .latestList {width: 615px; overflow: hidden;}
			.subChanelDetail form {font-size: 12px; padding-top: 2px; float: right;}
				
				.latestList li {
					font-size: 12px;
					margin-bottom: 10px;
					padding-bottom: 10px;
					border-bottom: 1px dotted rgb(178,178,178);
					overflow: hidden;
					line-height: 140%;
					_height: 60px; /* for M$IE6 */
				}
				
				.latestList li:after {content: "."; clear: both; height: 0; visibility: hidden; display: block;}
				
				.latestList h3 a {text-decoration: none; color: rgb(30,121,188);}
				.latestList h3 a:hover {text-decoration: underline; color: rgb(30,121,188);}
				.latestList h3 em {font-size: 80%; display: block; font-style: normal; /*color: rgb(180,180,180);*/}
				#searchWrapper h3 em {font-size: 80%; display: block; font-style: normal; color: gray;}
								
				
				.latestList p.updatedThumb {
					width: 90px;
					height: 60px;
					margin-right: 10px;
					float: left;
				}
				
				.latestList p span.date {color: rgb(94,94,94);}
				
				.latestList div.pollResult {
					width: 60px;
					height: 50px;
					margin-right: 10px;
					background: url(../img/bg/bg_pollResult.gif) no-repeat;
					float: left;
					text-align: center;
					padding-top: 10px;
				}
				
					div.pollResult p.votedCount {font-size: 14px; margin-bottom: 10px;}
					div.pollResult p.votedPercent {font-size: 32px; color: rgb(157,10,14);}
				
				.latestList li p a {color: rgb(0,0,0); text-decoration: underline;}
				.latestList li p a:hover {color: rgb(0,0,0); text-decoration: none;}
				
			.subChanelDetail .pageNavigation {font-size: 12px; text-align: center; word-spacing: 5px;}
				.pageNavigation a {text-decoration: underline; color: rgb(30,121,188);}
				.pageNavigation a:hover {text-decoration: none; color: rgb(30,121,188);}
				
/*
###########################################
Article Controlling added on 17 Sept. 2008
###########################################
*/

#articleWrapper {width: 665px; float: left; line-height: 110%;}
	#articleWrapper .entry {padding: 10px; overflow: hidden;}
	#articleWrapper .entry:after {content: "."; height: 0; display: block; clear: both; visibility: hidden;}
	
		.entry h2 {
			font-size: 24px;
			margin-bottom: 10px;
			color: rgb(30,121,188);
			line-height: 110%;
		}
		
		/* added on 4 December 2008 */
		.entry h3 {
			font-size: 18px;
			margin-bottom: 10px;
			color: rgb(54,54,54);
			line-height: 110%;
		}
		
		/* added on 17 December 2008 */
		.entry .articleLabel {font-style: italic; font-weight: bold;}
		
		/* 
		#################################
		Added on 24 November 2008 
		for: CMS (photo in article page)
		#################################
		*/
		
		.articlePhotoRight {
			width: 260px;
			float: right;
			margin: 0 10px 10px 5px;
			padding: 10px 10px 0px 10px;
			background: rgb(251,251,251);
			border: rgb(204,204,204) 1px solid;
			overflow: hidden;
		}
		
		.articlePhotoLeft {
			width: 260px;
			float: left; 
			margin: 0 10px 10px 0;
			padding: 10px 10px 0px 10px;
			background: rgb(251,251,251);
			border: rgb(204,204,204) 1px solid;
			overflow: hidden;
		}
		
		.articlePhotoCenter {
			margin: 0 auto 10px;
			padding: 10px 10px 0px 10px;
			background: rgb(251,251,251);
			border: rgb(204,204,204) 1px solid;
			overflow: hidden;
		}
		
		.articlePhotoRight p, .articlePhotoLeft p, .articlePhotoCenter p {
			font-family: Arial, Helvetica, sans-serif;
			font-size: 11px !important;
			color: rgb(153,153,153);
			font-size: 8px;
		}
		
		.articlePhotoRight img, .articlePhotoLeft img, .articlePhotoCenter img {display: block; margin: 0 auto 10px;}
 		
		.entry p {font-size: 12px; margin-bottom: 15px; color: rgb(54,54,54);}
		.entry a {color: rgb(54,54,54); text-decoration: underline;}
		.entry a:hover {color: rgb(54,54,54); text-decoration: none;}
		
		/*	add on 17 April 2009:
			From @errorlloyd requirements
			
			1.) added relate search under the article page
			2.) added latest story under the article page
			........................................................ */
			
			.entry .latestStory {width: 300px; float: left;}
			.entry .latestStory ul {font-size: 12px; padding-left: 15px;}
			.entry .latestStory li {list-style: disc;}
		

		.entry .columnistProfile {
			width: 290px;
			float: left;
			font-size: 12px; /* updated: 4 - 10 - 2008 */
			color: rgb(120,120,120);
			line-height: 130%;
			margin-bottom: 10px;
			overflow: hidden;
		}
		
		.entry .columnistProfile:after {content: "."; height: 0; display: block; clear: both; visibility: hidden;}
			
			.columnistProfile dt {
				float: left;
				width: 45px;
				height: 45px;
				margin: 0 5px 5px 0;
				_position: relative; /* for M$IE6 */
			}
			
			.columnistProfile dt img {border: none; _position: absolute; /* for M$IE6 */ _top: 0; /* for M$IE6 */}
			
			.columnistProfile a {color: rgb(120,120,120); text-decoration: underline;}
			.columnistProfile a:hover {color: rgb(120,120,120); text-decoration: none;}
			
		.entry .googleAds {
			width: 300px;
			height: 250px;
			float: right;
			margin-bottom: 5px;
		}
		
		.entry .article-features {
			width: 100%;
			padding: 10px 0;
			clear: both;
			_overflow: hidden;
		}
		
		.entry .article-features:after {content: "."; height: 0; display: block; clear: both; visibility: hidden;}
		
		/*	SNS Feature
			added on 25 September 2009
			......................................... */
			
			.entry #heading-panel {width: 100%;	_overflow: hidden;}
			.entry #heading-panel:after {content: "."; height: 0; display: block; clear: both; visibility: hidden;}
			
				.entry #heading-panel #headergroup {width: 510px; float: left;}
				
				.entry #heading-panel #main-sns {
					width: 108px;
					padding: 10px;
					float: right;
					border: 1px solid rgb(223,223,223);
					_overflow: hidden;
				}
				
				.entry #heading-panel #main-sns:after {content: "."; height: 0; clear: both; visibility: hidden;}
		
					#main-sns .tweetmeme_button {
						width: 50px;
						height: 61px;
						padding-top: 3px;
						float: left;
						_display: inline; /* for M$IE6 */
					}
					
					#main-sns .facebook-share {
						width: 50px;
						height: 61px;
						padding-top: 3px;
						float: right;
						_display: inline; /* for M$IE6 */					
					} 
	#heading-panel ul {font-size: 12px; color: rgb(94,94,94); margin-bottom: 10px;}				
	/* Social Bookmarking Panel */
	.socialBookmark {
		width: 330px;
		font-size: 12px;
		float: right;
		padding: 10px;
		border: 1px solid rgb(233,233,233);
	}
	
	.socialBookmark:after {content: "."; height: 0; display: block; clear: both; visibility: hidden;}
		
		#socialLink li {
			height: 16px;
			display: block;
			float: left;
			padding-left: 20px;
			margin: 0 10px 10px 0;
		}
		
		#socialLink li a {color: rgb(54,54,54); text-decoration: underline;}
		#socialLink li a:hover {color: rgb(54,54,54); text-decoration: none;}
		
		#socialLink li#deliciouslink {background: url(../img/snsicon/delicious.gif) no-repeat;}		
		#socialLink li#digglink {background: url(../img/snsicon/digg.gif) no-repeat;}		
		#socialLink li#magnolialink {background: url(../img/snsicon/magnolia.gif) no-repeat;}
		#socialLink li#redditlink {background: url(../img/snsicon/reddit.gif) no-repeat;}			
		#socialLink li#stumblelink {background: url(../img/snsicon/stumbleupon.gif) no-repeat;}
		#socialLink li#technoratilink {background: url(../img/snsicon/technorati.gif) no-repeat;}
		#socialLink li#twitter {background: url(../img/snsicon/twitter.gif) no-repeat;}
		#socialLink li#printThis {background: url(../img/snsicon/printthis.gif) no-repeat;}
		#socialLink li#mailtof {background: url(../img/snsicon/emailthis.gif) no-repeat;}
		#socialLink li#reprint {background: url(../img/snsicon/reprint.gif) no-repeat;}
/*
#############################################
Comment Panel Control added on 18 Sept. 2008
#############################################
*/

#commentWrapper {width: 965px; margin: 0 auto 10px; clear: both; padding-top: 10px;}
	
	#commentWrapper h2 {
		width: 955px;
		height: 20px;
		font-size: 16px;
		color: rgb(255,255,255);
		padding: 5px 0 0 10px;
		margin-bottom: 10px;
		background: url(../img/bg/bg_articleHeading.jpg) no-repeat;
	}
	
	#commentWrapper h3 {
		width: 945px;
		margin-left: 35px;
		font-size: 11px;
		margin-bottom: 10px;
		font-weight: bold;
	}
	
	#commentWrapper .commentList {width: 945px; margin: 0 auto;}
		.commentList li {width: 945px; margin-bottom: 10px; overflow: hidden;}
		.commentList li:after {content: "."; display: block; clear: both; visibility: hidden; height: 0;}
		
			.commentList li p.avartarBox {
				width: 65px;
				font-size: 14px;
				text-align: center;
				color: rgb(177,177,177);
				float: left;
				margin-right: 5px;
			}
			
			.commentList li p.avartarBox span {display: block;}
			.commentList li p.avartarBox img {border: 1px solid rgb(114,114,114);}
			
			.commentList .userComment {
				width: 858px;
				background: url(../img/bg/bg_userComment.gif) repeat-y;
				float: right;
			}
				.userComment .upperCorner {
					width: 858px;
					height: 60px;
					background: url(../img/bg/bg_userComment-upperCorner.gif) no-repeat;
				}
				
				.userComment p {width: 800px; font-size: 12px; margin: 0 auto 5px;}
				.userComment p.discussionInfo {font-weight: bold; margin-top: -45px; margin-bottom: 10px;}
				
				.userComment .bottomCorner {
					width: 858px;
					height: 14px;
					background: url(../img/bg/bg_userComment-bottomCorner.gif) no-repeat;
				}
				
	#commentPost p.replyArticle {
		width: 55px;
		height: 25px;
		background: url(../img/bg/bg_replyArticle.jpg) no-repeat;
		margin-left: 15px;
	}
	
		p.replyArticle span {visibility: hidden;}
	
	#commentPost #postPanelWrapper {
		width: 945px;
		color: rgb(54,54,54);
		margin: 0 auto 10px;
		padding: 10px 10px 15px;
		border-top: 10px solid rgb(177,177,177);
		border-left: 1px solid rgb(177,177,177);
		border-right: 1px solid rgb(177,177,177);
		border-bottom: 1px solid rgb(177,177,177);
		clear: both;
	}
	
	#postPanelWrapper a {color: rgb(54,54,54); text-decoration: underline;}
	#postPanelWrapper a:hover {color: rgb(54,54,54); text-decoration: none;}
	
		#postPanelWrapper ul {width: 560px; font-size: 12px;}
			#postPanelWrapper ul li {margin-bottom: 10px;}
				#postPanelWrapper ul li label {display: block; margin-bottom: 5px;}
				#postPanelWrapper ul li .textfield {width: 420px; height: 30px;}
				#postPanelWrapper ul li textarea {width: 420px;}
				
				#postPanelWrapper ul li ul {height: 63px; padding-bottom: 5px; overflow: hidden;}
				#postPanelWrapper ul li ul:after {content: "."; display: block; clear: both; visibility: hidden; height: 0;} 
				
				#postPanelWrapper ul li ul li {
					height: 63px;
					display: block;
					float: left;
					margin-right: 10px;
				}
				
				#postPanelWrapper .article-toolsbar {text-align: right;}

	#commentWrapper p.pageNavigation {font-size: 12px; text-align: center;}
		#commentWrapper p.pageNavigation a {padding-right: 5px;}
				
/*
################################
Bangkok Post: Inner Page Layout
Start on: 14 Oct. 2008
################################
*/

body.shortHeader #header {height: 91px;}
body.shortHeader #infoTab {
	width: 984px;
	height: 25px;
	background: rgb(235,235,235);
	border-top: 1px solid rgb(214,214,214);
	border-bottom: 1px solid rgb(214,214,214);
}
			
	#infoTab ul.searchFunction {
		font-size: 12px;
		float: right;
		padding-right: 10px;
		overflow: hidden;
	}
		
		ul.searchFunction li {
			display: block;
			padding: 0 7px;
			float: left;
			vertical-align: baseline;
		}
		
		ul.searchFunction li a {color: rgb(19,52,79); text-decoration: underline;}
		ul.searchFunction li a:hover {color: rgb(19,52,79); text-decoration: none;}
		
	#infoTab form.searchPanel {font-size: 12px; float: left; color: rgb(19,52,79);}
		form.searchPanel ul {overflow: hidden;}
		
		form.searchPanel ul li {
			display: block;
			padding: 0 7px;
			float: left;
			vertical-align: middle !important;
		}
		
		form.searchPanel ul li a {color: rgb(19,52,79); text-decoration: underline;}
		form.searchPanel ul li a:hover {color: rgb(19,52,79); text-decoration: none;}
		
	#searchWrapper {
		width: 944px;
		margin: 0 auto;
		padding: 10px 20px;
		background: rgb(255,255,255);	
	}
		#searchWrapper h2 {
			font-size: 16px;
			color: rgb(19,52,79);
			margin-bottom: 10px;
			border-bottom: 1px rgb(221,221,221) solid;
		}
		
		#searchWrapper h2 em {font-style: normal; color: rgb(237,28,36);}
		
		#searchWrapper ol {
			font-size: 12px;
			color: rgb(51,51,51);
			padding-left: 5px;
			margin-bottom: 24px;
		}
		
		#searchWrapper ol li {
			overflow: hidden;
			padding: 5px 5px 15px;
			border-bottom: 1px dashed rgb(221,221,221);
		}
		
		#searchWrapper ol li:hover {background: rgb(235,235,235);}
		#searchWrapper ol li:after {content: "."; height: 0; clear: both; display: block; visibility: hidden;}
		
		#searchWrapper ol li p.typeDate {margin-bottom: 10px;}
			#searchWrapper ol li p.typeDate span {color: rgb(35,66,91); font-weight: bold;}
				#searchWrapper ol li p.typeDate span a {color: rgb(35,66,91); text-decoration: underline;}
				#searchWrapper ol li p.typeDate span a:hover {color: rgb(35,66,91); text-decoration: none;}
			
			#searchWrapper ol li h3 {color: rgb(35,66,91);}
				#searchWrapper ol li h3 a {color: rgb(35,66,91); text-decoration: underline;}
				#searchWrapper ol li h3 a:hover {color: rgb(35,66,91); text-decoration: none;}
			
			#searchWrapper ol li p.resultThumb {
				width: 90px;
				height: 60px;
				float: left;
				margin-right: 10px;
			}
			
			#searchWrapper p.intro {font-size: 12px; padding-bottom:7px;}
			
		#searchWrapper p.searchPageNavigation {font-size: 12px; position: relative;}
			
			p.searchPageNavigation span {
				display: block;
				position: absolute;
				top: 0;
				right: 0;
				_right: 18px; /* for M$IE6 */
			}
			
			p.searchPageNavigation a {color: rgb(35,66,91); text-decoration: underline;}
			p.searchPageNavigation a:hover {color: rgb(237,28,36); text-decoration: none;}
			
			p.searchPageNavigation span a {color: rgb(237,28,36); text-decoration: underline;}
			p.searchPageNavigation span a:hover {color: rgb(35,66,91); text-decoration: none;}
							
		#searchWrapper ol.advanceSearchPanel {width: 930px;} 
			ol.advanceSearchPanel li {
				width: 870px; 
				border-bottom: 0 !important; 
				margin-left: 50px; 
				padding-bottom: 5px !important;
			}
			ol.advanceSearchPanel li:hover {background: transparent !important;}
			
			ol.advanceSearchPanel li label {width: 180px; float: left;}
			ol.advanceSearchPanel li p {width: 660px; float: right; margin-bottom: 15px;}
			ol.advanceSearchPanel li p input, ol.advanceSearchPanel li p select {float: left; margin-right: 5px;}

			ol.advanceSearchPanel li p span {display: block;}
			ol.advanceSearchPanel li p img {float: left; margin-right: 10px;}
			
			ol.advanceSearchPanel li label.radiofield {width: auto; margin-right: 10px;}
			ol.advanceSearchPanel li label.radiofield input {margin-right: 5px;}
			
			ol.advanceSearchPanel li .form-message {margin-top: 5px; margin-left: 5px; float: left;}
			ol.advanceSearchPanel li .form-message label {margin: 0; background: url(../img/icons/status-message.gif) no-repeat; padding: 0 0 0 20px;}

				.form-message label.error {color: #f00; background-position: 0 100% !important;}
				.form-message label.success {color: #0060bf; background-position: 0 0 !important;}
			
			ol.advanceSearchPanel li #passwordStrength {
				height: 30px; 
				margin-top: -10px; 
				font-size: 10px; 
				color: #666;
				background: url(../img/bg/strength-level.gif) no-repeat;
			}
				#passwordStrength span {display: inline; color: #000;}
				.strength0 {background-position: 0 16px !important;}
				.strength1 {background-position: 0 -14px !important;}
				.strength2 {background-position: 0 -44px !important;}
				.strength3 {background-position: 0 -74px !important;}

				ol.advanceSearchPanel li span a {color: rgb(237,28,36); text-decoration: underline;}
				ol.advanceSearchPanel li span a:hover {color: rgb(35,66,91); text-decoration: none;}

				
body.shortHeader #mainNavigation {
	width: 960px;
	height: 26px;
	position: absolute;
	left: 10px;
	top: 85px;
	z-index: 0;
}
				
/*
#########################
Poll Page Style Sheets
Start Date: 27 Oct. 2008
#########################
*/

.subChanelDetail #main-sns {width: 50px; float: left; _overflow: hidden;}
	.subChanelDetail #main-sns .tweetmeme_button, 
	.subChanelDetail #main-sns .facebook-share {
		padding: 0; margin-bottom: 10px;
	}
					
.subChanelDetail .subChanelDetail-poll {width: 550px; float: right;}

.pollDetails {width: 100%; font-size: 12px; margin-bottom: 10px; overflow: hidden;}
.pollDetails:after {content: "."; clear: both; height: 0; visibility: hidden; display: block;} /* for modern browser */

	.pollDetails .pollThumb, .latestList .pollThumb {width: 150px; height: 65px; float: left; margin: 0 1% 1% 0;}
	.pollDetails .voteButton {width: 60px; height: 60px; float: right; margin: 0 0 1% 1%;}
	
	.pollInformation {width: 130px; background: rgb(225,231,238); padding: 0 10px 10px; font-size: 12px; float: left;}
		.pollInformation li {padding: 10px 0; border-bottom: 1px solid rgb(172,172,172);}
		.pollInformation li strong {display: block;}
		
#subChanelReview .googleAds {padding-left: 10px !important;}

/*
##############################
Pollview  Page Style Sheets
Start Date: 28 Oct. 2008

Credit to: Mc_Cathie (thaicss)
##############################
*/

#pollView, #pollVote {float: left; width: 370px; list-style: none; font-size: 12px; margin-left: 25px;}
  	#pollView li, #pollVote li {width: 370px; float: left; clear: both; border-bottom: 1px solid rgb(224,229,234);}
  	#pollView li em {display: block; float: left; font-style: normal; margin-bottom: 5px;}
  	#pollView li span {display: block; float: left; clear: both; height: 10px;}
  	#pollView li strong {float: right; font-weight: normal; margin-right: 10px;}
  
  	#pollVote li { padding: 5px 0;}
	#pollVote li label {float: left; line-height: 28px;}
  	#pollVote li label input {margin: 0 5px 0 0; float: left;}
  	#pollVote li.voteButton {border: none; font-weight: bold; padding-left: 15px; color: rgb(119,137,155);}
	#pollVote li.voteButton input { margin-right: 5px;}
  	#pollVote li a {text-decoration: none; color: rgb(119,137,155);}
  	#pollVote li a:hover {text-decoration: underline; color: rgb(119,137,155);}
  
  	.orange {background: rgb(255,153,0);}
  	.green {background: rgb(0,153,0);}
  	.blue {background: rgb(0,0,153);}
  	.red {background: rgb(255,0,0);}
  	.pink {background: rgb(255,51,204);}
	
  	.pollLate0 {width: 1px;}
  	.pollLate1 {width: 3px;}
  	.pollLate3 {width: 9px;}
  	.pollLate4 {width: 12px;}
  	.pollLate23 {width: 69px;}
  	.pollLate70 {width: 210px;}

  
/*
############################
styles for Floating Ads
create on: 11 November 2008
############################
*/

.showFloatingAds {width: 1000px; height: 500px; position: absolute; top: 200px; left: 50%; margin-left: -500px; z-index: 9999;}
.hideFloatingAds {width: 0; height: 0; visibility: hidden; overflow: hidden;}

/*
###########################
Company Info.
added on: 20 November 2008
###########################
*/

#companyInfo {
	width: 944px;
	margin: 0 auto;
	padding: 10px 20px;
	background: rgb(255,255,255);
	line-height: 110%;
}

#companyInfo dl {width: 900px; padding-top: 10px; margin: 0 auto;}

#companyInfo dl h2 {font-size: 24px; margin-bottom: 10px; color: rgb(35,66,91);}
#companyInfo dl dd {margin-bottom: 10px;}

#companyInfo dl dd h3 {font-size: 14px; color: rgb(35,66,91);}
#companyInfo dl dd p, #companyInfo dl dd ul {font-size: 12px; color: rgb(96,96,96); margin-bottom: 5px;}

#companyInfo dl dd p strong, #companyInfo dl dd ul strong {color: rgb(35,66,91);}
#companyInfo dl dd p a {color: rgb(56,56,56); text-decoration: none;}
#companyInfo dl dd p a:hover {color: rgb(96,96,96); text-decoration: none;}

#companyInfo dl.faqDL dd {
	padding: 10px 5px;
	border-bottom: 1px dotted rgb(172,172,172);
	margin-top: -10px;
}
	
	dl.faqDL dd:hover {background: rgb(235,235,235);} /* there's no fantasy in IE6 */
	dl.faqDL dd p.faqQuestion {font-size: 95% !important; color: rgb(35,66,91) !important; margin-bottom: 10px !important;}


/*
###########################
Channel's block, by Mod 
added on: 24 November 2008
###########################
*/
.blog_section{float:left;display:block;width:326px;left:10px;margin-left:4px;margin-top:2px;}
.err{font-size: 11px; color: #FF0000;}
.err a:hover {color: #213C70; text-decoration: none;}



/*
###########################
sent mail, by Mod 
added on: 30 December 2008
###########################
*/
#mailWrapper {
	width: 944px;
	margin: 0 auto;
	padding: 10px 20px;
	background: rgb(255,255,255);	
}

#mailWrapper .fromSentMail p{padding:1px 5px 15px;}
#mailWrapper .fromSentMail p label{display:block;	width:100px; float:left;font-size:12px;color:#363636;}
#mailWrapper .fromSentMail p span{font-size:12px;}
#mailWrapper .fromSentMail input[type=text]{ width:350px;}
.clear_both{clear:both;}

/*	added on 17 April 2009
	by @errorlloyd requirements
	.............................................................. */
	
	.mostViewTopics {
		width: 964px;
		height: 17px;
		padding: 8px 10px 5px;
		background: rgb(19,36,69);
		margin: 0 auto;
	}
	
	.mostViewTopics h3 {
		display: block;
		float: left;
		font-size: 12px;
		color: rgb(255,255,255);
		margin-right: 15px;
	}
	
	.mostViewTopics ul {font-size: 12px; color: rgb(255,255,255);}
	.mostViewTopics ul li {display: block; float: left; margin-right: 10px;}
	.mostViewTopics ul li a {color: rgb(255,255,255); text-decoration: underline;}
	.mostViewTopics ul li a:hover {color: rgb(255,255,255); text-decoration: none;}

   .more1{font-size: 11px; color: #ff0000; text-decoration: none;}
   .more1 a:hover {color: #213C70; text-decoration: none;}

/*
code ads on 22 April 2009
by @marketing
*/	
#hoteltravel{width:96px;height:82px;border:1px solid #ff9600;font:10px Arial,Verdana,Helvetica,sans-serif;list-style:none;background:#fff;}
#hoteltravel ul{padding:0px;margin:0px;list-style:none;}
#hoteltravel li{text-indent:5px;}
#hoteltravel a:link, #hoteltravel a:visited, #hoteltravel a:active{color:#0072b3;text-decoration:none;display:block;width:100%;cursor:hand;}
#hoteltravel a:hover{background-color:#f8f8f8;color:#ff9600;}