/* common.css

Copyright 2009 Future Medium Pty Ltd

*/

body {
	margin: 0;
	padding: 0;
	font-size: 0.7em;
	font-family: arial, helvetica, sans-serif;
	color: #fff;
	background: url("../images/bg.jpg") no-repeat 50% 0 #0e1a24;
}

img {
	display: block;
}

a img {
	border: 0;
}

p {
	margin: 0 0 1em 0;
}


a {
	color: #fff;
	text-decoration: none;
}

a:hover {
	color: #FFF;
}

a:focus {
	border: 0;
	outline: 0;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	line-height: 1em;
}

ul, ol {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

ul li,
ol li {
	margin: 0;
	padding: 0;
}

form {
	display: inline;
}

embed,
object {
	display: block;
	z-index: 0;
	position: relative;
}

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

.wrapper {
	width: 984px;
	margin: 0 auto;
}

/* header */

#header {
	padding-top: 20px;
	margin-bottom: 48px;
}

.logo {
	margin-left: 70px;
	float: left;
}

.navigation {
	margin-top: 23px;
	float: right;
}

.navigation ul {
	
}

.navigation ul li {
	float: left;
	margin-left: 19px;
}

.branding {
	margin-left: 314px;
	position: relative;
	width: 355px;
}

	.back-to-home {
		position: absolute;
		top: -33px;
		right: 0;
	}


/* content */

#content {
	margin-top: 75px;
	width: 100%;
}


.panelContainer {
	
}

.panel {
	float: left;
}

#user_stories {
	width: 279px;
	position: relative;
}

#colors {
	width: 413px;
	margin: 0 6px;
}

#regions {
	width: 280px;
}

.panelContent {
	margin-top: 6px;
	background: #000;
}

#user_stories .panelContent {
	background: url("../images/user_stories_bg.gif") no-repeat top left;
	padding-top: 2px;
}

#colors .panelContent {
	background: #d2b289 url("../images/colors_bg.gif") no-repeat top left;
	padding-top: 3px;
	padding-bottom: 1px;
}

#regions .panelContent {
	padding: 2px;
	background: url("../images/region_bg.gif") no-repeat top left;
}

#blog {
	margin: 2px;
	margin-top: 0;
}

#blog .link-body {
	background: url("../images/blog_link_bg.jpg") no-repeat top left;
	width: 253px;
	height: 149px;
	display: block;
	padding: 11px;
}

#blog .link-body:hover {
	background-position: top right;
	color: #fff;
}

	.blog-content {
		display: block;
	}
	
		
		.blog-author {
			display: block;
			font-weight: bold;
			color: #010101;
		}
		
		.blog-title {
			display: block;
			margin-bottom: 4px;
			font-weight: bold;
		}
	

#supported-links {
	margin-top: 2px;
}

#flashStorySelector {
	height: 260px;
	position: relative;
}

#flashStorySelector img {
	position: absolute;
	top: 132px;
	left: 39px;
}

.panelHeading {
	margin-left: 10px;
	height: 44px;
	overflow: hidden;
	position: relative;
	text-indent: -10000px;
}

.panelHeading img {
	position: absolute;
	top: 0;
	left: 0;
}

.submitExperience {
	border-left: 3px solid #000;
	border-right: 3px solid #000;
	padding: 2px 5px;
	padding-top: 6px;
}

.submitExperience:hover {
	background: #a1ab2c;
} 

.submitExperience:hover a,
.submitExperience:hover a span {
	color: #fff;
}

.submitExperience .montage {
	float: right;
	margin-top: 5px;
	margin-left: 5px;
}

.submitExperience a span {
	color: #a1ab2c;
}

.submitExperience .panelSubHeading {
	height: 14px;
	width: 137px;
	overflow: hidden;
	position: relative;
	margin-bottom: 7px;
	text-indent: -10000px;
}

.submitExperience .panelSubHeading img {
	position: absolute;
	top: 0;
	left: 0;
}

