@charset "utf-8";

/*
##########################################
Style Sheets for Bangkok Post

First Draft Start at: 18 August 2008
copyright: Post Publishing PCL. since 2008

author: radiz
##########################################
*/

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;
	vertical-align: baseline;

}

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

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-size: 16px; /* for M$IE6 */
	color: rgb(0,0,0);
	background: rgb(33,60,112) url(../img/bg/bg_container.gif);
	padding-bottom: 20px;
}
	
/*
##################
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(common/pngfix/iepngfix.htc);}

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


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

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

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

	#bkkPostTab #memberAssistance {
		width: 300px;
		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);}
		#memberAssistance li.login {background: url(/common/img/member/ico_login.gif) no-repeat 3px top; border-right: 1px solid rgb(197,197,197);}
		#memberAssistance li.login a {padding-left: 13px;}
		#memberAssistance li a.bluelink {color: rgb(30,121,188);}
		#memberAssistance li.signup {border-right: none;}
		
		
		.expandBBExpand * {margin: 0!important;}
	
	#bkkPostTab #globalAssistance {width: 640px; 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(common/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 {
background:url(/common/img/bg/bg_header.gif) no-repeat scroll 0 0 #FFFFFF;
height:195px;
margin:-4px auto 0;
padding:20px 20px 0;
position:relative;
width:960px;
z-index: 99;
}

.headermsg {
	background: rgb(255,255,255) url(/common/img/bg/bg_header_msg.gif) no-repeat!important;
	height: 237px!important;

}

	#header h1.mainTitle {font-size: 0; height: 0; visibility: hidden;}
	
	#header ul.headerAd {width: 960px; padding-bottom: 10px; overflow: hidden; clear: both;}
		ul.headerAd li.mini1stBanner, ul.headerAd li.mini2ndBanner {
			width: 109px;
			height: 94px;
			background: transparent url(../img/bg/bg_miniHeaderAd.gif) no-repeat;
			padding: 3px;
		}
			
			ul.headerAd li.mini1stBanner {float: left; margin-right: 1px;}
			ul.headerAd li.mini2ndBanner {float: right; margin-right: -5px;}
				
			ul.headerAd li.leaderAd {
				width: 728px;
				height: 90px;
				position: relative;				
				z-index: 999 !important;
				float: left;
				margin: 2px 0 0 0;
				
			}
			
			ul.headerAd .alignCenter {text-align: center;}
			
	#header p.homepage {
		width: 468px;
		height: 51px;
		font-size: 0.75em;
		float: left;
	}
	
	#header #topPageSearch {
		width: 305px;
		height: 27px;
		font-size: 0.75em;
		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 {
height:26px;
left:9px;
position:absolute;
top:189px;
width:982px;
z-index:0;
}

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


	#mainNavigation ul li {float: left; font-size: 0.75em; position: relative;}
		#mainNavigation li em.enhance {position: absolute; top: -11px; width: 45px; left: 50%; margin-left: -25px; }
		#mainNavigation li em.new {position: absolute; top: -11px; width: 23px; left: 50%; margin-left: -11px; }
	
	#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#auto 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/classifieds.jpg); width: 82px;}
	

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

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

	#infoTab .subCategories {font-size: 0.75em; 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(80,138,182); text-decoration: underline;}
		.subCategories li.addBookMark a:hover {color: rgb(80,138,182); text-decoration: none;}
		
		p.suggest {font-size: 0.75em; float: right; padding-right: 10px;}
			p.suggest a {color: rgb(80,138,182); text-decoration: underline;}
			p.suggest a:hover {color: rgb(80,138,182); text-decoration: none;}
		
/*
########
Content
########
*/

