var i = 1;
 
 $(document).ready(function() {
	t = setTimeout('rotateCallouts('+i+')',6000);
	animationControls();
 
 });
 
 
function animationControls(){
	$('div.rotatingDiv').mouseover(function(){
		clearTimeout(t);
	});
 
	$('div.rotatingDiv').mouseout(function(){
		visibleId = $('div.rotatingDiv:visible').attr('id');
		i = visibleId.replace('rotating','');
		t = setTimeout('rotateCallouts('+i+')',6000);
	});
	
	$('img.number').mouseover(function(){
		clearTimeout(t);
 
		var thisId = $(this).attr('id');
		i = thisId.replace('number','');
		newId = 'div#rotating' + i;
		
		$('div.rotatingDiv:visible').css({display:"none"});
		
		$(newId).css({display:"block"});
		
		
		
	});
	
}
 
 
function rotateCallouts(i){
			
			if(i<3){
			thisId = 'div#rotating' + i;
			newId = i;
			newId++;
			newId = 'div#rotating' + newId;
 
			$(thisId).fadeOut(1000,function(){
					$(newId).fadeIn(1000);
					i++;
				});
			
		
			
			i = newId.replace('div#rotating','');
			parseFloat(i);
			t = setTimeout('rotateCallouts('+i+')',6000);
 
		}
		else if(i===3){
			//Uncomment the code below to repeat
			/*
			$('div#rotating6').fadeOut(1000,function(){
				$('div#rotating1').fadeIn(1000);
				i++;
			});
	
			i = 1
				setTimeout('rotateCallouts('+i+')',9000);
		*/
		}
	
}
 
