addLoadEvent( function(){ var oSubMenu = new cSubMenu("submenu" ) } );

/** constructor for submenu */
function cSubMenu( id ){
	var oContainer = document.getElementById( id );
	if ( oContainer ) {
		var oSections = [];
		var oLinks = oContainer.getElementsByTagName("a");
		var i = 0, oLink;
		while ( oLink = oLinks[i++] ) {
			// if this link opens a submenu
			if ( oLink.href == "" && oLink.parentNode.getElementsByTagName("ul") )  {
				// assign the toggle method to the link
				oLink.onclick = mToggle;
				// assign hover to it ( to fix IE's lack of hover on anything but <a> with href)
				oLink.onmouseover = function () { this.className = this.className.attach("hover") }
				oLink.onmouseout = function () { this.className = this.className.detach("hover") }
				// populate the sections array
				oSections.push( oLink.parentNode.parentNode );
			}
		}
	}
	
	function mToggle() {
		var i = 0, oSection;
		var oTargetSection = this.parentNode.parentNode;
		
		// close all submenus
		while ( oSection = oSections[i++] ) {
			if ( oTargetSection != oSection ) {
				oSection.className = oSection.className.detach( "open" );
			}
		}
		
		// Open or close the submenu that generated the event
		if ( !oTargetSection.className.contains("open") ) {
			oTargetSection.className = oTargetSection.className.attach( "open" );
		} else {
			oTargetSection.className = oTargetSection.className.detach( "open" );
		}
	}
}