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

/*var nofade = $$("#slogan li#current").setOpacity(1);*/
/*fadestyle.start(0,1);*/
/*fades.addEvents({
	'mouseenter': function(e) {
        fadestyle.start(0,1);
	},
 
	'mouseleave': function(e) {
        fadestyle.start(1,0);
	}
});*/
 
var list = $$("#slogan li.normal").setOpacity(0.4); 
list.each(function(element) {

    var fx = new Fx.Style(element, 'opacity', {
	duration: 500, 
	transition: Fx.Transitions.Quart.easeInOut,
	wait: false
});
 
	element.addEvent('mouseenter', function(){
		fx.start(0.4,1);
	});
 
	element.addEvent('mouseleave', function(){
		fx.start(1,0.4);
	});
 
});
 
/*fades.each(function(fade, i) {
	fade.addEvent("mouseenter", function(event) {
		fade.start(0,1);
	});
});*/
 
 
 
 
 
});

/*	you should use "var exampleFx = ..." below
		but due to the way I execute code in these blocks,
		I declared this variable already */
/*exampleFx = new Fx.Style('fxTarget', 'opacity', {
	duration: 500, 
	transition: Fx.Transitions.Quart.easeInOut
});
/*	now we have an fx object, let's play with it:	*/
/*exampleFx.start(1,0); /*fade it out*/
 
/*exampleFx.start.pass([0,.5], exampleFx).delay(1000);
/*	wait a sec, bring it back to half way
		then wait another sec and bring it all the way back	*/
/*exampleFx.start.pass([.5,1], exampleFx).delay(2000);
/*	let's try from visible to hidden then back	*/
/*exampleFx.start.pass([1,0], exampleFx).delay(3000);
exampleFx.start.pass([0,1], exampleFx).delay(4000);*/