/**********************************************************************************************

	Title: Website
	Author: XHTMLized
	Date: October 2007 

***********************************************************************************************

	1.  GENERAL
			1.1 Headings and paragraphs
			1.2 Forms
			1.3 Links
			1.4 Miscellaneous
		
	2. GENERAL ELEMEMENTS
	
	3. LAYOUT
			3.1 Accessibility menu
			3.2 Header
			3.3 Content
			3.4 Secondary content
			3.5 Sidebar
			3.6 Footer
		
	4. LAYOUT ELEMENTS

***********************************************************************************************/


/* 1. GENERAL
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

/* Global reset */
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, 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: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

body {
	line-height: 1; }	
	
ol, ul {
	list-style: none; }
	
table {
	border-collapse: separate; 
	border-spacing: 0;  /* tables still need 'cellspacing="0"' in the markup */
}

caption, th, td {
	text-align: left; 
	font-weight: normal;
}

body {
	background:#000 url(../images/bg.jpg) bottom center no-repeat;
	color:#fff;
	line-height:15px;
	font-family: 'Myriad Pro', 'Lucida Grande', Lucida Sans, Arial, Helvetica, sans-serif;
	font-size: 62.5%; /* 1em = 10px \ 1.1em = 11px \ 1.2em = 12px */
	text-align: center;
}
body.band {
	background:#000 url(../images/band-bg.jpg) bottom center no-repeat;}


/* 1.2	Forms
-----------------------------------------------------------------------------------------------*/	

input, textarea, select {
	font: 1.1em Arial, Helvetica, sans-serif;
}


/* 1.3	Links
-----------------------------------------------------------------------------------------------*/	

a,
a:hover{
	color: #fff;
	text-decoration: underline;
}

/* 1.4	Miscellaneous
-----------------------------------------------------------------------------------------------*/	

hr { 
	display: none; }
		
strong {
	font-weight: bold; }
		
em {
	font-style: italic; }
	
abbr, acronym {
	border-bottom: 1px dotted #999; 
	cursor: help;
}


/* 2. GENERAL ELEMENTS
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

.hide {
	position: absolute;
	left: -9999px;
}

.clear {
	clear: both;
	font-size: 0;
	height: 0;
	line-height: 0;
	overflow: hidden;
}

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

.clearfix {
	display: inline-block; }
	
/* Hides from IE-mac \*/ 
* html .clearfix {
	height: 1%; }

.clearfix {
	display: block; }
/* End hide from IE-mac */


/* 3. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

.container {
	width: 800px;
	position: relative;
	margin: 0 auto;
	text-align: left;
	border-width:0 1px }
	
.band .container {
	background: #000 url(../images/band-bg-header.jpg) no-repeat }	

#header{
	width:800px;
	height:348px;
	background:#000;
	position:relative }
	

#header {
	background:url(../images/bg-header_main.jpg) no-repeat }	
	
.band #home #header {
	background: none }	


/* 3.1	Accessibility menu
-----------------------------------------------------------------------------------------------*/	

#accessibility-menu {
	position: absolute;
	left: -1000em;
	text-align: left;
}


/* 3.2	Header
-----------------------------------------------------------------------------------------------*/	
#header h1,
#header h1 span{
	position:relative;
	width:227px;
	height:82px;
	display:block;
	overflow:hidden;
	cursor:pointer }
	
	#header h1 span{
		position:absolute;
		top:0;
		left:0;
		background: url(../images/logo.jpg) no-repeat }
		
	.band #header h1 span{
		background: url(../images/band-logo.jpg) no-repeat }

#navigation{
	width:800px;
	background:#000;
	overflow:hidden;
	position:absolute;
	bottom:9px;
	filter: alpha(opacity=50);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
	-moz-opacity: 0.50; 
	opacity:0.5;
	border-width:1px 0 }
	
	#navigation ul{
		float:right;
		padding:8px 0 }
		
	#navigation li{
		float:left;
		border-right:2px solid #fff }
		
		#navigation li.last{
			border:0}
		
		#navigation li a{
			width:auto;
			font-size:1.5em;
			padding:0 5px;
			display:block;
			font-weight:bold;
			text-decoration:none;
			text-transform:lowercase }
			
		#navigation li a:hover{
			text-decoration:underline }	

/* 3.3	Content
-----------------------------------------------------------------------------------------------*/	

#headline{
	width:800px;
	height:122px;
	background:#000 url(../images/bg-headline_main.jpg) no-repeat }
	
	#headline h2,
	#headline p{
		padding-left:120px;
		padding-top:25px;
		padding-right:50px }
		
	#headline p{
		padding-top:0;
		font-size:1.3em;
		line-height:18px }
		
	#headline h2{
		font-size:3em;
		line-height:35px }	

#content-gradient{
	overflow:hidden;
	width:800px;
	min-height:427px;
	height:auto;
	background: url(../images/bg_content-gradient.jpg) bottom left no-repeat }

#pages #content-gradient{
	background:#000 url(../images/bg_content-gradient-noborder.jpg) top left no-repeat; }
	
