window.addEvent('domready', function(){
	var szNormal = 170, szSmall  = 128, szFull   = 300;
	
	var kwicks = $$("#kwick .kwick");
	var fx = new Fx.Elements(kwicks, {wait: false, duration: 200, transition: Fx.Transitions.Quad.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);
		});
	});
	
	$("kwick").addEvent("mouseleave", function(event) {
		var o = {};
		kwicks.each(function(kwick, i) {
			o[i] = {width: [kwick.getStyle("width").toInt(), szNormal]}
		});
		fx.start(o);
	})
	
	var kwicks2 = $$("#kwick2 .kwick2");
	var fx2 = new Fx.Elements(kwicks2, {wait: false, duration: 200, transition: Fx.Transitions.Quad.easeOut});
	kwicks2.each(function(kwick2, i) {
		kwick2.addEvent("mouseenter", function(event) {
			var o = {};
			o[i] = {width: [kwick2.getStyle("width").toInt(), szFull]}
			kwicks2.each(function(other, j) {
				if(i != j) {
					var w = other.getStyle("width").toInt();
					if(w != szSmall) o[j] = {width: [w, szSmall]};
				}
			});
			fx2.start(o);
		});
	});
	
	$("kwick2").addEvent("mouseleave", function(event) {
		var o = {};
		kwicks2.each(function(kwick2, i) {
			o[i] = {width: [kwick2.getStyle("width").toInt(), szNormal]}
		});
		fx2.start(o);
	})
	
	var mySlide = new Fx.Slide('kwick').hide();
	
	$('toggle').addEvent('click', function(e){
	e = new Event(e);
	mySlide.toggle();
	e.stop();
	});
	
	var mySlide2 = new Fx.Slide('kwick2').hide();
	
	$('toggle2').addEvent('click', function(e2){
	e2 = new Event(e2);
	mySlide2.toggle();
	e2.stop();
	});

});