#content {width: 964px; margin: 0 auto 0.3125em; padding-bottom: 5px; padding-left: 10px; padding-right: 10px; background: rgb(255,255,255); overflow: hidden;}

	#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;
			position: relative;
		}
		
		.topHighlight a, .otherHighlight a {color: rgb(255,255,255);}
		.topHighlight a:hover, .otherHighlight a:hover {text-decoration: underline;}
			
			li.topHighlight h2 {
				width: 410px;
				height: 45px;
				font-size: 1.5em;
				color: rgb(255,255,255);
				background: url(../img/bg/bg_h2TodayHL.png);
				padding: 10px 0 0 10px;
				position: absolute;
				top: 2px;
				left: 2px;
				z-index: 1;
			}
			
			li.topHighlight h2 {behavior: url(common/pngfix/iepngfix.htc);}
			
			li.topHighlight p.topHighlightPic {
				width: 420px;
				height: 275px;
				position: absolute;
				top: 2px;
				left: 2px;
			}
			
			li.topHighlight div.topHighlightDetails {
				width: 420px;
				height: 80px;
				position: absolute;
				top: 271px;
				left: 2px;
			}
			
				.topHighlightDetails h3 {font-size: 0.875em; color: rgb(255,255,255); margin-bottom: 0.3125em;}
				.topHighlightDetails p {font-size: 0.75em;}
				
				.topHighlightDetails p.moreTopStories {
					position: absolute;
					bottom: 8px;
					_bottom: 5px;	/* for M$IE6 */				
					right: 5px;
				}

				.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: 0.875em; color: rgb(255,255,255); margin-bottom: 0.625em;}
				li.otherHighlight p {font-size: 0.75em;}
				
			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;
		}
		
		.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: 310px;
			padding: 10px;
			background: url(../img/bg/bg_categoriesBox5.jpg) no-repeat;
		}
		
		.forumBox {
			width: 385px;
			height: 195px;
			background: url(../img/bg/bg_forumBox.jpg) no-repeat;
			padding: 15px 15px 10px;
			clear: both;
		}
				
			.gradientBox h2, .gradientBox2 h2, .gradientBox3 h2, .gradientBox4 h2,
			.gradientBox5 h2, .forumBox h2, .innerpageForum h2 
			{font-size: 1em; color: rgb(30,121,188); margin-bottom: 0.3125em;}
			
			.gradientBox2 h3 a, .gradientBox3 h3 a, .gradientBox4 h3 a, .forumBox h3 a {color: rgb(103,166,212);}
			
			.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, .gradientBox5 ol li,
			.innerpageForum ol li {height: 60px; margin-bottom: 0.625em; 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: 0.625em;}
			
			.gradientBox ol li h3, .gradientBox5 ol li h3,
			.innerpageForum ol li h3 {font-size: 0.875em; color: rgb(33,60,112); margin-bottom: 0.3125em;}
			
			.gradientBox ol li p, .gradientBox5 ol li p, .innerpageForum ol li p {font-size: 0.625em;}			
			.gradientBox 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, .gradientBox5 ol li h3 a:hover,
			.innerpageForum ol li h3 a:hover {color: rgb(33,60,112); text-decoration: underline;}
				
			.gradientBox ol li.smallThumb, .gradientBox5 ol li.smallThumb {
				height: 32px;
				margin-bottom: 0.3125em;
				border-bottom: 1px dotted rgb(72,72,72);
				padding-bottom: 0.3125em;
			}
			
			.gradientBox ol li.smallThumb p.newspic, .gradientBox5 ol li.smallThumb p.newspic {
				width: 52px;
				height: 32px;
				float: left;
				margin-right: 0.625em;
			}
			
			.gradientBox ol li.smallThumb h3, .gradientBox5 ol li.smallThumb h3 
			{font-size: 0.75em; color: rgb(72,72,72); margin-bottom: 0.3125em;}
			
			.gradientBox ol li.smallThumb p, .gradientBox5 ol li.smallThumb p {font-size: 0.625em;}
			.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;}
			
			/* Style for Quick Vote */
			.gradientBox2 h3 {
				font-size: 0.875em;
				color: rgb(103,166,212);
				margin-bottom: 0.625em;
				_margin-bottom: 0; /* for M$IE6 */
				/margin-bottom: 0; /* for M$IE7 */
			}
			
			.gradientBox2 ul {font-size: 0.75em;}
			.gradientBox2 ul li {height: 18px; margin-bottom: 0.3125em;}
			
			/* Style for Video */
			.gradientBox2 ul.videoList {font-size: 100%!important;}
			.gradientBox2 ul.videoList li {height: 65px; margin-bottom: 0.625em;}
			.gradientBox2 ul.videoList li p {font-size: 0.75em;}
				
				.gradientBox2 ul.videoList li p.videoThumb {
					width: 98px;
					height: 63px;
					padding: 2px 0 0 2px;
					background: url(../img/bg/bg_videoThumbs.png) no-repeat;
					float: left;
					margin-right: 2%;
				}
				
				.gradientBox2 ul.videoList li p.videoThumb {behavior: url(common/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 Directory */
			.gradientBox3 ul {width: 275px;}				
				.gradientBox3 ul li {margin-bottom: 0.625em; _margin-bottom: 0; /* for M$IE6 */ /margin-bottom: 0; /* for M$IE7 */}
				.gradientBox3 ul li h3 {font-size: 0.875em; color: rgb(103,166,212);}
				.gradientBox3 ul li p {font-size: 0.75em;}	
			
			.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(common/pngfix/iepngfix.htc);}
				
			/* Style for Mini Forum */
			.gradientBox2 ul.forumList li {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 Blogs */
			.gradientBox4 ul.blogList {width: 385px;}
			.gradientBox4 ul.blogList li {margin-bottom: 0.9375em; _margin-bottom: 0; /* for M$IE6 */}
				
				.gradientBox4 ul.blogList li p.blogThumb {
					width: 90px;
					height: 60px;
					float: right;
					padding: 0 0 10px 5px;
				}
				
				.gradientBox4 ul.blogList li h3 {font-size: 0.875em; color: rgb(103,166,212); margin-bottom: 0.3125em;}
				
				.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: 0.75em;}
				
			/* Style for Forum */
			.forumBox .hightlightForum {width: 385px; overflow: hidden;}
				.hightlightForum p.forumThumb {
					width: 90px;
					height: 60px;
					float: left;
					padding: 0 10px 15px 0;
				}
				
				.hightlightForum h3 {font-size: 0.875em; color: rgb(103,166,212); margin-bottom: 0.3125em;}
				.hightlightForum p {font-size: 0.75em;}
				
				.hightlightForum ul.forumListLeft {width: 190px; float: left; font-size: 0.75em;}
				.hightlightForum ul.forumListRight {width: 190px; float: right; font-size: 0.75em;}
				
					ul.forumListLeft li, ul.forumListRight li {
						margin-bottom: 0.3125em;
						padding: 3px 0;
						border-bottom: 1px dotted rgb(72,72,72);
					}
					
					ul.forumListLeft li a, ul.forumListRight li a {color: rgb(103,166,212);}
					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: 0.75em; line-height: 140%; padding-left: 5px;}
				.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: 0.75em;
				color: rgb(72,72,72);
				margin: 0 auto 0.625em;
				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: 93px;
					margin-right: 5px;
				}
				
				ul.mostViewList li h3 {font-size: 120%; margin-bottom: 0.3125em;}
				ul.mostViewList li h3 a:hover {text-decoration: underline;}
				ul.mostViewList li p {margin-bottom: 0.3125em;}
				
				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;
			position: relative;
		}
		
			#breakingNews h2 {
				font-size: 0.875em;
				color: rgb(255,255,255);
				padding: 12px 0 0 12px;
				margin-bottom: 10px;
			}
			
			#breakingNews p.rssFeed {
				width: 20px;
				height: 20px;
				font-size: 0.625em;
				background: url(../img/bg/bg_rss-feed.png) no-repeat;
				position: absolute;
				top: 8px;
				right: 15px;
			}
			
				p.rssFeed {behavior: url(common/pngfix/iepngfix.htc);}
				p.rssFeed a {display: block; width: 20px; height: 20px;}
				p.rssFeed a span {visibility: hidden;}
			
			#breakingNews ul.breakingList {
				width: 275px;
				font-size: 0.75em;
				margin: 0 auto 0.625em;
				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 h3 {font-size: 140%; margin-bottom: 0.3125em;}
				ul.breakingList li h3 a:hover {text-decoration: underline;}
				ul.breakingList li p {margin-bottom: 0.3125em;}
				
				ul.breakingList li a {color: rgb(30,121,188); text-decoration: none;}
				ul.breakingList li a:hover {color: rgb(30,121,188); text-decoration: underline;}
			
			#breakingNews p.moreBreakingNews {
				font-size: 0.75em;
				position: absolute;
				bottom: 15px;
				right: 10px;
			}
			
				p.moreBreakingNews a {color: rgb(154,180,229); text-decoration: none;}
				p.moreBreakingNews a:hover {color: rgb(154,180,229); text-decoration: underline;}
				
		/*
		##################
		Sidebar's Ads Box
		##################
		*/
		
		.boomboxSize1 {width: 300px; height: 250px;}
		
		.boomboxSize2 {
			width: 300px;
			height: 65px;
			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: 0.625em;}
	
	#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: 0.75em; 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: 0.75em; 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: 0.625em;}
		
		ul.newsCategories li.varietyGreen, ul.newsCategories li.varietyViolet, 
		ul.newsCategories li.varietyRed, ul.newsCategories li.varietyBlue
		{margin-right: 10px;}
		
			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 {
				font-size: 0.875em;
				font-weight: normal;
				color: rgb(255,255,255);
				padding: 2px 0 2px 5px;
				margin-bottom: 0.625em;
			}
		
				ul.newsCategories li.varietyGreen h2 {background: rgb(28,187,180);}
				ul.newsCategories li.varietyViolet h2 {background: rgb(188,140,191);}
				ul.newsCategories li.varietyRed h2 {background: rgb(157,10,14);}
				ul.newsCategories li.varietyBlue h2 {background: rgb(0,33,87);}
				ul.newsCategories li.varietyGrey h2 {background: rgb(54,47,45);}
				