#flashExperienceSelector {
	height: 344px;
	position: relative;
}

#flashExperienceSelector img {
	position: absolute;
	top: 132px;
	left: 107px;
}

/* region Selector */

.regionSelector {
	
}

#regions {
	position: relative;
}

.regionSelector li {
	margin-bottom: 1px;
}

.regionSelector .last { 
	margin-bottom: 0;
}

.regionSelector li a {
	display: block;
	width: 274px;
	height: 66px;
	padding: 1px;
	color: #fff;
	background: #000 url("../images/region_arrow.gif") no-repeat top left;
}

.regionSelector li a:hover {
	background: #a1ab2c url("../images/region_arrow_hover.gif") no-repeat top left;
	color: #fff;
}

.regionSelector .image {
	float: left;
	cursor: pointer;
}

.regionSelector .title {
	float: right;
	width: 198px;
	margin: 3px 0;
	cursor: pointer;
}

.regionSelector .blurb {
	float: right;
	width: 173px;
	padding-right: 25px;
	cursor: pointer;
}

/* episode guide */

.leftCol {
	float: left;
	width: 279px;
}
.middleleftCol {
	float: left;
	width: 336px;
}
.middlerightCol {
	float: right;
	width: 336px;
}
.rightCol {
	float: right;
	width: 699px;
}

#episode-guide {
	background: url("../images/episode_panel_bg.gif") no-repeat top left;
	padding: 2px;
}

.episode-list {
	background: url("../images/episode_selection_bg.gif") no-repeat top left;
	padding: 5px 6px;
	padding-top: 21px;
}

.episode-list ul li {
	display: block;
	padding-top: 1px;
}

.episode-list ul li a {
	display: block;
	padding: 0 10px;
	padding-top: 13px;
	width: 243px;
	height: 26px;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	background: url("../images/episode_selection_nav.gif") no-repeat top left;
}

.episode-list ul li a:hover,
.episode-list ul li .current {
	background-position: bottom left;
}

#advertising-panel {
	margin-top: 20px;
}

.advert.hideAd {
	display: none;
}

.advert.showAd {
	display: block;
}

.advert {
	margin: 2px 0;
	margin-top: 0;
	background: url("../images/advert_bg.gif") no-repeat top left;
	padding: 2px;
}
.advertDP{
	margin: 2px 0;
	margin-top: 0;
	background: url("../images/advert_bg_dp.gif") no-repeat top left;
	padding: 2px;
}
.advert .link-body {
	width: 275px;
	display: block;
}

.advert .link-body:hover {
	color: #fff;
}

	.advert-content {
		background: #769fc1;
		padding: 4px;
		margin-bottom: 1px;
		display: block;
	}
	
	.link-body:hover .advert-content {
		background: #19355f;
	}
	
		.advert-image {
			float: left;
			margin-right: 9px;
		}
		
		.advert-addition {
			display: block;
			margin-top: 4px;
			font-weight: bold;
			color: #fff;
		}
		
		.advert-title {
			display: block;
			margin-bottom: 4px;
			font-weight: bold;
			color: #010101;
		}
		
		.advert .link-body:hover .advert-title {
			color: #fff;
		}
	
	.advert-link {
		background: #769fc1 url("../images/icon_advert_arrow_off.gif") no-repeat 246px 10px;
		padding: 6px;
		height: 27px;
		display: block;
	}
	
	.link-body:hover .advert-link {
		background: #19355f url("../images/icon_advert_arrow_on.gif") no-repeat 246px 10px;
	}
	
/* main content panes */

.episode-panel {
	background: #efd2a8 url("../images/master_content_bg.gif") no-repeat top left;
	margin-bottom: 6px;
	padding: 2px;
}

.video-player-container {
	float: left;
	width: 480px;
}

.episode-segments {
	background: url("../images/segment_bg.gif") no-repeat top left;
	float: right;
	width: 203px;
	height: 316px;
	padding: 5px;
}

