/*******************************************************************************
=CAROUSEL
*******************************************************************************/
div.carousel {
	position:relative;
}

/*
 Fonts
*/
div.carousel div.promo a {
	text-decoration:none;
} div.carousel div.promo a:hover {
	text-decoration:underline;
}

/*
 Carousel controls
*/
div.carousel div.controls {
	clear:both;
	height:20px;
	margin-top:1.5em;
	overflow:hidden;
} div.carousel div.controls ul {
	list-style:none;
	margin-bottom:0;
	margin-top:-20px; /* animated 20 to zero after panels load */
	padding-left:0;
} div.carousel div.controls li {
	float:left;
	height:20px;
} div.carousel div.controls li a {
	background:url("//g.foolcdn.com/img/sprite_carousel.gif") no-repeat;
	display:block;
	height:100%;
	text-indent:-9999px;
	text-decoration:none;
}


/*
 Carousel control button styling
*/
div.carousel div.controls li.btnPrevious,
div.carousel div.controls li.btnNext {
	width:20px;
} div.carousel div.controls li.btnPages {
	padding:0 5px;
}

/* previous button */
div.carousel div.controls li.btnPrevious a {
	background-position:0 0;
} div.carousel div.controls li.btnPrevious a:hover {
	background-position:0 -20px;
} div.carousel div.controls li.btnPrevious a:active {
	background-position:0 -40px;
}

/* next button */
div.carousel div.controls li.btnNext a {
	background-position:-20px 0;
} div.carousel div.controls li.btnNext a:hover {
	background-position:-20px -20px;
} div.carousel div.controls li.btnNext a:active {
	background-position:-20px -40px;
}

/* page bullet buttons */
div.carousel div.controls li.btnPages a {
	background-position:-40px 0;
	float:left;
	width:18px;
} div.carousel div.controls li.btnPages a:hover {
	background-position:-40px -20px;
} div.carousel div.controls li.btnPages a:active {
	background-position:-40px -40px;
} div.carousel div.controls li.btnPages a.active {
	background-position:-58px 0;
	cursor:default;
}


/*
 General Carousel media styling
*/
div.carousel div.media {
	background-position:50% 50%;
	background-repeat:no-repeat;
} div.carousel div.media a {
	display:block;
	text-decoration:none;
} div.carousel div.media img {
	display:block;
	width:100%;
	height:100%;
}