var ulFlag = false;
Event.observe(window, "load", function()	{
	$$('#subNav td').each(function(subNavTD) {
		Event.observe(subNavTD, "mouseover", function() {
			$('subNavWrapper').setStyle({ background: '#d3dbb6' });
			$$('#subNav td').each(function(subNavTDCandidate){ turnLinkOff(subNavTDCandidate); });
			if(!subNavTD.hasClassName('hoverState')) subNavTD.addClassName('hoverState');
			if(subNavTD.id=='forTheHome') $('subNavWrapper').setStyle({ background: 'black' });
			if((subNavTD.previous()) && (subNavTD.previous().down().getStyle('borderRightColor')=='black')) subNavTD.previous().down().setStyle({ borderColor: '#d3dbb6' });
			if(subNavTD.down("ul") && (!subNavTD.down("ul").visible()))	{
				offset = subNavTD.cumulativeOffset();
				ul = subNavTD.down("ul");
				if(
					((BrowserDetect.browser == 'Firefox') && (BrowserDetect.OS == 'Mac') && (BrowserDetect.version == '3')) &&
					((subNavTD.id=='aromatherapy') || (subNavTD.id=='moisturizers') || (subNavTD.id=='skin'))
				) leftOffset = offset[0];
				else leftOffset = offset[0];
				ul.setStyle({ top: (offset[1] + 24) + "px", left: leftOffset + "px"});
				ul.show();
				Event.observe(ul, "mouseout", function(e){
					if(!Position.within(ul, Event.pointerX(e),Event.pointerY(e)))	{
						turnLinkOff(ul.up());
					}
				});
			}
		});
		Event.observe(subNavTD, "mouseout", function() {
			if(!subNavTD.down("ul")) turnLinkOff(subNavTD);
		});
	});
	Event.observe('mainNavWrapper', 'mouseover', function() {
		$$('#subNav td').each(function(subNavTDCandidate){ turnLinkOff(subNavTDCandidate); });
	});
});
function turnLinkOff(linkTD)	{
	if(
		(linkTD.down("ul")) && 
		(linkTD.down("ul").visible())
	)	{
		Event.stopObserving(linkTD.down("ul"), "mouseout");
		linkTD.down("ul").hide();
	}
	linkTD.removeClassName('hoverState');
	if(linkTD.previous()) linkTD.previous().down().setStyle({ borderColor: 'black' });
	$('subNavWrapper').setStyle({ background: '#d3dbb6' });
}