.segment-title {
	background: url("../images/video_segment_bg.gif") no-repeat top left;
	font-weight: bold;
	padding: 0 10px;
	padding-top: 14px;
	height: 25px;
	margin-top: 3px;
}

.segments li {
	margin-top: 1px;
}

.segments li a {
	padding: 5px;
	padding-left: 20px;
	display: block;
	color: #19355f;
	background: #fff url("../images/icon_segment_arrow.gif") no-repeat 10px 10px;
}	

.segments li a:hover {
	background: #19355f url("../images/icon_segment_arrow_hover.gif") no-repeat 10px 10px;
	color: #fff;
}

.showNode1 #node1 a,
.showNode2 #node2 a,
.showNode3 #node3 a,
.showNode4 #node4 a,
.showNode5 #node5 a, 
.showNode6 #node6 a,
.showNode7 #node7 a,
.showNode8 #node8 a,
.showNode9 #node9 a,
.showNode10 #node10 a {
	background: #19355f url("../images/icon_segment_arrow_hover.gif") no-repeat 10px 10px;
	color: #fff;
}


.advert-banner-panel {
	background: #efd2a8 url("../images/master_content_bg.gif") no-repeat top left;
	padding: 10px;
	margin-bottom: 6px;
}

.episode-summary-panel {
	background: #efd2a8 url("../images/master_content_bg.gif") no-repeat top left;
	padding: 10px;
	padding-bottom: 0;
}

	.episode-summary {
		color: #000;
		font-size: 1.1em;
		border-top: 1px solid #8c7355;
		margin-top: 2px;
		padding: 10px 0;
	}
	
		.episode-summary-image {
			float: left;
			border: 1px solid #8c7355;
			margin-right: 10px;
		}
	
		.episode-summary-article {
			float: right;
			width: 560px;
		}
		
			.episode-summary-article h3 {
				font-size: 1.2em;
			}
			
		
	
			.external-provider-link {
				padding-left: 10px;
				float:left;
				background: url("../images/icon_external_link_arrow.gif") no-repeat 0 5px;
			}
	
			.external-provider-link a {
				color: #19345e;
			}
		
			.external-provider-link a:hover {
				background: #19345e;
				color: #fff;
			}
		
			.external-site-link {
				padding-left: 10px;
				float:right;
				background: url("../images/icon_external_link_arrow.gif") no-repeat 0 5px;
			}
	
			.external-site-link a {
				color: #19345e;
			}
		
			.external-site-link a:hover {
				background: #19345e;
				color: #fff;
			}

/* supported by */

#sponsors {
	width: 100%;
	padding-top: 25px;
	padding-right: 0;
	padding-bottom: 25px;
	padding-left: 0;
}


#sponsors .wrapper {
	position: relative;
}

#sponsors ul {
margin: 0;
}

#sponsors ul li {
	float: left;
}

#sponsors #sponsor_middle {
	margin: 0 6px;
}

.rightCol #sponsors {
	padding: 34px 0 ;
	width: 699px;
}

.rightCol #sponsors .wrapper {
	width: 699px;
	margin: 0;
}

.rightCol #sponsors #sponsor_middle {
	margin-left: 0;
}

/* footer */

#footer {
	border-top: 1px solid #3e4850;
	position: relative;
	padding-top: 25px;
	padding-right: 0;
	padding-bottom: 20px;
	padding-left: 0;
}

#footer .wrapper {
	position: relative;
}

.footer_links {
	float: left;
	width: 500px;
}

.footer_links ul {
	margin-bottom: 13px;
}

.footer_links ul li {
	float: left;
	margin-right: 7px;
}

.footer_links p {
	font-size: 0.9em;
	margin-bottom: 3px;
}

.footer_logo {
	float: right;
	width: 250px;
	text-align: right;
}

.footer_logo img {
	float: right;
	margin: 7px 0;
}

.footer_logo p {
	clear: right;
	font-size: 0.9em;
}