/* default look and feel */
.ImageCarousel .panel {
	margin: 0px;
	text-align:center;
	
}
.ImageCarousel .panel .number {
	margin: 5px;
	width: 20px;
	height: 19px;
	padding-top:2px; 
	line-height: 17px;
	font-size: 16px;
	background-color: #FFD9C6;
	color: #fff;
	border: 2px solid #eee;
	/* rounded corners for real browsers */
	-moz-border-radius: 4px; /* FF1+ */
	-webkit-border-radius: 4px; /* Saf3+, Chrome */
	border-radius: 4px; /* Opera 10.5, IE 9 */
	-moz-opacity:.70; filter:alpha(opacity=70); opacity:.70;
}
.ImageCarousel .panel .number.active {
	-moz-opacity:.95; filter:alpha(opacity=95); opacity:.95;
	background-color: #F60;
	color: #fff;
	border: 2px solid #fff;
}
.ImageCarousel .panel .number:hover {
	-moz-opacity:.95; filter:alpha(opacity=95); opacity:.95;
}



/* circle border LAF */
.ImageCarousel.circle .panel .number {
	border: 2px solid #eee;
	-moz-border-radius: 16px; /* FF1+ */
	-webkit-border-radius: 16px; /* Saf3+, Chrome */
	border-radius: 16px; /* Opera 10.5, IE 9 */
}
.ImageCarousel.circle .panel .number.active {
	border: 2px solid #fff;
}





/* functional css, layout and positioning. css below here shouldnt need to be altered for aestetics. */

.ImageCarousel {
	font-family: Arial;
	overflow: hidden;
	border: 0px solid transparent !important;
	background-image: url(../images/load.gif);
	background-position: center center;
	background-repeat: no-repeat;
	_position:relative;
	float:left;
	_margin-left:17px;
}
.ImageCarousel>* { /* Try automatically make most sub elements higher z-index than slides and numbers */
	position: absolute;
	z-index: 20;
}

.ImageCarousel .slide {
	position: absolute;
	left: 0px; 
	_top: 164px;
	z-index: 3;
	background-position: right top !important;
	background-repeat: no-repeat;
	_padding-left:15px;
	_right:285px;
	border:5px solid #a90704
	
}

.ImageCarousel .panel {
	position: absolute;
	overflow: hidden;
	z-index: 100;
	float: left;
	left:21px;
	top:300px;
}
div.home div#slider.ImageCarousel .panel {
	top:450px;
}

div.home div#slider.ImageCarousel .slide {
	top:168px;
}

.ImageCarousel.right .panel { right: 0px; }
.ImageCarousel.bottom .panel { bottom: 0px; }

.ImageCarousel .panel .number {
	cursor: pointer;
	float: left;
	text-align: center;
}