$(document).ready(function() {
	
	var container = $('.workstream');
	var ul = $('ul', container);
	var maxWidth = ul.innerWidth() - container.outerWidth();
	
//	ul.css({'left': maxWidth * -1 / 2});
	
	$('.handle').slider({
		animate: true,
		min: 0,
		max: maxWidth,
//		value: maxWidth / 2,
		slide: function(event, ui) {
			ul.stop();
			ul.animate({
				'left': ui.value * -1
			}, 500);
		},
		stop: function(event, ui) {
			ul.stop();
			ul.animate({
				'left': ui.value * -1
			}, 500);
		}
	});
	
	$('nav').hover(
		function(){
			$('.handle a').addClass("hover");
		},
		function(){
			$('.handle a').removeClass("hover");
		}
	);
		
});