#content-gradient .box{
	background:#000;
	border:1px solid #999;
	border-width:0 1px 1px;
	overflow:hidden;
	margin-bottom:10px;
	padding-bottom:10px }
	
.col-left,
.col-right{
	width:383px;
	float:left;
	overflow:hidden;
	margin-right:16px }
	
.col-right{
	float:right }
	
	.col-left .box{
		margin-left:20px }
		
	.col-right .box{
		margin-right:2px }
			
	.col-left h3,
	.col-right h3{
		padding:16px 15px 20px 15px;
		text-transform:uppercase;
		font-size:1.8em;
		font-weight:bold;
		background:url(../images/bg-red.jpg) left top no-repeat }

	.col-left .redblack h3,
	.col-right .redblack h3{
		background:url(../images/bg-redblack.jpg) left top no-repeat }
	
	.col-left ul,
	.col-left p,
	.col-right ul,
	.col-right p,
	.col-right blockquote{
		padding:0 20px 0 15px;
		font-size:1.3em;
		line-height:18px	 }

	.col-left p,
	.col-right p{ padding-bottom:10px }
		
	.col-left li{
		padding-bottom:15px }	
	
	.col-left li p,
	.col-right li p{
		font-size:1em;
		padding:0 }
	
	.col-right li{
		line-height:18px;
		padding-bottom:15px;
		padding-right:10px }
		
		.col-right li small{
			font-size:10px; }
	
	.col-right blockquote p{
		line-height:18px;
		font-style:italic;
		padding:0;
		font-size:1em }
	
	.col-right li p{
		padding:0 }
			
	.col-right blockquote p.testisource{
		text-align:right;
		padding-top:15px }		
				
				
/* band content */
.band-content-wrapper{
	background: url(../images/band-bg-content.gif) top repeat-x;
	padding-bottom: 20px;
	margin: 0 9px 0 11px;
	width: 780px;
	overflow: hidden;
}

	.band-col-left{
		float: left;
		width: 446px;
		padding: 9px 0 0 10px;
	}
		#band-description{
			padding: 10px 15px 10px 20px;
			border: 1px solid #c4d4e1;
			border-width: 1px 1px 0 1px;
			background: #363737 url(../images/band-bg-description.gif) repeat-x bottom;
		}
			#band-description h2{
				font-size: 3em;
				font-weight: bold;
				line-height: 1em;
				padding-bottom: 10px;
			}
			#band-description p{
				font-size: 1.4em;
				padding-bottom: 15px;
			}
		
		#band-transcript{
			padding: 20px 15px 10px 20px;
			background: #040404 url(../images/band-bg-transcript.gif) no-repeat top;
		}
			#band-transcript h4{
				font-size: 1.4em;
				padding-bottom: 20px;
			}
			#band-transcript p{
				font-size: 1.4em;
				padding-bottom:15px;
				line-height: 18px;
			}
		
		#band-quote{
			background: url(../images/band-bg-quote.gif) no-repeat top;
		}
			#band-quote blockquote{
				padding: 20px 15px 33px 20px;
				background: url(../images/band-bg-quote_bottom.gif) bottom no-repeat;
			}
			#band-quote .quote{
				font-family: Georgia, "Times New Roman", Times, serif;
				font-weight: bold;
				font-size: 1.7em;
				line-height: 1.3em;
			}
			#band-quote .author{
				text-align: right;
				padding: 5px 10px 0 0;
				font-family: Georgia, "Times New Roman", Times, serif;
				font-size: 14px;
			}
		
		#band-links{
			padding: 5px 15px 20px 20px;
			background: url(../images/band-bg-links.gif) no-repeat 6px bottom;
		}
			#band-links li,
			#band-links p{
				font-size: 1.4em;
				padding-bottom: 10px;
			}
			#band-links h4{
				font-size: 1.4em;
				padding: 20px 0 10px;
			}
		
		
	.band-col-right{
		float: right;
		width: 324px;
	}

.red{ color: #f00}


/* 3.6	Footer
-----------------------------------------------------------------------------------------------*/	
#footer{
	width:765px;
	height:98px;
	background:#000 url(../images/bg-footer.jpg) left no-repeat;
	clear:both;
	padding:0 0 0 35px;
	
 }

	#pages #footer {
		height:97px }
			
	.band #footer{
		background:#000 url(../images/band-bg-footer.jpg) left no-repeat;}
		
	#footer .foot-nav{
		padding:20px 20px 0 0;
		font-size:1.2em;
		line-height:17px;
		display:block;
		font-family:Georgia, "Times New Roman", Times, serif;
		float:left;
		width:150px;
		text-transform:lowercase }
		
		#footer .foot-nav h4{
			text-transform:none;
			color:#990000;
			font-size:1.1em }	
		
	#footer #newest-podcasts{
		width:400px;
		text-transform:none }	
		
		#footer .foot-nav a{
			text-decoration:none }
			
		#footer .foot-nav a:hover{
			text-decoration:underline }	


/* 4. LAYOUT ELEMENTS
-----------------------------------------------------------------------------------------------
===============================================================================================*/	