/*
#################
Post Directories
#################
*/

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

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

	#todayInfo h2 {
		font-size: 0.875em;
		color: rgb(255,255,255);
		padding: 12px 0 0 12px;
		margin-bottom: 1.25em;
	}
	
	#todayInfo h3 {
		font-size: 0.875em;
		color: rgb(103,166,212);
		padding-left: 13px;
		margin-bottom: 0.625em;
	}
	
/*
###########
Footer Ads
###########
*/

#footerAds {
	width: 738px;
	height: 110px;
	margin: 0 auto 0.625em;
	padding-top: 10px;
	clear: both;
	position: relative;
}

	#footerAds p.adsby {
		font-size: 0.875em;
		color: rgb(103,166,212);
		position: absolute;
		top: 7px;
		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: 1em; color: rgb(30,121,188); margin-bottom: 0.625em;}
		
		.allInPost .leftList {
			width: 145px;
			float: left;
			font-size: 0.75em;
			line-height: 140%;
			color: rgb(33,60,112);
		}
		
		.allInPost .rightList {
			width: 145px;
			float: right;
			font-size: 0.75em;
			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: 1em; color: rgb(30,121,188); margin-bottom: 0.625em;}
		
		.thailandInfo .leftList {
			width: 205px;
			float: left;
			font-size: 0.75em;
			line-height: 140%;
			color: rgb(33,60,112);
		}
		
		.thailandInfo .rightList {
			width: 205px;
			float: right;
			font-size: 0.75em;
			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: 1em; color: rgb(30,121,188); margin-bottom: 0.625em;}
		.eNewspaper p.eNewspaperThumb {width: 190px; margin: 0 auto;}
	
