$(function(){

    // just a nice hover effect
	$('#menu-bar ul a').hover(function(){
    	$(this).stop().animate({
    		textIndent: "20px"
    	}, 'fast');
    }, function() {
    	$(this).stop().animate({
    		textIndent: "10px"
    	}, 400);
    });
    
    // same as above
    $('#menu-bar ul ul ul a').hover(function(){
    	$(this).stop().animate({
    		textIndent: "11px"
    	}, 'fast');
    }, function() {
    	$(this).stop().animate({
    		textIndent: "1px"
    	}, 400);
    });
    
    // if li has an ul then add toggle function to the first a, already blocks the a href
    $('li.menu-item').has('ul').find('a:first').toggle(function(){
        $(this).parent('li').find('ul').animate({
        	height: 'show',
        	opacity: 'show'
        }, 'fast');
    },function(){
        $(this).parent('li').find('ul').animate({
        	height: 'hide',
        	opacity: 'hide'
        }, 'fast');
    });

    // hide all underlying ul's
    $('li.menu-item > ul').hide();
    // but not if it has the current li
    $('li.current_page_item').parent('ul').show();

});
