// Sectional slider
window.addEvent('domready', function(){

var szSmall = 50, szFull = 450, szMid = 150;
var sectional = $$("#sectional .section");
var fx = new Fx.Elements(sectional, {wait: false, duration: 300, transition: Fx.Transitions.Expo.easeInOut});

	sectional.each(function(section, i) {
	section.addEvent("mouseover", function(event) {
		var o = {};
		o[i] = {width: [section.getStyle("width").toInt(), szFull]}
		sectional.each(function(other, j) {
			if(i != j) {
				var w = other.getStyle("width").toInt();
				if(w != szSmall) o[j] = {width: [w, szSmall]};
			}
		});
		fx.start(o);
	});
	
	section.addEvent("mouseout", function(event) {
		var o = {};
		o[i] = {width: [section.getStyle("width").toInt(), szMid]}
		sectional.each(function(other, j) {
			if(i != j) {
				var w = other.getStyle("width").toInt();
				if(w != szMid) o[j] = {width: [w, szMid]};
			}
		});
		fx.start(o);
	});	
	
});
});