document.observe("dom:loaded", function() {
	$$("#navi .naviItem").each(function(naviItem) {
		var subnaviContainer = naviItem.select(".subnavi").first();
		var naviItemWidth = naviItem.getWidth();
		
		naviItem.observe("mouseover", function() {
			this.addClassName("hover");
				
			if(subnaviContainer) {
				var backgroundPosition = 300 - naviItemWidth;
			
				subnaviContainer.setStyle({
					backgroundPosition: "-" + backgroundPosition + "px 0px"
				});
				subnaviContainer.show();
			}
		});
		
		naviItem.observe("mouseout", function() {
			this.removeClassName("hover");
			
			if(subnaviContainer) {
				subnaviContainer.hide();
			}
		});
	});
});