/*
##############
Footer Section
##############
*/

#footer {width: 964px; margin: 0 auto; padding: 30px 10px; font-size: 0.75em; color: rgb(255,255,255);}
#footer p img {behavior: url(../pngfix/iepngfix.htc);}
#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: 0.875em;
		font-weight: bold;
		padding: 10px 0 0 10px;
		color: rgb(30,121,188);
		position: relative;
		z-index: 5;
	}
	
	.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; position: relative; margin: -0.3125em 0 0.3125em; z-index: 3;}
		.innerRepeatBox .topCorner {
			width: 665px;
			height: 145px;
			background: transparent url(../img/bg/bg_topCorner.jpg) no-repeat;
			position: relative;
			z-index: 7;
		}
		
		.innerRepeatBox .bottomCorner {
			width: 665px;
			height: 145px;
			margin-top: -90px;
			background: transparent url(../img/bg/bg_bottomCorner.jpg) no-repeat;
			position: relative;
			z-index: 8;
		}
		
		.innerRepeatBox .subChanelDetail {
			width: 615px;
			margin: -120px auto 0;
			padding: 0 15px;
			border-left: 1px solid rgb(178,178,178);
			border-right: 1px solid rgb(178,178,178);
			position: relative;
			z-index: 9;
		}
		
			.subChanelDetail h2 {font-size: 1em; color: rgb(30,121,188); margin-bottom: 0.625em;}
			.subChanelDetail .latestList {width: 615px; overflow: hidden;}
			.subChanelDetail form {font-size: 0.75em; position: absolute; top: 0; right: 10px;}
				
				.latestList li {
					font-size: 0.75em;
					margin-bottom: 0.625em;
					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 p.updatedThumb {
					width: 90px;
					height: 60px;
					margin-right: 0.625em;
					float: left;
				}
				
				.latestList div.pollResult {
					width: 60px;
					height: 50px;
					margin-right: 0.625em;
					background: url(../img/bg/bg_pollResult.gif) no-repeat;
					float: left;
					text-align: center;
					padding-top: 10px;
				}
				
					div.pollResult p.votedCount {font-size: 0.875em; margin-bottom: 0.625em;}
					div.pollResult p.votedPercent {font-size: 2em; 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: 0.75em; 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;}
	#articleWrapper .entry {padding: 10px; overflow: hidden;}
	#articleWrapper .entry:after {content: "."; height: 0; display: block; clear: both; visibility: hidden;}
	
		.entry h2 {font-size: 1.5em; margin-bottom: 0.625em;}
		.entry p img {float: right; margin: 0 0.625em 0 0.625em; border: none;}
		.entry p {font-size: 0.75em; margin-bottom: 0.9375em; color: rgb(70,70,70);}
		.entry a {color: rgb(70,70,70); text-decoration: underline;}
		.entry a:hover {color: rgb(70,70,70); text-decoration: none;}
		
		.entry .columnistProfile {
			font-size: 0.625em;
			color: rgb(54,54,54);
			line-height: 130%;
			margin-bottom: 0.625em;
			overflow: hidden;
		}
		
		.entry .columnistProfile:after {content: "."; height: 0; display: block; clear: both; visibility: hidden;}
			.columnistProfile dt {
				float: left;
				width: 63px;
				height: 63px;
				margin: 0 0.3125em 0.3125em 0;
				border: 1px solid rgb(54,54,54);
				_position: relative; /* for M$IE6 */
			}
			
			.columnistProfile dt img {border: none; _position: absolute; /* for M$IE6 */ _top: 0; /* for M$IE6 */}
			
			.columnistProfile a {color: rgb(54,54,54); text-decoration: underline;}
			.columnistProfile a:hover {color: rgb(54,54,54); text-decoration: none;}
			
		.entry .googleAds {width: 468px; height: 60px; clear: both; margin-bottom: 0.625em;}
	
	/* Social Bookmarking Panel */
	#socialLink {width: 720px; font-size: 12px; overflow: hidden;}
	#socialLink:after {content: "."; height: 0; display: block; clear: both; visibility: hidden;}
		
		#socialLink ul li {
			height: 16px;
			float: left;
			padding-left: 20px;
			margin: 0 0.625em 0.625em 0;
			/margin: 0 0.625em 0 0;
		}
		
		#socialLink ul li#postlink a {color: rgb(204,0,0); text-decoration: none;}
		
		#socialLink ul li a {color: rgb(54,54,54); text-decoration: underline;}
		#socialLink ul li a:hover {color: rgb(54,54,54); text-decoration: none;}
		
		#socialLink ul li#deliciouslink {background: url(../img/snsicon/delicious.gif) no-repeat;}		
		#socialLink ul li#digglink {background: url(../img/snsicon/digg.gif) no-repeat;}		
		#socialLink ul li#magnolialink {background: url(../img/snsicon/magnolia.gif) no-repeat;}
		#socialLink ul li#redditlink {background: url(../img/snsicon/reddit.gif) no-repeat;}			
		#socialLink ul li#stumblelink {background: url(../img/snsicon/stumbleupon.gif) no-repeat;}
		#socialLink ul li#technoratilink {background: url(../img/snsicon/technorati.gif) no-repeat;}
		#socialLink ul li#twitterlink {background: url(../img/snsicon/twitter.gif) no-repeat;}
		
		#socialLink ul li#postlink {background: url(../img/snsicon/post.gif) no-repeat;}
		#socialLink ul li#printlink {background: url(../img/snsicon/print.gif) no-repeat;}
		#socialLink ul li#emaillink {background: url(../img/snsicon/email.gif) no-repeat;}

