function fadeImage(imgid){

	container = $('#slideshow');
	img = $('#slideshow li.top');	
	
	$('#slideshow li').each(function(){
		if(parseInt($(this).attr('rel')) == parseInt(imgid)){
			next = $(this);
		}
	});
	
	next.detach();
	next.appendTo(container);
	
	$('#slideshow li.top').animate({
		opacity: 0
		}, 1000, function(){
			img.removeClass('top');
			img.animate({opacity: 1}, 0);
			next.addClass('top');
			next.prependTo(container);
		});
}
			
function changeImage(obj){
		$('#botoes li').removeClass('active');
		obj.addClass('active');
		fadeImage(obj.attr('rel'));
	}

function autoFade(value){
	if(value==0 || isNaN(value)) value=1;
	var id = $('#botoes li.active').attr('rel');
	var nextb = (parseInt(id)+value);
	if(nextb<0) nextb+=4;
	nextb = nextb%$('#slideshow li').length;
	changeImage($('#botoes li[rel*="'+nextb+'"]'));
}	

$(document).ready(function(){
	$('#botoes li:not(.active)').live('click', function(){
		window.clearInterval(interval);
		interval = window.setInterval(autoFade, 6000);
		changeImage($(this));
	});
	
	$('#nav div.nav-right').click(function(){
		window.clearInterval(interval);
		interval = window.setInterval(autoFade, 6000);
		autoFade(1);
	});	

	$('#nav div.nav-left').click(function(){
		window.clearInterval(interval);
		interval = window.setInterval(autoFade, 6000);
		autoFade(-1);
	});		
	
	interval = window.setInterval(autoFade, 6000);

});