// FORMAT MENU STYLES
		var sActiveParentBgColor = ''; // Mid blue
		var sActiveParentColor = ''; // White
		var sInactiveParentBgColor = ''; //Dark Blue
		var sInactiveParentColor = '#000000'; // White
		var sSubMenuBorderColor = '#def0c5';
		var sSubMenuActiveBgColor = '#94c93e';
		var sSubMenuActiveColor = '#ffffff'; // Post rollover foreground colour

		// GLOBAL MENU ITEMS
		var aMenuItems = new Array();
		
		var iClearTimeout = null;
		
		function menuItem(sID, sMenuItemLabel, sHref)
		{
			// Add ID to global menu items array
			aMenuItems[aMenuItems.length] = sID;
			
			// OBJECT VARIABLES
			this.id = sID;
			this.sMenuItemLabel = sMenuItemLabel;
			this.sHref = sHref;
			
			this.aSubMenuItems = new Array();
			
			// OBJECT METHODS
			this.active = active;
			this.inactive = inactive;
			this.addSubMenuItem = addSubMenuItem;
		}
		
		function drawMenu()
		{
			sMainLinks = '';
			var iMenuItemLeft = 0;
			for (iCounter = 0; iCounter < aMenuItems.length; iCounter++)
			{
				if (iCounter != 0) {
					iMenuItemLeft += (eval(aMenuItems[iCounter-1] +'.sMenuItemLabel').length*8) + 30;
				}
				else 
				{
					iMenuItemLeft = iCounter;
				}
				
				var sStyle = 'position:absolute;top:0px;left:'+ iMenuItemLeft +'px;';
				
				sMainLinks += '<div class="HeaderNav-MenuItem" style="'+ sStyle +'" id="'+ aMenuItems[iCounter] +'"';
				sMainLinks += ' onmouseover="'+ aMenuItems[iCounter] +'.active()" ';
				sMainLinks += ' onmouseout="'+ aMenuItems[iCounter]+'.inactive()"';
				
				if (eval(aMenuItems[iCounter] +'.sHref'))
				{
					sMainLinks += ' onclick="window.location.href = \''+ eval(aMenuItems[iCounter] +'.sHref') +'\'"';
					
					// Remove hints from the menu.
					//sMainLinks += ' title="'+ eval(aMenuItems[iCounter] +'.sHref') +'"';
				}
				
				sMainLinks += '>'+ eval(aMenuItems[iCounter] +'.sMenuItemLabel') +'</div>';
			}
			
			//alert(sMainLinks);
			document.getElementById('Layout-HeaderNav').innerHTML = sMainLinks;
		}
		
		function active()
		{
			// If the hide timeout has been set, clear it
			if (iClearTimeout) clearTimeout(iClearTimeout);
			
			// Get the current parent layer
			var oCurLayer = document.getElementById(this.id);
			
			// Apply rollover effect to parent layer
			oCurLayer.style.cursor = 'hand';
			oCurLayer.style.cursor = 'pointer';
			oCurLayer.style.color = sActiveParentColor;
			oCurLayer.style.backgroundColor = sActiveParentBgColor;
			//oCurLayer.style.backgroundImage = 'url(\'images/HeaderNav-Active-Background.png\')';
			oCurLayer.className = 'HeaderNav-MenuItem-Active';
			
			// Return all parent layers to default styles except current layer
			for (iCounter = 0; iCounter < aMenuItems.length; iCounter++)
			{
				if (this.id != aMenuItems[iCounter])
				{
					document.getElementById(aMenuItems[iCounter]).style.backgroundColor = sInactiveParentBgColor;
					document.getElementById(aMenuItems[iCounter]).style.color = sInactiveParentColor;
					document.getElementById(aMenuItems[iCounter]).className = 'HeaderNav-MenuItem';
					//document.getElementById(aMenuItems[iCounter]).style.backgroundImage = 'url(\'images/HeaderNav-Background.png\')';
				}
			}
			
			if (this.aSubMenuItems.length > 0)
			{
				// Get the sub menu item
				var oSubMenuItems = document.getElementById('Layout-HeaderNav-SubMenuItems');
				
				var iCurLayerLeft = parseInt(oCurLayer.style.left.substring(0, oCurLayer.style.left.indexOf('px'))) +8 ;
				
				// Apply rollover effect to sub menu item

				sSubMenuItems = '';
				
				// Write sub menu layers to the containment layer
				for (iCounter = 0; iCounter < this.aSubMenuItems.length; iCounter++)
				{
					if (iCounter != 0) var iMenuItemTop = (iCounter * 18) + (iCounter) ;
					else iMenuItemTop = iCounter ;
					
					// Calculate the height of the sub menu containment layer
					var iSubMenuHeight = 0;
					
					iSubMenuHeight += (iCounter * 25) + (iCounter);
					
					var sSubMenuStyle = 'position:absolute;z-index:1002;top:'+ iMenuItemTop +'px;left:0px;width:160px;';
					
					if (iCounter == (this.aSubMenuItems.length - 1)) sSubMenuStyle += 'border-bottom-color:'+ sSubMenuBorderColor +';';
					
					sSubMenuItems += '<div class="HeaderNav-SubMenuItem" style="'+ sSubMenuStyle +'" id="'+ this.id +'_'+ iCounter +'"';
					sSubMenuItems += ' onmouseover="hilite(\''+ this.id +'_'+ iCounter +'\')" ';
					sSubMenuItems += ' onmouseout="lowlite(\''+ this.id +'_'+ iCounter +'\')"';
					sSubMenuItems += ' onclick="window.location.href = \''+ this.aSubMenuItems[iCounter][1] +'\'"';
					
					//sSubMenuItems += ' title="'+ this.aSubMenuItems[iCounter][0] +'"';
					
					sSubMenuItems += '>';
					
					sSubMenuItems += '<div class="HeaderNav-SubMenuItem-Text">';
					
					sSubMenuItems += this.aSubMenuItems[iCounter][0];
					
					sSubMenuItems += '</div></div>';
				}
				
				// Write a layer to the left hand side of the sub menu containment layer to represent a border.
				// NOTE: This is a work around for IE because for some f#^&*ing reason the borders would not display 
				// on the containment layer when loading this layer for the first time!
				//sSubMenuItems += '<div style="position:absolute;top:0px;left:-1px;width:1px;height:'+ (iSubMenuHeight + 26) +'px;background-color:'+ sSubMenuBorderColor +';"></div>';
				
				// Write a layer to the right hand side of the sub menu containment layer to represent a border.
				// NOTE: This is a work around for IE on a Mac!
				//sSubMenuItems += '<div style="position:absolute;top0px;left:180px;width:1px;height:'+ (iSubMenuHeight + 26) +'px;background-color:'+ sSubMenuBorderColor +';"></div>';
				
				// Adjust the sub menu containment layer
				oSubMenuItems.style.height = (iSubMenuHeight + 26) +'px';
				
				oSubMenuItems.innerHTML = sSubMenuItems;
				oSubMenuItems.style.visibility = 'visible';
				oSubMenuItems.style.position = "absolute"
				oSubMenuItems.style.left = (iCurLayerLeft) +'px';
				oSubMenuItems.style.width = '180px';
				oSubMenuItems.style.top = '139px';
				oSubMenuItems.style.zIndex = 3000;
				
			}
			else
			{
				// Get the sub menu items and hide them
				var oSubMenuItems = document.getElementById('Layout-HeaderNav-SubMenuItems')
				
				oSubMenuItems.style.visibility = 'hidden';
			}
		}
		
		function inactive()
		{
			iHideTime = 600;
			
			iClearTimeout = setTimeout("hide()", iHideTime);
		}
		
		function addSubMenuItem(sMenuItemLabel, sHref)
		{
			this.aSubMenuItems[this.aSubMenuItems.length] = new Array(sMenuItemLabel, sHref);
		}
		
		function hide()
		{
			// Return all parent layers to default styles
			for (iCounter = 0; iCounter < aMenuItems.length; iCounter++)
			{
				document.getElementById(aMenuItems[iCounter]).style.backgroundColor = sInactiveParentBgColor;
				document.getElementById(aMenuItems[iCounter]).style.color = sInactiveParentColor;
				//document.getElementById(aMenuItems[iCounter]).style.backgroundImage = 'url(\'images/HeaderNav-Background.png\')';
				document.getElementById(aMenuItems[iCounter]).className = 'HeaderNav-MenuItem';
			}
			
			// Set up the sub menu item
			var oSubMenuItems = document.getElementById('Layout-HeaderNav-SubMenuItems')
			
			oSubMenuItems.style.visibility = 'hidden';
		}
		
		function hilite(sLayerId)
		{
			var oCurLayer = document.getElementById(sLayerId);
			
//			oCurLayer.style.backgroundColor = sSubMenuActiveBgColor;
//			oCurLayer.style.color = sActiveParentColor;
			oCurLayer.className = 'HeaderNav-SubMenuItem-Active';
			
			// If the hide timeout has been set, clear it
			if (iClearTimeout) clearTimeout(iClearTimeout);
		}
		
		function lowlite(sLayerId)
		{
			var oCurLayer = document.getElementById(sLayerId);
			
//			oCurLayer.style.backgroundColor = '';
//			oCurLayer.style.color = sSubMenuActiveColor;
			

			oCurLayer.className = 'HeaderNav-SubMenuItem';
			// Set the timeout for the sub menu
			iHideTime = 600;
			
			iClearTimeout = setTimeout("hide()", iHideTime);
		}