window.addEvent('domready', function() {
	
	//create our Accordion instance
	var myAccordion = new Accordion($('accordion'), 'h1.toggler', 'div.element', {
		opacity: true,
		//display: 0, schaltet die einzelnen DIV als start an
		onActive: function(toggler, element){
			toggler.setStyle('color', '#9BBA1B');
			toggler.setStyle('background-color', '#ffffff');
		},
		onBackground: function(toggler, element){
			toggler.setStyle('color', '#9BBA1B');
			toggler.setStyle('background-color', '#ffffff');
		}
		
		
	});
	
	$$('.toggler').addEvent('mouseenter', function()
		{ 	this.morph({
				opacity: 1,
				'background-color': '#f5f5f5',				
			}); 
		
		}); 
	
	$$('.toggler').addEvent('mouseleave', function()
		{ this.morph({
				opacity: 1,
				'background-color': '#ffffff'
			}); });
	
//************************ Mouseenter Script *********************************************************
	// We are setting the opacity of the element to 0.5 and adding two events
	
	var el = $('myElement'),
		color = el.getStyle('backgroundColor');
	
	$('myElement').set('opacity', 0.5).addEvents({
		mouseenter: function(){
			// This morphes the opacity and backgroundColor
			this.morph({
				'opacity': 1,
				'background-color': '#c6d880'
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 0.5,
				backgroundColor: color
			});
		}
	});
	//*********
	$('myOtherElement').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: 1000,
				transition: Fx.Transitions.Bounce.easeOut // This could have been also 'bounce:out'
			}).tween('height', '130px');
		},
		'mouseleave': function(){
			// Resets the tween and changes the element back to its original size
			this.set('tween', {}).tween('height', '20px');
		}
	});

//***************************************************************************************************
});