// JavaScript Document


$(document).ready(function () {
			
			// if false, we'll float all the panels left and fix the width 
			// of the container
			var horizontal = true;
			var $panels = $('.panel');
			var $container = $('.scrollContainer');
			var $scroll = $('.scroll').css('overflow','hidden');	
			
			$scroll
				.after('<img src="images/leftBTN.png" class="leftBTN left"/> ')
				.after('<img src="images/rightBTN.png" class="rightBTN right"/>')
				
				
				
				
			
			
			
			// float the panels left if we're going horizontal
			if (horizontal) {
			  $panels.css({
				'float' : 'left',
				'position' : 'relative' // IE fix to ensure overflow is hidden
			  });
			  
			  // calculate a new width for the container (so it holds all panels)
			  //$container.css('width', $panels[0].offsetWidth * $panels.length);
			}
		
	
				
				
				
		    var scrollOptions = {
				target: $scroll,
				items: $panels,
				navigation: '.navigation a',
				prev: 'img.left',
				next: 'img.right',
				axis: 'xy',
				duration: 500,
				easing: 'swing'
			};
			
				  
				  
				  
	$('#container').serialScroll(scrollOptions);
	$.localScroll(scrollOptions);
	scrollOptions.duration = 1;
	$.localScroll.hash(scrollOptions);

				  
				  

});