$(document).ready(function() {
	// close menu after 5 seconds
	// if menu is tru in wrapper div
	menu_close();
	
	// Set menu handler in wrapper div
	$('#wrapper').data('menu_off', false);
	
	// set click event handler on wrapper div 
	// to close menu
	$(document).click(function(){
    	$('.slide').stop(true,true).slideUp('fast');
    });

	// fade down layer on on nav item
	$("#navigation>ul>li>a").each(function() {
		$( '<span class="over">' +  $(this).text() + '</span>' ).appendTo( this );
	});

    // hover function for nav layer and menu
	$("#navigation>ul>li>a").hover(function() {
		$(".over", this).slideDown('fast'); // move down - show
		$('#wrapper').data('menu_off', false);
		if ($(this).next().not(':visible')){
	    	$('.slide').stop(true,true).slideUp('fast');
			$(this).next().stop(true,true).slideDown('fast');
			
			// set menu_off in wrappter to false if mouse enters menu layer
		    $('.slide').mouseenter(function(){
				$('#wrapper').data('menu_off', false);
			});    
			// set menu_off in wrappter to true if mouse leaves menu layer
		    $('.slide').mouseleave(function(){
				$('#wrapper').data('menu_off', true);
			});    
		}
	}, function() {
		$(".over", this).slideUp('fast'); // move up - hide
		$('#wrapper').data('menu_off', true);
	});

    // close menu
    function menu_close(){
		if ($('#wrapper').data('menu_off')){
			$('.slide').stop(true,true).slideUp('fast');
		}
		setTimeout(menu_close, 5000);
	}

});