//MENU INTRO

window.addEvent('domready', function(){
	//First Example
	var el = $('myElement'),
		color = el.getStyle('backgroundColor');
		$('myFond').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});

window.addEvent('domready', function(){
	//First Example
	var el = $('myElement1'),
		color = el.getStyle('backgroundColor');
		$('myFond1').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement1').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond1').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond1').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});

window.addEvent('domready', function(){
	//First Example
	var el = $('myElement2'),
		color = el.getStyle('backgroundColor');
		$('myFond2').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement2').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond2').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond2').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});

window.addEvent('domready', function(){
	//First Example
	var el = $('myElement3'),
		color = el.getStyle('backgroundColor');
		$('myFond3').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement3').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond3').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond3').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});


//MENU INDEX

window.addEvent('domready', function(){
	//First Example
	var el = $('myElement4'),
		color = el.getStyle('backgroundColor');
		$('myFond4').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement4').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond4').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond4').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});

window.addEvent('domready', function(){
	//First Example
	var el = $('myElement5'),
		color = el.getStyle('backgroundColor');
		$('myFond5').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement5').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond5').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond5').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});

window.addEvent('domready', function(){
	//First Example
	var el = $('myElement6'),
		color = el.getStyle('backgroundColor');
		$('myFond6').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement6').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond6').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond6').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});

window.addEvent('domready', function(){
	//First Example
	var el = $('myElement7'),
		color = el.getStyle('backgroundColor');
		$('myFond7').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement7').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond7').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond7').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});
window.addEvent('domready', function(){
	//First Example
	var el = $('myElement8'),
		color = el.getStyle('backgroundColor');
		$('myFond8').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement8').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond8').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond8').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});
window.addEvent('domready', function(){
	//First Example
	var el = $('myElement9'),
		color = el.getStyle('backgroundColor');
		$('myFond9').set('opacity', 0.7);
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('myElement9').addEvents({
		'mouseenter': function(){
			// This morphes the opacity and backgroundColor
			$('myFond9').morph({
				'opacity': 1,
				'background-color': '#6f5d4f'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			$('myFond9').morph({
				'opacity': 0.7,
				'background-color': '#000000'
			});
		}
	});
});