$(document).ready(function() {
	/////////////////////////////
	// Dropping down menus
	/////////////////////////////
	// PARAMS:
	var $slide_down_speed = 90;		// speed which the menu slides down
	var $slide_up_speed = 0;		// speed which the menu slides up
	var $dropdown_menu_width = 130;	// width of the dropdown menu (Must be the same as default width in CSS)

	var $level = 0;					// actual level of dropped menu (PLEASE DONT CHANGE!!)

	// CODE
	$("#navigation ul li").hover(
		// MOUSE IN
		function()
		{
			// Highlight toplevel tabs
			$(this).children("a:first").addClass("hovered");
			
			// Slidedown UL
			$(this).find("ul:first").stop(true, true).delay(150).slideDown($slide_down_speed);
			
			if ($level > 0) // ONLY IF THE DROPDOWN LEVEL IS HIGHER THEN FIRST, WE HAVE TO CHANGE THE LEFT POSITION OF DROPDOWN 
			{
				$(this).find("ul:first").css("left", $dropdown_menu_width);
				$(this).find("ul:first").css("top", 0);
			}
			
			$level++; // increasing the actual dropdown level								  
		},
		// MOUSE OUT
		function()
		{
			$(this).children("a:first").removeClass("hovered");
			$(this).find("ul").stop(true,true).slideUp($slide_up_speed);	// slide up the CSS                     
			$level--;														// decrease the actual level
		}
	);
});