/* ################################################################################ */
/* s3slider slideshow */

#s3slider {
	width: 958px;
	/* important to be same as image width */
	height: 200px;
	/* important to be same as image height */
	position: relative;
	/* important */
	overflow: hidden;
	/* important */
}

#s3sliderContent {
	width: 958px;
	/* important to be same as image width or wider */
	position: absolute;
	/* important */
	top: 0;
	/* important */
	margin-left: 0;
	/* important */
}

.s3sliderImage {
	float: left;
	/* important */
	position: relative;
	/* important */
	display: none;
	/* important */
}

.s3sliderImage img {
	width: 958px;
	height: 200px;
}

.s3sliderImage a span { text-decoration: none; }

.s3sliderImage a:hover, 
.s3sliderImage a:hover span { color: #ffcc00; text-decoration: none; }

.s3sliderImage span {
	position: absolute;
	/* important */
	left: -1px;
	font-size: 1.3em;
	padding: 10px 14px 12px 24px;
	width: 933px;
	background-color: #000;
	filter: alpha(opacity=70);
	/* here you can set the opacity of box with text */
	-moz-opacity: 0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;
	color: #fff;
	display: none;
	/* important */
	top: 0;
	/*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

.s3sliderImage div.arrow {
	font-size: 1.3em;
	text-align: right;
	display: inline;
	position: absolute;
	left: 95%;
	bottom: 10px;
}