Event.observe(window, 'load', function() {
	//background layer to hide dynamic stuff
	if($('pageloadWhiteLayer') != undefined) {
		$('pageloadWhiteLayer').fade();
	}

	//set bottom of navi layers width
	$$('.schneiderLayerBGMiddle').each(function(elem) {
		var layerWidth = elem.ancestors();
		layerWidth = layerWidth[0].getWidth();
		elem.setStyle({
			'width': layerWidth-12+'px'
		});
	});

	$$('.schneiderHeaderRed').each(function(elem) {
		elem.observe('mouseover', function(event) {
			resetHeaderNavi();
		});
	});
	
	$$('.schneiderLayer').each(function(elem) {
		elem.setStyle({
			'zIndex': '8'
		});

	});
	
	$('naviWrapper').setStyle({
			'zIndex': '6'
	});

	/* -------------------------------------------- */

	//set right margin on grey tabs
	$$('.naviCategory').each(function(elem) {
		elem.setStyle({
			'marginRight': greyTabMargin+'px'
		});
	});

	//fix width of last li to make total width 100%
	//calculate width of all bottom navi tabs
	var totalWidth = 0;
	$$('.naviCategory').each(function(elem) {
		totalWidth += elem.getWidth()+greyTabMargin;
	});
	totalWidth -= greyTabMargin;
	
	//get header width
	var headerWidth = $('topnavi').getWidth();

	var lPadding = Math.floor((headerWidth - totalWidth) / 20);
	var rPadding = Math.floor((headerWidth - totalWidth - (10 * lPadding)) / 10);
	var rPaddingLast = (headerWidth - totalWidth) - ((lPadding + rPadding) * 10) + rPadding;

	$$('.naviCategory').each(function(elem) {
		elem.setStyle({
			'paddingLeft': lPadding+'px'
		});
		elem.firstDescendant().setStyle({
			'paddingRight': rPadding+'px'
		});
	});

	//ie9
	if(parseInt(navigator.userAgent.substring(navigator.userAgent.indexOf("MSIE")+5)) ==9)
	{
		//set computed style of last li
		$('9').setStyle({
			'position': 'absolute',
			'right': '0px',
			'bottom': '1px'
		});
		
		//set computed style of last li's a tag
		$('9').firstDescendant().setStyle({
			'padding-bottom': '3px'
		});
	} else {
	//all other browsers
		//set computed style of last li
		$('9').setStyle({
			'position': 'absolute',
			'right': '0px',
			'bottom': '0px'
		});
	}
	
	//set computed style of last li's a tag
	$('9').firstDescendant().setStyle({
		'paddingRight': rPaddingLast+'px'
	});

	//set margin on red tabs
	$$('.schneiderHeaderRed').each(function(elem){
		elem.setStyle({
			'marginRight': redTabMargin+'px'
		});
	})
	/* -------------------------------------------- */

	//position navi layers based on parent's position
	$$('.naviCategory').each(function(elem) {
		//position corresponding layer
		var offset = elem.positionedOffset();
		var naviLayerX = offset[0];
		var naviHeight = elem.getHeight();

		// test for IE7
		var ie7 = parseInt(navigator.userAgent.substring(navigator.userAgent.indexOf("MSIE")+5)) == 7;
		if(ie7)
		{
			naviHeight -= 24;
		};

		if($('layer_'+elem.identify()) != null)
		{
			//test for too wide, if yes: set layer to right of tab.  if no: left of tab
			if(naviLayerX+$('layer_'+elem.identify()).getWidth() <= 968)
			{
				$('layer_'+elem.identify()).setStyle({
					'left': naviLayerX+'px',
					'top': naviHeight-3+'px'
				});
			} else {
				naviLayerX += elem.getWidth()-$('layer_'+elem.identify()).getWidth();
				$('layer_'+elem.identify()).setStyle({
					'left': naviLayerX+'px',
					'top': naviHeight-3+'px'
				});
			}
		}

		//mouseover
		elem.observe('mouseover', function(event) {
			resetHeaderNavi();
			if($('layer_'+elem.identify()) != null)
			{
				$('layer_'+elem.identify()).show();
				$('headerJSLayer').show();
				
				//set bottom width (have to do it here thanks to ie7)
				var idObject = $('layer_bottom_'+elem.identify())
				if (idObject != null)
				{
					idObject.setStyle({
					'width': $('layer_'+elem.identify()).getWidth()-12+'px'
					});
				}
			}
		});
	});

	//hide layers on page load
	$$('.schneiderLayer').each(function(elem) {
		elem.hide();
	});

	//hide JS layer on page load
	$('headerJSLayer').hide();

	//mouseout header top wrapper
	$('headerJSLayer').observe('mouseover', function(event) {
		resetHeaderNavi();
	});
	
	initMandantEvents();
});

// resets the header navi to original state (all layers hidden, no hover effects)
function resetHeaderNavi()
{
	// hide all layers
	$$('.schneiderLayer').each(function(elem) {
		elem.hide();
		elem.setStyle({
			'zIndex': '112',
			'visibility': 'visible'
		});
	});
	
	// hide JS Layer
	$('headerJSLayer').hide();
};