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

body {
	background-image:url(images/fbbg.gif);
	background-repeat: repeat;
	width: 1010px;
	/*height: 725px; This is unnecessary */
	margin: 10px auto;
	overflow-y: hidden;
}

a {
    font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: 000;
}

img {
    outline: none;
	border: none;
	}

a:hover {
	color: #394583;
}

p {
    font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	}
	
h4 {
    font-family: Arial, Helvetica, sans-serif;
	} 
	
	span {
	font-family: Arial, Helvetica, sans-serif;
	}

	<style>
	.item {
	margin: 5px;
	padding: 10px;
	}
	</style>
	<![EndIf]>
	

/* index screen browser detect */

	#indexbox1 {
	width: 200px;
	height: 200px;
	outline: none;
	margin: 10%;
	}

	#indexbox2 {
	width: 200px;
	height: 200px;
	outline: none;
	margin: 10%;
	}


/* background image divs */

	#header {
	/*background-image:url(images/header.png); This is only necessary if head isn't img, other styles added */
	width: 659px;
	height: 316px;
	outline: none;
	}
	
	/*
	#headerlink {
	background-image:url(images/header.png);
	width: 659px;
	height: 316px;
	outline: none;
	}*/
	
	#rightside {
	width: 341px;
	height: auto; 
	float: left;
	}
	
	#leftside {
	height: auto;
	width: 659px;
	float: left;
	}
	
	/* cast button w/rollover */
	
	#castbtnlink {
	background-image:url(images/cast_btn.png);
	width: 341px;
	height: 70px;
	outline: none;
	background-repeat: no-repeat;
	}
	
	a#castbtnlink1 {
	display: block;
	background-image:url(images/cast_btn.png);
	width: 341px;
	height: 70px;
	outline: none;
	background-repeat: no-repeat;
	}
	
	a#castbtnlink1:hover {
	background-image: url(images/cast_btn_RO.png);
	width: 341px;
	height: 70px;
	}
	
	#castbtnlinkon {
	width: 341px;
	height: 70px;
	outline: none;
	}
	
	/* merch button w/rollover */
	
	#merchbtnlink {
	background-image:;
	width: 341px;
	height: 42px;
	}
	
	a#merchbtnlink1 {
	display: block;
	background-image:url(images/merch_btn.png);
	width: 340px;
	height: 42px;
	outline: none;
	}
	
	a#merchbtnlink1:hover {
	background-image:url(images/merch_btn_RO.png);
	width: 340px;
	height: 42px;
	}
	
	#merchbtnlinkon {
	width: 340px;
	height: 42px;
	outline: none;
	}
	
	/* episodes button w/rollover */
	
	#episodesbtnlink {
	background-image:url(images/episodes_btn.png);
	width: 341px;
	height: 40px;
	}
	
	a#episodesbtnlink1 {
	display: block;
	background-image:url(images/episodes_btn.png);
	width: 341px;
	height: 40px;
	outline: none;
	}
	
	a#episodesbtnlink1:hover {
	background-image:url(images/episodes_btn_RO.png);
	width: 341px;
	height: 40px;
	}
	
	#episodesbtnlinkon {
	width: 341px;
	height: 40px;
	outline: none;
	}
	
	/* xtras button w/rollover */
	
	#extrasbtnlink {
	background-image:url(images/extras_btn.png);
	width: 341px;
	height: 40px;
	}
	
	a#extrasbtnlink1 {
	display: block;
	background-image:url(images/extras_btn.png);
	width: 341px;
	height: 40px;
	outline: none;
	}
	
	a#extrasbtnlink1:hover {
	background-image: url(images/extras_btnRO.png);
	width: 341px;
	height: 40px;
	}
	
	#extrasbtnlinkon {
	width: 341px;
	height: 40px;
	outline: none;
	}
	
	/* blog button w/rollover */
	
	#blogbtnlink {
	background-image:url(images/blog_btn.png);
	width: 341px;
	height: 44px;
	}
	
	a#blogbtnlink1 {
	display: block;
	background-image:url(images/blog_btn.png);
	width: 341px;
	height: 44px;
	outline: none;
	}
	
	a#blogbtnlink1:hover {
	background-image: url(images/blog_btnROCS.png);
	width: 341px;
	height: 44px;
	}
	
	#blogbtnlinkon {
	width: 341px;
	height: 44px;
	outline: none;
	}
	
	/* contact button w/rollover */
	
	#contactbtnlink {
	background-image:url(images/contact_btn.png);
	width: 341px;
	height: 40px;
	}
	
	a#contactbtnlink1 {
	display: block;
	background-image:url(images/contact_btn.png);
	width: 341px;
	height: 40px;
	outline: none;
	}
	
	a#contactbtnlink1:hover {
	background-image:url(images/contact_btn_RO.png);
	width: 341px;
	height: 40px;
	}
	
	#contactbtnlinkon {
	width: 341px;
	height: 40px;
	outline: none;
	}
	
	/* info box with paper */
	
	#paperbglink {
	background-image:url(images/infobox.png);
	width: 341px;
	height: 472px;
	outline: none;
	repeat: none;
	}
	
	#infoboxlink {
	width: 300px;
	height: 350px;
	outline: none;
	padding-top: 10px;
	padding-left: 20px;
	font-size: 14px;
	margin-top: 85px;
	}
	
	#topblanklink {
	background-image:url(images/topblank.png);
	width: 810px;
	height: 253px;
	float: left;
	outline: none;
	}	
	
	#castboxlink {
	width: 335px;
	height: 400px;
	outline: none;
	padding-top: 80px;
	padding-left: 25px;
	}
	
	/* director and producer links */
	
	#directorbox {
	width: 50px;
	height: 70px;
	padding-top: 15px;
	}
	
	#directorbtnlink {
	background-image:url(images/director.png);
	width: 100px;
	height: 20px;
	float: left;
	}
	
	a#directorbtnlink1 {
	display: block;
	background-image:url(images/director.png);
	width: 150px;
	height: 20px;
	outline: none;
	}
	
	a#directorbtnlink1:hover {
	background-image:url(images/director_RO.png);
	width: 150px;
	height: 20px;
	}
	
	#directorbtnlinkon {
	width: 150px;
	height: 20px;
	float: left;
	outline: none;
	}
	
	#producerbtnlink {
	background-image:url(images/producer.png);
	width: 100px;
	height: 20px;
	float: left;
	}
	
	a#producerbtnlink1 {
	display: block;
	background-image:url(images/producer.png);
	width: 150px;
	height: 20px;
	outline: none;
	}
	
	a#producerbtnlink1:hover {
	background-image:url(images/producer_RO.png);
	width: 150px;
	height: 20px;
	}
	
	#producerbtnlinkon {
	width: 220px;
	height: 20px;
	float: left;
	outline: none;
	}
	
	/*charter div holder */
	
	#picholderlink {
	background-image:url(images/topblank.png);
	width: 810px;
	height: 150px;
	padding-left: 5px;
	padding-top: 60px;
	float: left;
	outline: none;
	}
	
	/* Jon's picture */
	
	#jonbtnlinkon {
	background-image:url(images/jonmeyer.png);
	width: 120px;
	height: 113px;
	float: left;
	}
	
	/* Paul's picture */
	
	#paulbtnlinkon {
	background-image:url(images/paul.png);
	width: 120px;
	height: 113px;
	float: left;
	}
	
	/* brad picture button w/rollover */
	
	#bradbtnlink {
	background-image:url(images/brad_btn.png);
	width: 120px;
	height: 113px;
	float: left;
	}
	
	a#bradbtnlink1 {
	display: block;
	background-image:url(images/brad_btn.png);
	width: 120px;
	height: 113px;
	outline: none;
	}
	
	a#bradbtnlink1:hover {
	background-image:url(images/brad_btn_RO.png);
	width: 120px;
	height: 113px;
	}
	
	#bradbtnlinkon {
	background-image:url(images/brad_btn_RO.png);
	width: 120px;
	height: 113px;
	float: left;
	}
	
	/* oliver picture button w/rollover */
	
	#oliverbtnlink {
	background-image:url(images/oliver_btn.png);
	width: 120px;
	height: 113px;
	float: left;
	}
	
	a#oliverbtnlink1 {
	display: block;
	background-image:url(images/oliver_btn.png);
	width: 120px;
	height: 113px;
	outline: none;
	}
	
	a#oliverbtnlink1:hover {
	background-image:url(images/oliver_btn_RO.png);
	width: 120px;
	height: 113px;
	}
	
	/* trevor picture button w/rollover */
	
	#trevorbtnlink {
	background-image:url(images/trevor_btn.png);
	width: 120px;
	height: 113px;
	float: left;
	}
	
	a#trevorbtnlink1 {
	display: block;
	background-image:url(images/trevor_btn.png);
	width: 120px;
	height: 113px;
	outline: none;
	}
	
	a#trevorbtnlink1:hover {
	background-image:url(images/trevor_btn_RO.png);
	width: 120px;
	height: 113px;
	}
	
	/* charlie picture button w/rollover */
	
	#charliebtnlink {
	background-image:url(images/charlie_btn.png);
	width: 120px;
	height: 113px;
	float: left;
	}
	
	a#charliebtnlink1 {
	display: block;
	background-image:url(images/charlie_btn.png);
	width: 120px;
	height: 113px;
	outline: none;
	}
	
	a#charliebtnlink1:hover {
	background-image:url(images/charlie_btn_RO.png);
	width: 120px;
	height: 113px;
	}
	
	/* gene picture button w/rollover */
	
	#genebtnlink {
	background-image:url(images/gene_btn.png);
	width: 120px;
	height: 113px;
	float: left;
	}
	
	a#genebtnlink1 {
	display: block;
	background-image:url(images/gene_btn.png);
	width: 120px;
	height: 113px;
	outline: none;
	}
	
	a#genebtnlink1:hover {
	background-image:url(images/gene_btn_RO.png);
	width: 120px;
	height: 113px;
	}

	
	/* where the video player will go */
	
	#videobglink {
	background-image:url(images/videobox.gif);
	width: 659px;
	height: 433px;
	background-repeat: no-repeat;
	padding: 0px;
	margin: 0px;
	}
	
	#videobglinkdark {
	background-image: url(images/videoboxdark.gif);
	width: 659px;
	height: 433px;
	background-repeat: no-repeat;
	padding: 0px;
	margin: 0px;
	}
	
	#videobox {
	width: 560px;
	height: 340px;
	/*z-index: 5; This is unnecessary */
	padding-top: 25px;
	padding-left: 50px;
	}
	
	#buttonholder {
	float: left;
	width: 610px;
	height: 30px;
	padding-top: 5px;
	}
	
	/* paper background image */
	
	.infobox { /*this needs to be a CLASS and not an ID to prevent text overflow on IE*/
	background-image:url(images/infobox.gif);
	width: 341px;
	height: 514px;
	background-repeat: none;
	}
	
	/* content for paper background */
	
	.blank {
	width: 300px; /*needs to stay at 340 or less or ie breaks*/
	height: 40px;
	}
	
	.bio {
	font-size: 14px;	
	font-spacing: .5em;
	width: 250px;
	height: 350px;
	margin: 8%;
	}
	
	.epdesc {
	width: 250px;
	height: 105px;
	}
	
	/* Bio Descriptions */
	
	.biobox {
	float: left;
	width: 560px;
	height: 338px;
	color: #eee;
	/*background-color: #fff; alternate */
	border: 1px solid #111;
	}
	
	.bioboxtext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	margin: 10px;  
	}
	
	.bioboxtext a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;  
	color: #eee; 
	}
	
	.bioboxtext a:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;  
	color: #5965a3; 
	}
	
	.bioboxhead {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 0.4em;
	margin: 10px;
	}
	
	.bioboxhead a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;  
	color: #eee; 
	}
	
	.bioboxhead a:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;  
	color: #5965a3; 
	}
	
	.biobox td {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;  
	color: #eee;
	}