/**
Stylesheet: Slideshow.css
	CSS for Slideshow.

License:
	MIT-style license.

Copyright:
	Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/).
	
HTML:
	<div class="slideshow">
		<div class="slideshow-images" />
		<div class="slideshow-captions" />
		<div class="slideshow-controller" />
		<div class="slideshow-loader" />
		<div class="slideshow-thumbnails" />
	</div>
	
Notes:
	These next five rules are required for Slideshow to work correctly.
	Override at your own risk.
*/

.slideshow {
	display: block;
	position: absolute;
	z-index: 0;
	overflow: hidden;
}
.slideshow-images {
	display: block; overflow: hidden; position: relative;
}		
.slideshow-images img {
	display: block; position: absolute; z-index: 1;
}		
.slideshow-thumbnails {
	overflow: hidden;
}
.slideshow-thumbnails ul {
	left: 0; position: absolute; top: 0; width: 100000px;
}

/**
HTML:
	<div class="slideshow-images">
		<img />
		<img />
	</div>
	
Notes:
	The images div is where the slides are shown.
	Customize the visible / prev / next classes to effect the slideshow transitions: fading, wiping, etc.
*/

.slideshow-images {
	height: 150px; width: 550px;
}		
.slideshow-images-visible { 
	opacity: 1;
}	
.slideshow-images-prev { 
	opacity: 0;
}
.slideshow-images-next { 
	opacity: 0;
}
.slideshow-images img {
	float: left; left: 0; top: 0;
}	

/**
Notes:
	These are examples of user-defined styles.
	Customize these classes to your usage of Slideshow.
*/

.slideshow {
	height: 150px; margin: 0 auto; width: 550px; z-index:5
}
.slideshow a img {
	border: 0;
}
