Event.observe(window, 'load', function() 
{   
	var sectionNumber = Number(0);  

	$$("ul#nav li.level0").each(function(el){
		sectionNumber++;
                el.id = 'section' + sectionNumber;
                el.addClassName('section');
		$$('li#' + el.id + ' ul.level0').each(function(el){
			el.id = 'section' + sectionNumber + '_container';
			el.addClassName('section_container');
			if(!el.up().hasClassName('active')){
			    el.toggle();
			}
		});
		
	});

	document.observe('click', function(e){
	    var element = e.element(); 
            if(element.descendantOf('nav')) {
                var stop = true;  
                while(!element.hasClassName('section')) {
		    if(element.hasClassName('section_container')){
			stop = false;
		    }
		    element = element.up();
		}
                if(stop){
		    Event.stop(e);
		    $$('li#' + element.id + ' ul.level0').each(function(el){
		        new Effect.toggle(el,'Appear', {duration:0.5});
		    });	
		}	
            }
	});
});