document.observe('dom:loaded', function() {
	var outerSpace = 0;
	var navContainerElem = $$(subNavContainer).first();
	var navContainerWidth = navContainerElem.getWidth()-(outerSpace*2);
	var navSpacerWidth = 0;
	var navElemsWidth = 0;
	var navSpacerWidth = 0;
	var navSpacerWidthInt = 0;
	
	var navElems = $$(subNavContainer+' li:not([class='+spacer+'])');
	var navSpacerImg = $$(subNavContainer+' li[class='+spacer+']').invoke('firstDescendant');
	var navSpacerCount = navSpacerImg.size();
	
	navElems.each(function(navElem) {
		navElemsWidth += navElem.getWidth();
	})
	
	navSpacerWidth = (navContainerWidth - navElemsWidth)/navSpacerCount;
	navSpacerWidthInt = Math.floor(navSpacerWidth);
	var spacerCorrectionInt = Math.floor((((navSpacerWidth - navSpacerWidthInt)*navSpacerCount)));
	var corrSpacerInt = 0;
	navSpacerImg.each(function(spacerImg) {
		if(spacerCorrectionInt>0) {
			corrSpacerInt = 1;
			spacerCorrectionInt--;
		} else 
			corrSpacerInt=0;
			
		spacerImg.setStyle({'width' : (navSpacerWidthInt+corrSpacerInt)+"px"});
	});
	navContainerElem.insert({top: '<li style="width:'+outerSpace+'px;"></li>'});
//	navContainerElem.insert({bottom: '<li style="width:'+outerSpace+'px;"></li>'});
});