$(function() {

	//disjointed rollover function starting point
	$("div.header_container div#button li").hover(function(){
	   		//make a variable and assign the hovered id to it
	   		var elid = $(this).attr('id');
	   		//hide the image currently there
	   		$("div.header_container  div#images div").hide();
	   		//fade in the image with the same id as the selected buttom
	   		$("div.header_container div#images div#" + elid + "").fadeIn("slow");
	   
	}, function(){});
	
	// Expand only the active menu, which is determined by the class name
	$("#coll_menu > li > a[@class=expanded] ").find("+ ul").slideToggle("medium");

	// Toggle the selected menu's class and expand or collapse the menu
	$("#coll_menu > li > a").click(function() {
		$(this).toggleClass("expanded").toggleClass("collapsed").find("+ ul").slideToggle("medium");
	});
	
	
	$("#coll_menu > li > ul > li > a").click(function() {
		$(this).css("background-color", "yellow");	
	});
}); 
