window.addEvent('domready', function(){

	var mouseentercolor = '#e5e4f6';

	var el = $('menu-item-anim-1'),
		color = el.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-1').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color
			});
		} 
	});
 
	var el2 = $('menu-item-anim-2'),
		color2 = el2.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-2').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color2
			});
		}
	});

	var el3 = $('menu-item-anim-3'),
		color3 = el3.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-3').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color3
			});
		}
	});

	var el4 = $('menu-item-anim-4'),
		color4 = el4.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-4').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color4
			});
		}
	});

	var el5 = $('menu-item-anim-5'),
		color5 = el5.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-5').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color5
			});
		}
	});

	var el6 = $('menu-item-anim-6'),
		color6 = el6.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-6').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color6
			});
		}
	});

	var el7 = $('menu-item-anim-7'),
		color7 = el7.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-7').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color7
			});
		}
	});

	var el8 = $('menu-item-anim-8'),
		color8 = el8.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-8').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color8
			});
		}
	});

	var el9 = $('menu-item-anim-9'),
		color9 = el9.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-9').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color9
			});
		}
	});

	var el10 = $('menu-item-anim-10'),
		color10 = el10.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-10').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color10
			});
		}
	});

	var el11 = $('menu-item-anim-11'),
		color11 = el11.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-11').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color11
			});
		}
	});

	var el12 = $('menu-item-anim-12'),
		color12 = el12.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('menu-item-anim-12').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': mouseentercolor
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color12
			});
		}
	});

	var el13 = $('back_to_cnge'),
		color13 = el13.getStyle('backgroundColor');
	
	// We are setting the opacity of the element to 0.5 and adding two events
	$('back_to_cnge').set('opacity', 1.0).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 0.7,
				'background-color': '#b10021'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1.0,
				backgroundColor: color13
			});
		}
	});

});