var slide = 0;
var cnt = 1
var timer

$(document).ready(function(){
	
	$(".slider img").load(function(){
		resizeSlide()
	});
	
	$(".next, .prev").hover(function(){
		$(this).stop().animate({opacity: 1})
	}, function(){
		$(this).stop().animate({opacity: 0.8})
	})
	
	$(".next").click(function(){
		playSlide()	
	})
	
	$(".prev").click(function(){
		playSlide(-1)	
	})
	
	playSlide()
})

function resizeSlide(){
	
	
	$(".slider").css({height: $(".slide").outerHeight()+"px"})

	
	var o = $(".slider").offset();
	
	$(".slide").css({
		top: o.top+"px",
		left: o.left+"px"
	})
	
	
	$(".slider .prev").css({
		top: (o.top + 
		      ($(".slider").outerHeight()/2) - 
			  ($(".slider .next").outerHeight()/2))+"px"	
	})
	
	$(".slider .next").css({
		top: (o.top + 
		      ($(".slider").outerHeight()/2) - 
			  ($(".slider .next").outerHeight()/2))+"px",
		left: (o.left + ($(".slider").outerWidth()))+"px"
	})
}


function playSlide(next){
	
	if(next!=-1) next = 1;
	if(!$(".slide:visible").length) $(".slide:first").show()
	resizeSlide();
	$(".slide:visible").fadeOut(1000, function(){
		
		$(this).hide()
		$(".slide:eq("+slide+")").show()
		
		$(".slide:eq("+slide+")").children().hide()
		$(".slide:eq("+slide+")").children().each(function(i){
			var t = this
			setTimeout(function() {
				$(t).fadeIn(1000);
			}, i*300);
			
		})
		
		slide+=next;
		if(slide >= $('.slide').length) slide = 0;
		if(slide < 0) slide =  $('.slide').length-1;
		clearTimeout(timer);
		timer = setTimeout(function(){ playSlide() }, 10000)
	})
	

	
	
}