$(document).ready(function() {
	$(".navigationlinks").show();
	$(".navigationlinks a:first").addClass("active");
	fadeinout = function(){	
		//var imagenumber = $active.attr("rel") - 1;
		$(".navigationlinks a").removeClass('active');
		$active.addClass('active');
		
		
		var $active1 = $('#slideshow IMG.active');
		if ( $active1.length == 0 ) $active1 = $('#slideshow IMG:last');
	
		var $next =  $active1.next().length ? $active1.next()
			: $('#slideshow IMG:first');
	
		$active1.addClass('last-active');
		
		$next.css({opacity: 0.0})
			.addClass('active')
			.animate({opacity: 1.0}, 1000, function() {
				$active1.removeClass('active last-active');
			});
	}; 
	
	automatefadeinout = function(){		
		play = setInterval(function(){
			$active = $('.navigationlinks a.active').next();
			if ( $active.length === 0) {
				$active = $('.navigationlinks a:first');
			}
			fadeinout();
		}, 3000);
	};
	
	automatefadeinout();
	
	$("#slideshow IMG").hover(function() {
		clearInterval(play);
	}, function() {
		automatefadeinout();
	});	
	
	$(".navigationlinks a").click(function() {	
		$active1 = $(this);
		$(".navigationlinks a").removeClass('active');
		$active1.addClass('active');
		var imagenumber = $active1.attr("rel") - 1;
		clearInterval(play);
		$cur = $("#slideshow IMG.active");
		$($cur).addClass('last-active');
		$imgs = $("#slideshow IMG");
		$($imgs[imagenumber]).css({opacity: 0.0})
			.addClass('active')
			.animate({opacity: 1.0}, 1000, function() {
				$cur.removeClass('active last-active');
			});
		automatefadeinout();
		return false;
	});	
	
});