var application = {
		
	initNavigationOverlays: function(options){
		var navigationItems = $$('.navigation li a');
		
		navigationItems.each(function(item){
			var overlay = Builder.node('span', { className: 'overlay' }).setOpacity(0),
				overEffect, outEffect;
			
			item.insert({ bottom: overlay });
			
			item.observe('mouseover', function(event){
				overEffect = new Effect.Opacity(overlay, { to: 1, from: 0, duration: 0.5, beforeStart: function(){ if(outEffect) outEffect.cancel(); } });
			});
			
			item.observe('mouseout', function(event){
				outEffect = new Effect.Opacity(overlay, { to: 0, from: 1, duration: 0.5, beforeStart: function(){ if(overEffect) overEffect.cancel(); } });
			});
		});
	},
}

document.observe('dom:loaded', function() {
	application.initNavigationOverlays();
});
