/*

vRAD Slideshow Stylesheet
version: 01
date: 06.17.09
author: Page 10

*/



/* STRUCTURE
___________________________________________*/

#headerScrollFeature {
	width:630px;
	height:400px;
	background:url(../images/scrollingfeature/background-1.jpg) no-repeat;
	position:relative;
	}

.thumbs {
	position:absolute;
	bottom:0;
	left:0;
	width: 328px;
	height:100px;
	margin-left:10px;
	overflow:hidden;
	}

.thumbs ul {
	list-style:none;
	padding:0;
	margin:5px 0 0 0;
	}

.thumbs li {
	float:left;
	padding-top:4px;
	background:url(../images/scrollingfeature/thumb-background.png) no-repeat;
	width:105px;
	height:85px;
	padding-left:4px;
	position:relative;
	}

.thumbs img {
	position:absolute;
	top:20px;
	left:4px;
	} 

.thumbs li a {
	background-image:url(../images/scrollingfeature/thumb-1.jpg);
	}

.feature-overlay {
	width:630px;
	height:400px;
	background:url(../images/scrollingfeature/background-1.jpg) no-repeat;
	position:absolute;
	top:0;
	left:0;
	}


/* THUMBNAIL LINKS
___________________________________________*/
.thumbs a, .thumbs a:visited {
	font-family:Arial;
	color:#a7cc75;
	font-size:12px;
	font-weight:bold;
	text-decoration:none;
	display:block;
	width:95px;
	height:77px;
	background:no-repeat bottom left;
	}
	
.thumbs a:hover {
	color: #3d4b2b;
	}


/* THUMBNAIL IMAGES
___________________________________________*/
#feature-1 { background-image:url(../images/scrollingfeature/thumb-1.jpg); }

#feature-2 { background-image:url(../images/scrollingfeature/thumb-2.jpg); }

#feature-3 { background-image:url(../images/scrollingfeature/thumb-3.jpg); }


/* LARGE IMAGES
___________________________________________*/
.feature-1 { background-image:url(../images/scrollingfeature/background-1.jpg)!important; }
.feature-1 #header-1 { display:block; }
.feature-1 #header-2, .feature-2 #header-3 { display:none; }

.feature-2 { background-image:url(../images/scrollingfeature/background-2.jpg)!important; }
.feature-2 #header-2 { display:block; }
.feature-2 #header-1, .feature-2 #header-3 { display:none; }

.feature-3 { background-image:url(../images/scrollingfeature/background-3.jpg)!important; }
.feature-3 #header-3 { display:block; }
.feature-3 #header-1, .feature-3 #header-2 { display:none; }


/* HEADLINES
___________________________________________*/
#headerScrollFeature h2 {
	font: normal 30px Arial;
	color: #707070;
	position: absolute;
	top: 100px;
	left: 60px;
	width: 300px;
	text-align: left;
}

#header-2, #header-3 { display:none; }