// a nice script by Jan Kassens http://mootools.kassens.net/
// this example tweaked Fx.Tween for 1.2 build, cloned events to the from div for IE6+ and webkit AF  

	var SlideBox = new Class({

		initialize: function(box){
			this.box = $(box);
			this.desc = this.box.getChildren('.desc')[0];
			this.full = this.box.getChildren('.full')[0];
			this.fx = {
				box: new Fx.Tween(this.box,{'property':'width', 'transition': 'sine:out'}),
				desc: new Fx.Tween(this.desc,{'property':'opacity', 'duration': 400}),
				full: new Fx.Tween(this.full,{'property':'height', 'transition': 'sine:out'})
			};
			this.fx.box.set(this.desc.getScrollSize().x + 12);

			var open, running;
			box.addEvent('click', (function(){
				if (running) return;
				running = true;
				this[open ? 'slideIn' : 'slideOut']();
				(function(){
					open = !open;
					running = false;
				}).delay(500 + 800 + 50, this);
			}).bind(this));
						
			this.full.addEvent('click', function(){
				Event.stopPropagation();
			});
			
			this.full.cloneEvents(box);
		},
		
		slideIn: function() {
			(function(){
				this.fx.box.setOptions({transition: Fx.Transitions.Sine.easeOut}).start(this.desc.getScrollSize().x + 12);
			}).delay(800, this);		
			this.fx.desc.start.delay(800, this.fx.desc, 1);
			this.fx.full.start(0);
		},

		slideOut: function() {
			this.fx.box.setOptions({transition: Fx.Transitions.Sine.easeOut}).start.delay(0, this.fx.box, 264);
			this.fx.desc.start(0);
			(function(){
				this.fx.full.start(this.full.getScrollSize().y);
			}).delay(800, this);
		}
		

	});