/**

*	Really Simple™ Slideshow -- CSS

*/



.rs-slideshow {

	border: 0px solid #444;

	border-radius: 0px;

	-webkit-border-radius: 0px;

	-moz-border-radius: 0px;

	-khtml-border-radius: 0px;

	height: 175px;

	margin: 0px auto;

	overflow: hidden;

	position: relative;

	width: 720px;

}



.rs-slideshow .slide-container {

	background-color: #444;

	position: absolute;

	height: 276px;

	left: 0;

	overflow: hidden;

	top: 0;

	width: 1202px;

}



.rs-slideshow .slide-container img {

	position: relative;

}



.rs-slideshow .slide-container .slide-caption {

	background-color: #000;

	bottom: 0;

	color: #fff;

	display: block;

	left: 0;

	padding: 6px 12px;

	position: absolute;

	text-align: center;

	right: 0;

	filter: alpha(opacity=70); /* internet explorer */

	-khtml-opacity: 0.7;      /* khtml, old safari */

	-moz-opacity: 0.7;       /* mozilla, netscape */

	opacity: 0.7;           /* fx, safari, opera */

}



.rs-slideshow .slides {

	display: none;

}



.rs-slideshow .slide-container img,

.rs-slideshow .slide-container .slide-caption,

.rs-slideshow .slide-container a {

	filter: inherit;

}





/**

*	These styles make the list of links to slide images visible to users

*	who don't have JavaScript enabled. By adding the 'no-js' class to 

*	the HTML element, and using Modernizr to remove this class for JS

*	users, we can style for both scenarios.

*	http://www.modernizr.com/

*/



.no-js .rs-slideshow {

	height: auto;

}

.no-js .rs-slideshow .slide-container, 

.no-js .rs-slideshow .slide-container img {

	position: relative;

}

.no-js .rs-slideshow .slides {

	display: block;

	margin: 24px 48px;

}

.no-js .rs-slideshow .slides li {

	margin: 0;

}







/**

*	The following styles are used in the demos with slideshow controls, 

*	such as play/pause and prev/next buttons.

*/



.rs-controls {

	clear: both;

	margin: 12px auto;

	width: 620px;

}

.rs-play-pause, .rs-prev, .rs-next {

	float: left;

	margin-right: 12px;

}

.rs-controls ul {

	float: left;

	list-style: none;

	margin: 0 6px 0 0;

	padding: 0;

}

.rs-index-list li {

	float: left;

	margin-right: 6px;

}

.rs-controls a {

	background-color: #eee;

	border: 1px solid #ddd;

	/*border-radius: 3px;

	-webkit-border-radius: 3px;

	-moz-border-radius: 3px;

	-khtml-border-radius: 3px;*/

	color: #444;

	display: block;

	font-family: Arial, Helvetica, sans-serif;

	font-size: 12px;

	font-weight: bold;

	padding: 3px 5px;

	text-decoration: none;

}

.rs-controls a:hover {

	background-color: #ddd;

	color: #444;

}

.rs-controls .rs-active {

	background-color: #444;

	border: 1px solid #444;

	color: #eee;

}





#callback-messages,

#slide-class-message {

	margin: 48px auto;

	width: 620px;

}

.slide-container.some-custom-class .slide-caption {

	background-color: #890;

	font-size: 3em;

	font-style: italic;

	font-weight: bold;

	text-align: right;

	top: 0;

	width: 28%;

}







/*	Clearfix	*/

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

.clearfix { display: inline-block; }

* html .clearfix { height: 1%; } /* Hides from IE-mac \*/

.clearfix { display: block; }
