$(document).ready(function() {

	var speed = 3000;
	var $slideshow = $('ul.slideshow');
	
	slideShow();


	function slideShow() {
	
		//Set the opacity of all images to 0
		$slideshow.find('li').hide();
		
		//Get the first image and display it (set it to full opacity)
		sl_show_img($slideshow.find('li:first'));
		
		//pause the slideshow on mouse over
		$slideshow.hover(
			function () {
				$slideshow.addClass('hovered');
			},
			function () {
				$slideshow.removeClass('hovered');
			}
		);
	}

	function sl_show_img(img){


		if( !$slideshow.hasClass('hovered') ){

			var pw = $slideshow.width();
			var ph = $slideshow.height();
			var ih = img.height()+40;
			
			if( ih > ph ){
				$slideshow.css('height',ih);
			}
	
			//hide the current
			$slideshow.find('li.show').fadeOut(1300).removeClass('show');
	
	
			//Set the fade in effect for the next image, show class has higher z-index
			var w = img.width();
			
			img.stop(true,true).addClass('show').css({'left':(pw-w)/2}).fadeIn(1300);
			
			var next = (img.next().length) ? img.next() : $slideshow.find('li:first');
		}else{
			var next = img;
		}

		window.setTimeout(function(){
			sl_show_img(next);
		},speed);
	}



});