@charset "utf-8";
/* CSS Document */

html, body, div, span,
applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dd, dl, dt, li, ol, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	line-height: 1;
	font-family: inherit;
	text-align: left;
	vertical-align: baseline;
}
a img, :link img, :visited img {
	border: 0;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
ol, ul {
	list-style: none;
}
q:before, q:after,
blockquote:before, blockquote:after {
	content: "";
}



body{
	margin: 0;
	padding: 0;
	width: 100%;
	background-color: #000;
	background-image: url(../images/background-image.jpg);
	background-repeat: no-repeat;
	background-position: top center;
}
/* Clearfix style - START - Forces Firefox to expand divs when content is bigger than initial height. Must be applied as a class to the divs needing it */
.clearfix:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility:hidden;
}
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* Clearfix style - END */


td, font, div{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 11px;
	line-height: 120%;
	color: #000;
}

a{
	color: #000;
	text-decoration: underline;
}

a:hover{
	text-decoration: underline;
}

h1{
	margin: 0;
	padding: 0;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 26px;
	line-height: 1.1em;
	margin-bottom: 0px;
	color: #000;
	font-weight: normal;
}
h2{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	line-height: 1em;
	margin-bottom: 11px;
	color: #b61a74;
	font-weight: bold;
}
h3{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	color: #333;
	font-weight: normal;
}
h4{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 16px;
	color: #FFF;
	line-height: 16px;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid #FFF;
	font-weight: normal;
}
h4 a{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 16px;
	color: #FFF;
	line-height: 16px;
	margin-bottom: 3px;
	font-weight: normal;
	text-decoration: none;
}
h5{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	color: #333;
	margin-bottom: 6px;
	font-weight: bold;
}

h6{
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	padding-top: 4px;
	padding-bottom: 0px;
	color: #333;
	font-weight: normal;
	font-style: italic;	
}

p{
	margin-bottom: 11px;
	line-height: 120%;
}
p em{
	font-style: italic;
}
.menuDivider{
	padding-top: 3px;
	padding-bottom: 3px;
	border-bottom: 1px solid #FFFFFF;
}
input{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	height: 18px;
}
ul{
	list-style-type: disc;
	margin-bottom: 10px;
}
li{
	list-style-position: outside;
	margin-left: 15px;
}
/* Main container styles - START - These are containers for the entire site design. Background is usually defined outside of these, and these contain the actual box of the main site. Usually the outer wrapper is just a box to properly position the site while the siteContainer keeps the main look of the box */

#wrapper{
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 970px;
	height: 100%;
	text-align: center;
	margin-top: 38px;
}
#leftContainer{
	float: left;
	display: inline;
	width: 770px;
	margin-bottom: 50px;
}
#rightContainer{
	float: left;
	display: inline;
	margin-left: 20px;
	width: 180px;
}
#player{
	float: left;
	margin-top: 23px;
}
#contentContainer{
	float: right;
	width: 622px;
	min-height: 900px;
	margin-left: 7px;
	display: inline;
}
#leftBarContainer{
	float: left;
	width: 141px;
}
#headerArea{
	float: left;
	width: 598px;
	height: 36px;
	padding-left: 12px;
	padding-right: 12px;
	padding-top: 182px;
	background-image: url(../images/header-bg.png);
	background-repeat: no-repeat;
	background-position: center;
	text-align: left;
}
#mainContentArea{
	float: left;
	width: 598px;
	padding-left: 12px;
	padding-right: 12px;
	padding-top: 15px;
	margin-bottom: 20px;
}
#articleListContainer{
	float: left;
	width: 622px;
}
.articleListItem{
	float: left;	
	width: 598px;
	margin-bottom: 20px;
	background-image: url(../images/extracontent-bg.png);
	background-repeat: repeat;
	padding-top: 20px;
	padding-left: 12px;
	padding-right: 12px;
}
.articleListItemContent{
	float: left;
	width: 598px;
	color: #FFF;
	margin-bottom: 15px;
}
.articleListItemContent table td, .articleListItemContent table td a{
	color: #FFF;
	padding-top: 10px;
	padding-bottom: 10px;
}
#imageListContainer{
	float: left;
	width: 598px;
	margin-bottom: 20px;
	background-image: url(../images/extracontent-bg.png);
	background-repeat: repeat;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 13px;
}	
.articleImageContainer{
	float: left;
	width: 175px;
	margin-right: 24px;
	margin-bottom: 24px;
	display: inline;
}
#leftBarLogo{
	float: left;
	width: 141px;
	margin-bottom: 32px;
}
#menuHeader{
	float: left;
	width: 141px;
	height: 16px;
	padding-top: 15px;
	padding-bottom: 12px;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-bottom: 20px;
}
/* Menu styles */
#menuContainer{
	float: left;
	width: 141px;
	text-align: left;
}
#menuContainer ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
	list-style-position: outside;
}
#menuContainer li{
	margin: 0;
	padding: 0;
	float: left;
	margin-bottom: 8px;
}
#menuContainer li a{
	float: left;
	color: #333;
	width: 141px;
	line-height: 120%;
	padding-bottom: 16px;
	border-bottom: 1px solid #FFF;
	text-decoration: none;
	font-size: 11px;
	font-weight: normal;
}
#menuContainer li a.selected{
	color: #000;		
}
.leftBarLinks{
	float: left;
	width: 141px;
	margin-top: 10px;
}
.leftBarLinks img{
}