/*
#############################################
Comment Panel Control added on 18 Sept. 2008
#############################################
*/

#commentWrapper {width: 965px; margin: 0 auto 0.625em; clear: both; padding-top: 10px;}
	
	#commentWrapper h2 {
		width: 955px;
		height: 20px;
		font-size: 1em;
		color: rgb(255,255,255);
		padding: 5px 0 0 10px;
		margin-bottom: 0.625em;
		background: url(../img/bg/bg_articleHeading.jpg) no-repeat;
	}
	
	#commentWrapper .commentList {width: 945px; margin: 0 auto;}
		.commentList li {width: 945px; margin-bottom: 0.625em; overflow: hidden;}
		.commentList li:after {content: "."; display: block; clear: both; visibility: hidden; height: 0;}
		
			.commentList li p.avartarBox {
				width: 82px;
				font-size: 0.875em;
				text-align: center;
				color: rgb(177,177,177);
				float: left;
				margin-right: 0.3125em;
			}
			
			.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: 0.75em; margin: 0 auto 0.3125em;}
				.userComment p.discussionInfo {font-weight: bold; margin-top: -45px; margin-bottom: 0.625em;}
				
				.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: 0.9375em;
	}
	
		p.replyArticle span {visibility: hidden;}
	
	#commentPost #postPanelWrapper {
		width: 945px;
		color: rgb(54,54,54);
		margin: 0 auto 0.625em;
		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;
		overflow:hidden;
	}
	
	#postPanelWrapper a {color: rgb(54,54,54); text-decoration: underline;}
	#postPanelWrapper a:hover {color: rgb(54,54,54); text-decoration: none;}
	
		#postPanelWrapper ul {width: 550px; font-size: 0.75em;}
			#postPanelWrapper ul li {margin-bottom: 0.625em;}
				#postPanelWrapper ul li label {display: block; margin-bottom: 0.3125em;}
				#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: 0.625em;
				}
				
/*
################################
Bangkok Post: Inner Page Layout
Start on: 14 Oct. 2008
################################
*/

body.shortHeader #header {height: 75px;}
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: 0.75em;
		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: 0.75em; 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: 1em;
			color: rgb(19,52,79);
			margin-bottom: 0.625em;
			border-bottom: 1px rgb(221,221,221) solid;
		}
		
		#searchWrapper h2 em {font-style: normal; color: rgb(237,28,36);}
		
		#searchWrapper ol {
			font-size: 0.75em;
			color: rgb(51,51,51);
			padding-left: 5px;
			margin-bottom: 1.5em;
		}
		
		#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: 0.625em;}
			#searchWrapper ol li p.typeDate span {color: rgb(35,66,91); font-weight: bold;}
			#searchWrapper ol li h3 {color: rgb(35,66,91);}
			
			#searchWrapper ol li p.resultThumb {
				width: 90px;
				height: 60px;
				float: left;
				margin-right: 0.625em;
			}
			
		#searchWrapper p.searchPageNavigation {font-size: 0.75em; 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: 650px;} 
			ol.advanceSearchPanel li {border-bottom: 0 !important;}
			ol.advanceSearchPanel li:hover {background: transparent !important;}
			
			ol.advanceSearchPanel li label {width: 180px; float: left;}
			ol.advanceSearchPanel li p {width: 460px; float: right;}
			ol.advanceSearchPanel li p span {display: block; margin-bottom: 0.9375em;}
			
				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;}	
				
