$(document).ready(function(){

	counter = 1;
	wait	= 10000;
	$("#header-dots").width("50px");
	
	slideInterval = window.setInterval( moveSlide, wait);	
	
	function goToSlide(number) {
			
			counter = number;
			number = number-1;
			
			width = $("#header").width();
			
			position = width * number;
					
		   $('#header').animate({backgroundPosition: '-' + position + 'px'},800); 
		   $('#slidesContainer').animate({marginLeft: '-' + position + 'px'},800); 
	
		  //move position dot into position
		  dotOffset = 20 * number;
		  
		  $("#header-active-dot").fadeOut('fast', function() {
			 $("#header-active-dot").css({marginLeft: dotOffset+'px'});
			 $("#header-active-dot").fadeIn('fast');
		  });
		  
		  slideInterval = window.clearInterval(slideInterval);
		  slideInterval = window.setInterval( moveSlide, (3*wait));
	
	  }
	
	function moveSlide(count) {
			
			if(!count){
				count=3;
			}
			
			slideInterval = window.clearInterval(slideInterval);
			slideInterval = window.setInterval( moveSlide, (1*wait));
	
			// move background and content slide into position
			width = $("#header").width();
			offset		 = width;
			
			if(counter<count)
			{
				counter = counter+1;
			}else{
				counter = 1;
				offset = -((count-1)*offset);
			}
			
		   $('#header').animate({backgroundPosition: '-=' + offset + 'px'},800); 
		   $('#slidesContainer').animate({marginLeft: '-=' + offset + 'px'},800); 
				
		  //move position dot into position
		  dotOffset = 20 * (counter-1);
		  
		  $("#header-active-dot").fadeOut('fast', function() {
			 $("#header-active-dot").css({marginLeft: dotOffset+'px'});
			 $("#header-active-dot").fadeIn('fast');
		   });
	
	  }
	
	
	$('#dot1').click(function() {
		goToSlide(1);
	});
	$('#dot2').click(function() {
		goToSlide(2);
	});
	$('#dot3').click(function() {
		goToSlide(3);
	});
	$('#dot4').click(function() {
		goToSlide(4);
	});

});