window.addEvent('domready', function() {
	var el = $('menuElement');
	
	
		//push
	
	
	var anotherEl = $('menuElement');
   		anotherEl.set('opacity','.87'); 


	// Or we just use Element.morph
	$('CSSmorphEffect').addEvent('mouseenter', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		anotherEl.morph('.myClass');
	});
	
	$('CSSmorphEffect').addEvent('mouseleave', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		anotherEl.morph('div.demoElement');
	});

	


	//science
	
	var scienceEl = $('science');
   		scienceEl.set('opacity','.87'); 


	// Or we just use Element.morph
	$('CSSmorphEffect1').addEvent('mouseenter', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		scienceEl.morph('.scienceClass');
	});
	
	$('CSSmorphEffect1').addEvent('mouseleave', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		scienceEl.morph('div.science');
	});

		//art
	
	var artEl = $('art');
   		artEl.set('opacity','.87'); 


	
	// Or we just use Element.morph
	$('CSSmorphEffect2').addEvent('mouseenter', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		artEl.morph('.artClass');
	});
	
	$('CSSmorphEffect2').addEvent('mouseleave', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		artEl.morph('div.art');
	});



	//engin
	
	var enginEl = $('engin');
		enginEl.set('opacity','.87'); 

	
	// Or we just use Element.morph
	$('CSSmorphEffect3').addEvent('mouseenter', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		enginEl.morph('.enginClass');
	});
	
	$('CSSmorphEffect3').addEvent('mouseleave', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		enginEl.morph('div.engin');
	});



	//hire
	
	var hireEl = $('hire');
		hireEl.set('opacity','.87'); 

	
	// Or we just use Element.morph
	$('CSSmorphEffect4').addEvent('mouseenter', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		hireEl.morph('.hireClass');
	});
	
	$('CSSmorphEffect4').addEvent('mouseleave', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		hireEl.morph('div.hire');
	});

	//clients
	
	var clientsEl = $('clients');
		clientsEl.set('opacity','.87'); 

	
	// Or we just use Element.morph
	$('CSSmorphEffect5').addEvent('mouseenter', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		clientsEl.morph('.clientsClass');
	});
	
	$('CSSmorphEffect5').addEvent('mouseleave', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		clientsEl.morph('div.clients');
	});

	//blog
	
	var blogEl = $('blog');
		blogEl.set('opacity','.87'); 

	
	// Or we just use Element.morph
	$('CSSmorphEffect6').addEvent('mouseenter', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		blogEl.morph('.blogClass');
	});
	
	$('CSSmorphEffect6').addEvent('mouseleave', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		blogEl.morph('div.blog');
	});

	//team
	
	var teamEl = $('team');
		teamEl.set('opacity','.87'); 

	
	// Or we just use Element.morph
	$('CSSmorphEffect7').addEvent('mouseenter', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		teamEl.morph('.teamClass');
	});
	
	$('CSSmorphEffect7').addEvent('mouseleave', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		teamEl.morph('div.team');
	});


	//contact
	
	var contactEl = $('contact');
		contactEl.set('opacity','.87'); 

	
	// Or we just use Element.morph
	$('CSSmorphEffect8').addEvent('mouseenter', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		contactEl.morph('.contactClass');
	});
	
	$('CSSmorphEffect8').addEvent('mouseleave', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		contactEl.morph('div.contact');
	});



});