$(document).ready(function(){
	$('#nav li').each(function(e){
		$(this).addClass('nav'+e);
		
		$("#showcase .nav"+e).hover(function(){aniStar($(this));}, 
						  function(){aniEnd($(this));}
		);
		$(this).children().eq(1).fadeOut(250);
	});
	
	$("#showcase .content").each(function(a){
		$(this).addClass('cnt'+a);
	});
	
//	$("#nav li .content:first").fadeIn(800);
	$('#nav li:first').addClass("active");
	$('#showcase .content:first').fadeIn(800);

});

function aniStar(eLement){
	$(eLement).children().stop().animate({
		"right": "0px"
	}, 
	250, 
	function(){
		$('#nav li:first').removeClass('active'); 
		setActive(eLement);
	});
}

function aniEnd(eLement){
	$(eLement).children().animate({"right": "-20px"}, 100);
}
	
function setActive(eLement){
	$('#nav li').each(function(e){
		$(this).removeClass("active");
	});
	$(eLement).addClass("active");
	
	$("#nav li").each(function(i){
		if($("#nav li").eq(i).hasClass("active")){
			$("#showcase .content").fadeOut(250);
			$("#showcase .cnt"+i).fadeIn(500);
		}
	});
}