/* content-billboard-slider.css */

		#content-slider-container { 
			width: 990px; position:absolute; top:8px; margin: 0; padding:0; background:#0F0; 
		}

/* -------------------------------------------*/
/* ---------->>> Setup Values <<<-------------*/
/* -------------------------------------------*/
		#slider {
			width: 990px;
			height:420px;
			list-style: none;
			background:#000;
			overflow-y: auto;								/* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
			overflow-x: hidden;								/* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
		}
		.anythingBase { max-width: 32766px; }				/* Opera width restriction */


/***********************
  COMMON SLIDER STYLING
 ***********************/
/* Overall Wrapper: 45px right & left padding for the arrows, 28px @ bottom for navigation */
div.anythingSlider {
	display: block;
	margin: 0 auto;
	overflow: visible !important; /* needed for Opera and Safari */
	position: relative;
	padding: 0 0 0 0;
}
/* anythingSlider viewport window */
div.anythingSlider .anythingWindow {
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 100%;
}
/* anythingSlider base (original element) */
.anythingBase {
	background: transparent;
	list-style: none;
	position: absolute;
	overflow: visible !important;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
}
/* all panels inside the slider */
.anythingBase .panel {
	background: transparent;
	display: block;
	overflow: hidden;
	float: left;
	padding: 0;
	margin: 0;
}
.anythingBase .panel.vertical {
	float: none;
}

/* Navigation Arrows */
div.anythingSlider .arrow {
	top: 50%;
	position: absolute;
	display: none;
}
div.anythingSlider .arrow a {
	display: block;
	height: 140px;
	margin: -70px 0 0 0; /* half height of image */
	width: 45px;
	text-align: center;
	outline: 0;
	background: url(../images/default.png) no-repeat;
}
/* hide text, target the span so IE7 doesn't text-indent the link */
div.anythingSlider .arrow a span { display: block; text-indent: -9999px; }

/* back arrow */
div.anythingSlider .back { left: 0; }
div.anythingSlider .back a { background-position: left top; }
div.anythingSlider .back a:hover, div.anythingSlider .back a.hover { background-position: left -140px; }
div.anythingSlider .back.disabled { display: none; } /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */

/* forward arrow */
div.anythingSlider .forward { right: 0; }
div.anythingSlider .forward a { background-position: right top; }
div.anythingSlider .forward a:hover, div.anythingSlider .forward a.hover { background-position: right -140px; }
div.anythingSlider .forward.disabled { display: none; } /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */

/* navigation css */
#nav { width:970px; height:100px; margin:0 0 0 0; padding:0 20px 0 0; position:absolute; bottom:0px; background:url(../img/content_billboard_bottom_bkgd.png) no-repeat bottom; }
#nav ul {position:absolute; right:10px;}
#nav li { list-style:none; float:left; }
#nav a { width:13px; height:13px; display: inline-block; padding:0; margin: 0 3px 0 3px; background: url(../img/billboard_control.png) left no-repeat; text-align:center; text-indent:-9999px;}
#nav a:hover { background: url(../img/billboard_control_hover.png) center no-repeat; }
#nav a.cur { background: url(../img/billboard_control_active.png) right no-repeat;  }
#nav a.start-stop { visibility:hidden; position:absolute; }
#nav a.start-stop.playing { visibility:hidden; }

/* This CSS is needed for the fading transition */ 
#slider .panel { opacity: 0; position: relative;  }
#slider .panel.activePage { opacity: 1; } /* make sure active panel is visible */

/* Captions */
#caption-container {
	width:990px;
	height:98px;
	background: url(../img/content_billboard_description_bkgd.png) repeat;
	position:absolute;
	bottom:0px;	
}
.caption { display: none; }
#current-caption { width: 800px; margin:25px 0 0 20px; text-align: left; color:#FFF; font-size:14px;}