window.addEvent('domready', function(){
	// The same as before: adding events
	$('navBase').set('opacity',0.01).addEvents({
		'mouseenter': function(){
			// Always sets the duration of the tween to 1000 ms and a bouncing transition
			// And then tweens the height of the element
			this.set('tween', {
				duration: 250,
			//	transition: Fx.Transitions.Bounce.easeOut // This could have been also 'bounce:out'
			}).tween('opacity', '1');
		},
		'mouseleave': function(){
			// Resets the tween and changes the element back to its original size
			this.set('tween', {
				duration: 1800,			
			}).tween('opacity', '0.01');
		}
	});

  // We are setting the opacity of the element to 0.5 and adding two events
  $('head_navigation').set('opacity', 0.4).addEvents({
    mouseenter: function(){
      // This morphes the opacity and backgroundColor
      this.morph({
        'opacity': 1
      });
    },
    mouseleave: function(){
      // Morphes back to the original style
      this.morph({
        opacity: 0.4
      });
    }
  });
});