jQuery(function( $ ){
	
	var target = $('#slider').get(0);//the scrolled div
	

	target.scrollLeft = target.scrollTop = 0;
	
	//scroll initially if there's a hash (#something) in the url 
	$.localScroll.hash({
		target: target, //could be a selector or a jQuery object too.
		axis:'xy',//the default is 'y'
		queue:true,
		duration:1500
	});
	
	var $last = $([]);//save the last link
	
	/**
	 * NOTE: In the former version of the demo, I called $('#navigation').localScroll()
	 * Now I want to also affect the >> and << links, so I'll use $.localScroll() instead
	 */
	$.localScroll({
		target: target, //could be a selector or a jQuery object too.
		axis:'xy',//the default is 'y'
		queue:true,
		duration:1200,
		hash:false,
		onBefore:function( e, anchor, $target ){//'this' is the clicked link
			this.blur();//remove the awful outline
			
		}
	});
	
	
	
			//by default, the scroll is only done vertically ('y'), change it to both.
			$.scrollTo.defaults.axis = 'xy'; 			
			//this one is important, many browsers don't reset scroll on refreshes
			$('div#overlay').scrollTo( 0 );//reset all scrollable panes to (0,0)
			$.scrollTo( 0 );//reset the screen to (0,0)
			

			
			//Target examples bindings
			var $paneTarget = $('#overlay');	
			
			$('#content_home').click(function(){
				$paneTarget.stop().scrollTo( '0', 1000, {
					onAfter:function(){
						$("#gallery").hide();
					}
				});
			});
			
			$('h1 a').click(function(){
				$paneTarget.stop().scrollTo( '0', 1000, {
					onAfter:function(){
						$("#gallery").hide();
					}
				});
			});

			$('#content_building').click(function(){
				$paneTarget.stop().scrollTo( '495px', 1000, {
					onAfter:function(){
						$("#gallery").hide();
					}
				});
			});


			$('#content_dining').click(function(){
				$paneTarget.stop().scrollTo( '990px', 1000, {
					onAfter:function(){
						$("#gallery").hide();
					}
				});
			});
				
				$('#content_menus').click(function(){
				$paneTarget.stop().scrollTo( '1485px', 1000, {
					onAfter:function(){
						$("#gallery").hide();
					}
				});
			});

			$('#content_drinking').click(function(){
				$paneTarget.stop().scrollTo( '1980px', 1000, {
					onAfter:function(){
						$("#gallery").hide();
					}
				});
			});
			
			$('#content_cocktail').click(function(){
				$paneTarget.stop().scrollTo( '2475px', 1000, {
					onAfter:function(){
						$("#gallery").hide();
					}
				});
			});
			
			
			$('#content_gallery').click(function(){
				$paneTarget.stop().scrollTo( '2970px', 1000, {
					onAfter:function(){
						$("#gallery").show();
					}
				});
			});
			
			$('#content_news').click(function(){
				$paneTarget.stop().scrollTo( '3465px', 1000, {
					onAfter:function(){
						$("#gallery").hide();
					}
				});
			});

				$('#content_reservation').click(function(){
				$paneTarget.stop().scrollTo( '3960px', 1000, {
					onAfter:function(){
						$("#gallery").hide();
					}
				});
			});

		
			
		
			
			// PNG hack
			$(document).pngFix();
			
			// Controls the full screen mode
			$("a.fullsize").click(function(){
		 	$("div#overlay").slideToggle("fast");
			$(this).toggleClass("active");
				return false;
			});
			
			
			

	 $("ul.navigation").show();
			
			
	$("ul.navigation li a").css({ opacity: 0.4 });
	$("ul.navigation li:first").addClass("active").children().css({ opacity: 1, marginTop: "74px"});

	$("ul.navigation li").click(
		function(){
			$(this).addClass("active");
			$(this).siblings().removeClass("active");
			$(this).siblings().children().animate({ opacity: 0.4, marginTop: "78px"}, 100 );
		}
	);
	$("ul.navigation li").click(
		function(){
			if($(this).hasClass("gallery")){
				$("p.fullsize_link").animate({ height: "0"}, 240 );
			}else{
				$("p.fullsize_link").animate({ height: "24px"}, 240 );
			}
		}
	);

	$("ul.navigation li a").hover(
		function(){
			if($(this).parent().hasClass("active")){
				
			}else{
				$(this).animate({ opacity: 1, marginTop: "74px"}, 100 );
			}
		},
		function(){
			if($(this).parent().hasClass("active")){
			}else{
				$(this).animate({ opacity: 0.4, marginTop: "78px"}, 100 );
			}
		}

	);
	
});