$(document).ready(
	function(){
		setTimeout(function(){
			$('#serveur-dedie').fadeOut(1000, function(){
			   $('#serveur-dedie').html('<p>&nbsp;</p>');
			   $('#serveur-dedie').css('background-image', "url('./images/cadre_serveur-dedie-soon.png')")
			   $('#serveur-dedie').fadeIn(1000);
		   });
			$('#revendeur').fadeOut(1000, function(){
			   $('#revendeur').html('<p>&nbsp;</p>');
			   $('#revendeur').css('background-image', "url('./images/cadre_web-agency-soon.png')");
			   $('#revendeur').fadeIn(1000);
		   });
		}, 1500);
	}
);

function theRotator() {
		$('.header2-gauche .h1').hide("slide", { direction: "left" }, 1000);
		$('div#rotator ul li').css({opacity: 0.0});
		$('div#rotator ul li:first').css({opacity: 1.0});
		setInterval('rotate()',5000);
	}

	function rotate() {	
		var current = ($('div#rotator ul li.show')?  $('div#rotator ul li.show') : $('div#rotator ul li:first'));
		var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#rotator ul li:first') :current.next()) : $('div#rotator ul li:first'));

		var current2 = ($('div#boutons ul li.show')?  $('div#boutons ul li.show') : $('div#boutons ul li:first'));
		var next2 = ((current2.next().length) ? ((current2.next().hasClass('show')) ? $('div#boutons ul li:first') :current2.next()) : $('div#boutons ul li:first'));

		next.css({opacity: 0.0}).addClass('show').animate({opacity: 1.0}, 1000);
		current.animate({opacity: 0.0}, 1000).removeClass('show');

		next2.css({opacity: 0.5}).addClass('show').animate({opacity: 1.0}, 1000);
		current2.animate({opacity: 0.5}, 1000).removeClass('show');
	}

	theRotator();