// When the DOM is ready
$(function() {
	
	$("nav li a").append("<span>&nbsp</span>");
	
	$("nav li a").hover(function(e) {
	
		$(this)
			.hoverFlow(e.type, { width: 205 }, 200)
			.css('overflow', 'visible')
			.find('span')
			.hoverFlow(e.type, { width: 10 }, 200)
		
	}, function(e) {
		
		$(this)
			.hoverFlow(e.type, { width: 190 }, 200)
			.css('overflow', 'visible')
			.find('span')
			.hoverFlow(e.type, { width: 15 }, 200)
		
	});
	
	$(".side").append("<span>&nbsp</span>");
	
	$('.acc_container').hide(); //Hide/close all containers
	$('.acc_trigger:first').addClass('active').next().show(); //Add "active" class to first trigger, then show/open the immediate next container

//On Click
	$('.acc_trigger').click(function(){
		if( $(this).next().is(':hidden') ) { //If immediate next container is closed...
			$('.acc_trigger').removeClass('active').next().slideUp(); //Remove all "active" state and slide up the immediate next container
			$(this).toggleClass('active').next().slideDown(); //Add "active" state to clicked trigger and slide down the immediate next container
		}
		return false; //Prevent the browser jump to the link anchor
	});	
	
})