/* ########################################### */
/* -------- XCOL  STYLES STYLESHEET --------- */
/* ########################################### */

@media screen {

#xcol {
	
}	
	#xcol div#siteSearch,
	#xcol div#jobSearch {
		margin:20px 0px 20px 0px;
		padding:10px;
		border:1px solid #cccccc;
		background-color:#f5f5f5;
		overflow:hidden;
	}
	#xcol div#siteSearch {
		padding:10px 10px 5px 10px;
	}
		#xcol div#siteSearch #siteSearchText,
		#xcol #jobSearch #jobSearchText {
			border-top:1px solid #8f8f8f;
			border-left:1px solid #cecece;
			border-right:1px solid #cecece;
			border-bottom:1px solid #cecece;
			font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
			font-size:1.2em;
			color:#888888;
			height:16px;
			float:left;
			padding-left:5px;
			margin-right:5px;
		}
		#xcol div#siteSearch #siteSearchText {
			font-style:oblique;
			width:195px;
		}
		#xcol #jobSearch #jobSearchText {
			width:165px;
		}
		#xcol #jobSearch label {
			float:left;
			font-weight:700;
			color:#999999;
			padding:3px 10px 0px 0px;	
		}
		#xcol #jobSearch .header {
			border:0;
			padding:0 0 10px 0;
		}
		#xcol #jobSearch .header h2 {
			font-size:1.3em;
			float:left;
			height:auto;
		}
		#xcol #jobSearch .header img {
			float:right;
		}
		#xcol #jobSearch form {
			margin:5px 0px;
			overflow:hidden;
			padding:10px 0px 10px 0px;
			background:url("/_hbi_ui/_MTO/_images/bkg/bkgDotted.png") repeat-x scroll left bottom transparent;
		}
		#xcol #jobSearch h3 {
			font-weight:700;
			font-size:1.2em;
			color:#999999;
			font-family:Arial, Helvetica, sans-serif;
		}
		#xcol #jobSearch ul {
			float:left;
			width:130px;
			margin-top:10px;
			margin-right:10px;
		}
		#xcol #jobSearch ul.last {
			margin-right:0;
		}
		#xcol #jobSearch ul li {
			margin-bottom:5px;
			font-size:1.3em;
			word-wrap:break-word;
		}
		
	#content #xcol .mpu a img {
		border:0;
	}
	
	/* Site Search - overwritting above styles as opposed to removing them as shared with jobs module */
	
	#xcol div#siteSearch {
		background-color: #F4F0EB;
		border: 0;
	}
	
		#xcol div#siteSearch:first-child {
			margin-top: 0;
		}
	
		#xcol div#siteSearch #siteSearchText {
			border: 1px solid #000;
			border-bottom-width: 6px;
			height: 36px;
			line-height: 36px;
			font-size: 14px;
			padding-left: 7px;
			margin-right: 0;
			width: 180px;
		}
	
		#xcol #siteSearch #siteSearchButton {
			background: #000 url("/_hbi_ui/_MTO/_images/bkg/bkgSiteSearchButton.gif") no-repeat 6px 15px;
			border-width:0;
			color: #fff;
			cursor:pointer;
			font-size: 1.5em;
			padding:0;
			font-family: Oswald, serif;
			text-transform: uppercase;
			height: 45px;
			padding: 5px 10px 5px 25px;
			margin-left: 0;
		}
	
/* ========= XCOL PROMOS ==============*/
#sky {
	float:left;
	width:120px;
	margin-bottom:20px;
}
	#sky img,
	#sky embed {
		margin-bottom:10px;
	}
.xcolAds {
	margin-left:0;
	width:140px;
	float:right;
}
	#content .xcolAds h3 {
		font-family:Georgia;
		font-size:1.3em;
		margin-bottom:10px;
		padding-bottom:10px;
		background:url(/_hbi_ui/_MTO/_images/bkg/bkgDotted.png) left bottom repeat-x;
	}
		#content .xcolAds h3 a,
		#content .xcolAds p a {
			color:#333;
		}
.xcolPromoImageTitleText,
.xcolPromoImageTitle,
.xcolPromoTitleText {
	position:relative;
	overflow:hidden;
	width:140px;
	margin-bottom:20px;
}
	.xcolPromoImageTitleText a img,
	.xcolPromoImageTitle a img {
		width:140px;
	}
	#content .xcolPromoImageTitleText p {
		color:#fff;
		background:#333;
		padding:10px;
		width:120px;
		display:block;
		margin:0;
	}
	#content .xcolPromoImageTitleText p a,
	#content .xcolPromoImageTitleTex p a:hover{
		display:block;
		color:#fff;
		font-weight:400;
	}
	#content .xcolPromoImageTitleTex p a:hover {
		text-decoration:underline;
	}
	.xcolPromoImageTitleTex a,
	.xcolPromoImageTitleTex a img{
		display:block;
	}
	#content .xcolPromoTitleText p {
		font-weight:700;
	}
body.col-MX #xcol .promoImageTitleText, 
body.col-MX #xcol .promoTitleText, 
body.col-MX #xcol .promoImageOnly, 
body.col-MX #xcol .promoImageTitle {
	margin-left:0;
	width:300px;
}

/* tab panel */
div.tabContainer {
	margin:20px 0px 0px 0px;
}
	.tabContainer ul {
		margin:0px;
		padding:0px;
		overflow:hidden;	
	}
	
	.tabContainer ul li.first {
		width:151px;
	}
	
	.tabContainer ul li.last {
		width:149px;
	}
		
		#content .tabContainer ul.tabs li {
			font-family:Georgia;
			font-size:1.3em;
			font-weight:700;
			background:none;
			float:left;
			margin:0px;
			padding:0px;
			overflow:hidden;
		}

			.tabContainer ul.tabs a {
				padding:10px;
				border-top:1px solid #fff;
				border-left:1px solid #fff;
				border-right:1px solid #fff;
				border-bottom:1px solid #ccc;
				display:block;
			}
			.tabContainer ul.tabs a.selected {
				border-top:1px solid #ccc;
				border-left:1px solid #ccc;
				border-right:1px solid #ccc;
				border-bottom:1px solid #f5f5f5;
				background-color:#f5f5f5;
				padding:10px;
			}
				.tabContainer ul.tabs li.last a {
					padding-right:63px;
				}
				.tabContainer ul.tabs a.selected span {
					color:#333;
				}
				
#mostReadCommented{
	margin-bottom:20px;
}

/* Hiding and loading classes to only show the discussed tab once its loaded */
#mostReadCommented .loading #mostDiscussed,
#mostReadCommented .loading li.last{
	display:none;
}

#mostReadCommented .loading .tabContainer ul li{
	float:none;
	width:100%;
}

	#mostReadCommented .loading .tabContainer ul li a{
		display:block;
	}
				
#mostReadCommented .tabContainer ul.tabs li.last {
	width:207px;
}

#mostReadCommented .tabContent{
	border-bottom:1px solid #ccc;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	background-color:#f5f5f5;
	overflow:hidden;
	padding:10px 10px 0 10px;
}

	
	#mostReadCommented .tabContent h3{
			font-size:1.2em;
			font-family:Arial, Helvetica, sans-serif;
			background: url("/_hbi_ui/_MTO/_images/bkg/bkgDottedBlue.png") repeat-x left bottom;
		    margin-bottom: 10px;
		    padding-bottom: 10px;
	}
	
	#mostReadCommented .tabContent h3.last{
		background:none;
	}
	
}