/**
* Dynamic Banner
* --------------
* This acts as an extenstion to the normal banner. If the size of the banner
* is smaller than the surrounding banner then the surrounding banner will be
* filled with the normal banner background. Ideally you want to make the banner
* the same size as the parent banner.
*
* The dynamic banner needs to be surrounded by either the large or small banner 
* classes
*/
div.banner-large .inner,
div.banner-small .inner{
	position:absolute;
	top:0px;
}
div.dynamic_banner{
	position:relative;
	z-index:1;
}

.banner-buttons{
	position:absolute;
	bottom:25px;
	right:25px;
	cursor:pointer;
	cursor:hand;
	z-index:2;
}
.banner-buttons ul{
	padding:0;
	margin:0;
}
.banner-buttons ul li{
	list-style:none;
	float:left;
	padding:0;
	margin:0;
}
.banner-buttons a{
	display:block;
	float:left;
}
.banner-buttons a:hover{
	text-decoration: none;
}

.banner-buttons a.previous{
	background-image: url('../images/dynamic_banner/previous_banner.png');
	height:15px;
	width:11px;
	display:block;
}
.banner-buttons a .label{
	display:none;
}
.banner-buttons a.next{
	background-image: url('../images/dynamic_banner/next_banner.png');
	height:15px;
	width:11px;
	display:block;
}

.banner-buttons a.active{
	background-image: url('../images/dynamic_banner/selected_banner.png');
	height:15px;
	width:18px;
	display:block;
}

.banner-buttons a.inactive{
	background-image: url('../images/dynamic_banner/unselected_banner.png');
	height:15px;
	width:18px;
	display:block;
}