window.addEvent('domready', function(){
	
	var accordion = new Accordion('h3.atStart', 'div.atStart', {
		opacity: false,
		onActive: function(toggler, element){
			toggler.setStyle('color', '#ff3300');
		},
	 
		onBackground: function(toggler, element){
			toggler.setStyle('color', '#222');
		}
	}, $('accordion'));
	
	var list = $$('.idList li');
	list.each(function(element) {
	 
		var fx = new Fx.Styles(element, {duration:400, wait:false});
	 
		element.addEvent('mouseenter', function(){
			fx.start({
				'margin-left': 8,
				'background-color': '#c3f6ff',
				color: '#ff8'
			});
		});
	 
		element.addEvent('mouseleave', function(){
			fx.start({
				'margin-left': 0,
				'background-color': '#fff',
				'color': '#888'
			});
		});
	 
	});

	var szNormal = 115, szSmall  = 69, szFull   = 300;
	 
	var kwicks = $$("#index_flow .kwick");
	var fx = new Fx.Elements(kwicks, {wait: false, duration: 600, transition: Fx.Transitions.Back.easeOut});
	kwicks.each(function(kwick, i) {
		kwick.addEvent("mouseenter", function(event) {
			var o = {};
			o[i] = {width: [kwick.getStyle("width").toInt(), szFull]}
			kwicks.each(function(other, j) {
				if(i != j) {
					var w = other.getStyle("width").toInt();
					if(w != szSmall) o[j] = {width: [w, szSmall]};
				}
			});
			fx.start(o);
		});
	});
 
	kwicks.addEvent("mouseleave", function(event) {
		var o = {};
		kwicks.each(function(kwick, i) {
			o[i] = {width: [kwick.getStyle("width").toInt(), szNormal]}
		});
		fx.start(o);
	})


	var btns = $$('.hint_trigger');
	var divs = $$('.hint_toggle');
	 
	btns.each(function(el,index){
	    var mySlide = new Fx.Slide(divs[index], {mode: 'vertical'}).hide();
	   
	    btns[index].addEvent('click', function(e){
	        e = new Event(e);
	        mySlide.toggle();
	        e.stop();
	    });
	});

});