/*
################################
Bangkok Post: Blog
Start on: 21 Oct. 2009
################################
*/
	#content .clear {clear: both !important;}
	#content .clearLeft {clear: left !important;}
	.level-blog {padding: 10px 0;}
	
	#content #content-blog {width: 762px; float: left; font-size: 12px; margin-bottom: 20px;}
	#content .support-ads {width: 645px !important;}
	#content .article-blog {width: 720px !important; padding: 20px; border: 1px solid rgb(178,199,201);}
	
		#content-blog a {color: rgb(30,121,188);}
		#content-blog a:hover {text-decoration: underline;}
		
		#content-blog h3 {font-size: 14px; color: rgb(57,69,81); margin-bottom: 3px;}
		#content-blog h3 a {color: rgb(57,69,81);}

		#content-blog p {margin-bottom: 5px;}
		
		
	/*	header
		--------------------------------------------------------------------*/		
		#content-blog .header {
			height: 30px;
			font-size: 15px;
			padding: 10px 10px 0;
			margin-bottom: 10px;
			background: url(../img/bg/bg-header-blog.gif) repeat-x;
			position: relative;
		}
		
		#content-blog .header h2 {font-size: 15px; color: rgb(30,121,188);}
		
		#content-blog .header ul {position: absolute; left: 10px; top: 0;}
		
		#content-blog .header ul li {height: 30px; float: left; margin-left: -1px;}
		#content-blog .header ul li.first-child {margin-left: 0;}
				
		#content-blog .header ul li.last-child a span {border: 0;}
		#content-blog .header ul li a {
			display: block;
			height: 30px;
			float: left;
			color: rgb(57,69,81);
			padding: 10px 0 0;
		}
		#content-blog .header ul li a:hover {color: rgb(30,121,188); text-decoration: none;}
		
		#content-blog .header ul li a span {border-right: 1px solid rgb(57,69,81); padding: 0 10px;}
		
		#content-blog .header ul li a.active {border: 1px solid rgb(191,191,191); border-bottom: 0; background: rgb(255,255,255);}
		#content-blog .header ul li a.active span {color: rgb(30,121,188); border: 0; text-decoration: none;}
		
		#content-blog #most-post .header {border-bottom: 1px solid rgb(191,191,191);}
	

	/*	
		--------------------------------------------------------------------*/
		#content-blog p.read-comment a {color: rgb(102,102,102);}
		
		
	/*	latest-post
		--------------------------------------------------------------------*/	
		#content-blog #latest-post {overflow: hidden; margin-bottom: 20px;}
		#content-blog #latest-post p {margin: 0 10px 10px; line-height: 20px; overflow: hidden;}
		
		#content-blog #latest-post p.post-date span {
			float: left; 
			font-size: 15px; 
			color: rgb(255,255,255);
			padding: 5px 15px; 
			background: rgb(151,167,182);
		}
		
		#content-blog #latest-post p.post-by a {font-weight: bold;}
		
		#content-blog #latest-post p.thumbnail {float: left; clear: both;}
		
		#content-blog #latest-post h3 {font-size: 25px;}


	/*	post-list
		--------------------------------------------------------------------*/
		#content-blog .post-list {padding: 0 10px;}
		#content-blog .post-list li {padding: 10px 0; border-bottom: 1px dotted rgb(178,178,178); overflow: hidden;}
		
		#content-blog .post-list li.more {text-align: right; border: 0;}
		
		#content-blog .post-list li .thumbnail {float: left; margin-right: 10px;}
		
		#content-blog .post-list li p.post-date {
			width: 67px;
			float: right;
			color: rgb(255,255,255);
			padding: 5px 0;
			margin-left: 10px;
			text-align: center;
			background: rgb(151,167,182);
		}

		#content-blog .post-list li p.post-date em {font-size:20px; font-style:normal; display:block;}
		#content-blog .post-list li p.post-date span {display:block;}
				
		#content-blog .post-list li ul {margin-bottom: 5px;}
		#content-blog .post-list li ul li {
			padding: 0;
			border: 0;
		}
		

	/*	blogger-list
		--------------------------------------------------------------------*/
		#content-blog #blogger .blogger-list {width: 645px;}
		#content-blog #blogger .blogger-list li {width: 312px; float: left; padding: 0 0 10px 10px;}
		#content-blog #blogger .blogger-list li .thumbnail {float: right; margin-left: 10px;}
		#content-blog #blogger .blogger-list li p {clear: both;}
		
		#content-blog #blogger .blogger-list li ul {margin-bottom: 5px;}
		#content-blog #blogger .blogger-list li ul li {width: auto; float: none; padding: 0;}
		
		
		#content-blog #socialLink {border-top: 1px dotted rgb(178,178,178);	border-bottom: 1px dotted rgb(178,178,178);	padding: 15px 0 10px;}


	/*	pagenation
		--------------------------------------------------------------------*/		
		#content-blog .pagenation {padding: 10px;}
		#content-blog .pagenation a {color: rgb(35,66,91); text-decoration: underline; margin-right: 3px;}
		#content-blog .pagenation a:hover {color: rgb(0,0,0); text-decoration: none;}
		#content-blog .pagenation span.active {font-weight: bold; color: rgb(0,0,0); margin-right: 3px;}
		
		
	/*	article-blog
		--------------------------------------------------------------------*/				
		#content .article-blog p {line-height: 20px; margin-bottom: 10px;}
		
		#content .article-blog p.post-date span {
			font-size: 15px; 
			color: rgb(255,255,255);
			padding: 5px 15px; 
			background: rgb(151,167,182);
		}
		
		#content .article-blog h3 {font-size: 25px;}
		
		#content .article-blog .figure {text-align: center;}
		#content .article-blog .figure-left {float: left; margin-right: 10px;}
		#content .article-blog .figure-right {float: right; margin-left: 10px;}
		
		
		#content .article-blog #main-sns {
			width: 108px;
			float: right;
			border: 1px solid rgb(223,223,223);
			padding: 10px;
		}
		
		#content .article-blog #main-sns .tweetmeme_button {
			width:50px;
			height:61px;
			float:left;
			padding-top:3px;
		}
		
		
		#content .article-blog #main-sns .facebook-share {
			width:50px;
			height:61px;
			float:right;
			padding-top:3px;
		}


	#content #side-bar {width: 192px; font-size: 12px; float: right;}
	#content .sidebar-ads {width: 300px !important;}
	
		#side-bar h2 {font-size: 15px; color: rgb(57,69,81); padding: 5px 5px 2px;}
		
		#side-bar .boombox-ads {width: 300px; margin-bottom: 20px;}
		
		#side-bar #editors-columnists, .sidebar-ads #search {
			width: 298px;
			border: 1px solid rgb(178,178,178);
			margin-bottom: 20px;
			overflow: hidden;
			/padding-bottom: 5px;
		}
		.sidebar-ads #search p {padding: 5px 6px 0 6px;}
		.sidebar-ads #search p a {color: rgb(30,121,188);}
		.sidebar-ads #search p.link {padding:5px 6px 10px 6px; text-align:center;}
		#side-bar #editors-columnists ul li {
			width: 90px;
			float: left;
			margin: 3px 3px 5px 5px;
			_display: inline;
		}
		#side-bar #editors-columnists ul li img {float: left;}
	
		.sidebar-ads #search ul li {float: left; padding: 3px 0 5px 5px;}
		.sidebar-ads #search ul li.redio1 {width: 80px;}
		.sidebar-ads #search ul li.redio2 {width: 95px;}
		.sidebar-ads #search ul li.redio3 {width: 97px;}
		
		.sidebar-ads #search ul li .textfield {
			width: 278px;
			font-size: 14px;
			color: rgb(255,255,255);
			padding: 3px 2px;
			border: 1px solid rgb(98,107,115);
			background: rgb(191,191,203);
		}
		
		#side-bar #sns ul li {float: left; padding: 27px 8px 0;}
		#side-bar #sns ul li.follow-me {float: right; padding: 0 8px 0 0;}


