/*----------------------------------------------------------------------------
[Slideshow stylesheet]

This stylesheet should only contain slideshow related styles. All styles should be
separated with a heading.

Project:	    	Events or Core
Version:	    	1.0.0 [http://semver.org/]
Primary use:		For use with Slideshow
Original Author: 	Qasim Alyas
Last change:		24/Oct/11 []
Last Assigned to:	
Change history:		

-----------------------------------------------------------------------------*/

.slideShow {
	width: 620px;
	height: 414px;
	overflow: hidden;
	position: relative;
	margin-bottom: 15px;
}
	.slideShow * {
		margin: 0;
		padding: 0;
		list-style: none;
	}
.slideShowContent li {
	width: 620px;
	background: #fff none;
}
.slideShowContent li:after {
	content: ".";
	visibility: hidden;
	height: 0;
	display: block;
	clear: both;
}
	.slideShowContent li img {
		float: left;
		max-width: 426px;
	}
	.slideShowContent li .slideShowCaption {
		float: left;
		margin-top: 74px;
		max-width: 194px;
	}
		.slideShowContent li .slideShowCaption div {
			padding: 10px 8px;
		}
			.slideShowContent li .slideShowCaption div img {
				padding-bottom: 18px;
			}
			.slideShowContent li .slideShowCaption div span {
				font-size: 1.167em;
				color: #A5A4A5;
			}
			.slideShowContent li .slideShowCaption div h2 {
				padding-bottom: 5px;
				padding-top: 5px;
				color: #A5A4A5;
				font-size: 1.167em;
				font-weight: normal;
				text-transform: uppercase;
			}
			.slideShowContent li .slideShowCaption div h3 {
				color: #8A8B8C;
				font-size: 1.167em;
				font-weight: bold;
				padding-bottom: 22px;
			}
			.slideShowCaption div h3 {
				font-size: 1.333em;
			}
			.slideShowContent li .slideShowCaption div p {
				line-height: 16px;
				color: #C9CACB;
			}

.slideShowFunction {
	position: absolute;
	right: 8px;
	bottom: 60px;
	z-index: 2;
	border-bottom: 1px solid #F4F4F4;
	padding-top: 30px;
	padding-bottom: 5px;
	width: 178px;
	background: url(/magazine/graphics/slideshow.nav.border.png) repeat-x left top;
}

.slideShowNav {
	float: left;
}

.slideShowNav ul:after {
	content: ".";
	visibility: hidden;
	height: 0;
	display: block;
	clear: both;
}
	.slideShowNav li {
		float: left;
		margin-right: 15px;
	}
	.slideShowNav span {
		cursor: pointer;
		display: block;
		width: 16px;
		height: 16px;
		text-align: center;
		color: #fff;
		background-color: #939598;
	}
	.slideShowNav .selected span {
		background-color: #AB0534;
	}
.slideShowButtons {
	float: left;
	z-index: 2;
}
	.slideShowButtons span {
		display: block;
		width: 13px;
		height: 15px;
		text-indent: -9999px;
		line-height: 13px;
		cursor: pointer;
		background: url(/magazine/graphics/slideshow.playpause.png) no-repeat top;
	}
	.slideShowButtons .pause {
		background-position: bottom;
	}

.slideShow .eventDate {
	position: absolute;
	bottom: 0;
	right: 8px;
	z-index: 2;
}
