$(document).ready(function() { 
	
	//Set Default State of each portfolio piece 
	$(".paging").show(); 
	$(".paging a:first").addClass("active"); 
	
	//Get size of images, how many there are, then determin the size of the image reel. 
	var imageWidth = $(".window").width(); 
	var imageSum = $(".image_reel img").size(); 
	var imageReelWidth = imageWidth * imageSum; 
	
	//Adjust the image reel to its new size 
	$(".image_reel").css({'width' : imageReelWidth}); 
	
	//Paging + Slider Function 
	rotate = function(){ 
	var triggerID = $active.attr("rel") - 1; //Get number of times to slide 
	var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide 
	
	$(".paging a").removeClass('active'); //Remove all active class 
	$active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function) 
	
	//Slider Animation 
	$(".image_reel").animate({ 
	left: -image_reelPosition 
	}, 500 ); 
	
	}; 
	
	//Rotation + Timing Event 
	rotateSwitch = function(){ 
	play = setInterval(function(){ //Set timer - this will repeat itself every 3 seconds 
	$active = $('.paging a.active').next(); 
	if ( $active.length === 0) { //If paging reaches the end... 
	$active = $('.paging a:first'); //go back to first 
	} 
	rotate(); //Trigger the paging and slider function 
	}, 9000); //Timer speed in milliseconds (3 seconds) 
	}; 
	
	rotateSwitch(); //Run function on launch 
	
	//On Hover 
	$(".image_reel a").hover(function() { 
	clearInterval(play); //Stop the rotation 
	}, function() { 
	rotateSwitch(); //Resume rotation 
	}); 
	
	//On Click 
	$(".paging a").click(function() { 
	$active = $(this); //Activate the clicked paging 
	//Reset Timer 
	clearInterval(play); //Stop the rotation 
	rotate(); //Trigger rotation immediately 
	rotateSwitch(); // Resume rotation 
	return false; //Prevent browser jump to link anchor 
	}); 
	
	});