/*
############################
Member System by Mook 11May2010
############################
*/

	/*Login Link*/
	#memberAssistance li span.msg {display: block; float: left;}
	#memberAssistance li  p {margin-top: -1px;}
	#memberAssistance li .alertmessage {
	background: url(/common/img/member/ico_alertleft.png) no-repeat;
	color: rgb(255,255,255);
	font-size: 9px;
	height: 12px;
	float: left;
	text-align:center;
	min-width:16px;
	_width:20px;
	}
	#memberAssistance li .alertmessage  span {display:block;background: url(/common/img/member/ico_alertright.png) no-repeat scroll right top; padding:0 4px 0 0; margin-left:3px;  height: 12px;}
	#bkkPostTab #memberAssistance .welcomemessage {margin-top: -1px; border-right: 1px solid rgb(197,197,197);}
	#memberAssistance .username {
	color: rgb(30,121,188); 
	font-size: 12px; 
	font-weight: bold;  
	padding: 0 3px 0 0 ;
	}
	#memberAssistance .edit {text-decoration: underline;}
	#memberAssistance .logout {border-right:none;}


	/*Interactive Message*/
	#wrapper #content .InteractiveMessage {margin: 0 auto 25px auto; overflow: hidden; width: 925px;}
	#wrapper #content .InteractiveMessage img {float: left;}
	
	#wrapper #content .InteractiveMessage h3 {
	color: rgb(22,63,104); 
	font-size: 24px; 
	font-weight: bold;
	padding-top: 20px;}
	
	#wrapper #content .InteractiveMessage p {
	color: rgb(54,54,54);
	font-size: 14px;
	padding: 20px 0 0 0; }
	
	#wrapper #content .InteractiveMessage p a {color: rgb(30,121,188); text-decoration: underline;}
	#wrapper #content .InteractiveMessage p a:hover {color: rgb(30,121,188); text-decoration: none;}
	/*Interactive Message - Decrease width comment section*/
	#wrapper #content .CommentMessage{margin: 0 0 25px -10px; overflow: hidden; width: auto;}
	#wrapper #content .CommentMessage img {float: left;}
	
	#wrapper #content .CommentMessage h3 {
	color: rgb(22,63,104); 
	font-size: 24px; 
	font-weight: bold;
	padding-top: 20px;}
	
	#wrapper #content .CommentMessage p {
	color: rgb(54,54,54);
	font-size: 14px;
	padding: 20px 0 0 0; }
	#wrapper #content .CommentMessage p.signuplink{padding:0 0 0 327px;}
	#wrapper #content .CommentMessage p a {color: rgb(30,121,188); text-decoration: underline;}
	#wrapper #content .CommentMessage p a:hover {color: rgb(30,121,188); text-decoration: none;}
	/*Writing Box*/
	.WritingBox {
	background: rgb(243,243,243);
	border-bottom :1px solid rgb(185,185,185);
	margin: 26px 0 15px 0;
	padding:15px 10px 35px;
	width:618px; }
	
	.WritingBox h2 {
	color: rgb(54,54,54); 
	font-size: 14px;
	font-weight: bold;
	padding: 0 0 10px 0; }
	
	.WritingBox h2 span {color: rgb(30,121,188); }
	.WritingBox img {float: left; margin-right: 10px;}
	.WritingBox textarea {height: 55px; width: 525px;}
	.WritingBox input {margin-top: 10px;}
	
	/*Discussion Board - After Login*/
	#content .UserDetail {float: left; width: 86px; }
	#content #postPanelWrapper .UserDetail {margin: 15px 0 0 10px; width: 100px; _display: inline;}
	#content .UserDetail .username{
	color: rgb(30,121,188); 
	font-size: 14px; 
	font-weight: bold;
	text-decoration: none; }
	#content .UserDetail .username:hover {color: rgb(30,121,188); text-decoration: underline; }
	
	#content .UserDetail p{
	color: rgb(54,54,54); 
	font-size: 12px;
	padding: 2px 0 0 0; }
	
	#content .UserDetail p.sendmessage {background: url(/common/img/member/ico_sendmsg.gif) no-repeat left 2px; font-size: 9px; padding-left: 17px;}
	#content .UserDetail p.sendmessage a {color: rgb(54,54,54); text-decoration: none;}
	#content .UserDetail p.sendmessage a:hover, #postPanelWrapper .Otheroptions .Panelblock a:hover {text-decoration: underline;}
	
	#postPanelWrapper .CommentBox {float:right; width: 823px;}
	#postPanelWrapper .CommentBox .err {display: block; font-size: 12px; padding: 5px 0;}
	#postPanelWrapper .CommentBox .yourcomment {
	color: rgb(30,121,188); 
	font-size: 14px; 
	font-weight: bold; 
	padding:0 0 5px 5px; }
	#postPanelWrapper .CommentBox input.submitcomment {
	background: url(/common/img/member/bt_submitcomment.jpg) no-repeat; 
	border: none;
	cursor: pointer;
	height: 31px;
	margin: 5px 0 0 0;
	width: 155px; }
	
	#postPanelWrapper .CommentBox textarea {height: 145px; width: 810px;}
	
	.Otheroptions  h3{font-size: 13px; font-weight: bold; padding: 25px 0 5px 5px;}
	.Otheroptions .Panelblock {background: url(/common/img/member/bg_otheroption.jpg) no-repeat; height: 62px; width: 568px;}
	
	.Otheroptions .Panelblock label {
	font-size: 12px;
	float: left;
	padding: 10px 2px 0 0; 
	_padding: 5px 2px 0 0; 
	/padding: 5px 2px 0 0; }
	
	.Otheroptions .Panelblock  label.instruction {float:left; padding:10px;}
	#content .Otheroptions .Panelblock a {
	clear: both; 
	display: block; 
	font-size: 12px; 
	font-weight: bold; 
	padding:0 10px;
	text-decoration: none;}
	#commentPost {padding-top: 10px;}

	/*Multimedia dropdown menu*/
	.MultimediaServiceTheme #mainNavigation {z-index: 99;}
	.MultimediaServiceTheme #header {z-index:99!important;}
	#header #mainNavigation .multimedialist {background: url(/common/img/bg/bg_multimedia_dropdown.jpg) no-repeat; width: 106px; height: 73px; padding-top: 5px;}
	#header #mainNavigation .multimedialist li{width:106px; height: 18px; float: none;}
	#header #mainNavigation .multimedialist li.last a{border: none;}
	#header #mainNavigation .multimedialist a {
		background: none; 
		border-bottom: 1px dotted rgb(151,151,151); 
		width:93px; 
		height: 15px; 
		display: block; 
		margin: 0 auto; 
		color: rgb(0,0,0); 
		padding-left: 5px;
		padding-top: 2px;
		font-size: 11px;
	}
	#header #mainNavigation .multimedialist a:hover {background: url(/common/img/bg/bg_multimedia_hover.gif) no-repeat; color: rgb(255,255,255);}
	
	/*Service dropdown menu*/
	#header #mainNavigation .servicelist {background: url(/common/img/bg/bg_service_dropdown.jpg) no-repeat; width: 92px; height: 169px; padding-top: 5px;}
	#header #mainNavigation .servicelist li{width:92px; height: 18px; float: none;}
	#header #mainNavigation .servicelist li.last a {border: none;}
	#header #mainNavigation .servicelist a {
		background: none; 
		width:82px; 
		height: 15px; 
		display: block; 
		margin: 0 auto; 
		color: rgb(0,0,0); 
		padding-left: 4px; 
		padding-top: 2px;
		border-bottom: 1px dotted rgb(151,151,151);
		font-size: 11px;
	}
	#header #mainNavigation .servicelist a:hover {background: url(/common/img/bg/bg_service_hover.gif) repeat-x; color: rgb(255,255,255);}