$(document).ready(function () {
		//1. create scroll effect
		//2. handle selection of nav
		//3. prev & next navigation
		//4. support vertical and horizontal 
		
		
		var horizontal = true;
		
		var $panels = $('#slider .a_box ');
		var $container = $('#slider .small_boxes');
		var $scroll = $('#slider .scroll').css('overflow', 'hidden');
		
		
		$scroll
			.before('<img src="/templates/billhurst/images/scroll_left.png" class="scrollButtons left"/>')
			.after('<img src="/templates/billhurst/images/scroll_right.png" class="scrollButtons right"/>');
			
		if (horizontal) {
			$panels .css({
					'float' : 'left',
					'position' : 'relative'
			});
			
			$container.css('width', $panels[0].offsetWidth * $panels.length);
		}
			
		var scrollOptions = {
				target: $scroll,
				items: $panels,
				prev: 'img.left',
				next: 'img.right',
				axis: 'xy',
				duration: 500,
				easing: 'swing'
				
				//TODO finish!
		};
			
		$('#slider').serialScroll(scrollOptions);
		
		
});

