window.addEvent('domready', function() {
	var maxDim = 240, maxMargin = 36;
	var pages = $$('#pages li a');
	var fx = new Fx.Elements(pages, {
		link: 'cancel',
		duration: 750,
		fps: 50,
		transition: Fx.Transitions.Back.easeOut
	});
	
	pages.each(function(page, i) {
		page.addEvent('mouseenter', function(event) {
			var styles = new Object();
			styles[i] = {
				width: [page.getSize().x, maxDim],
				height: [page.getSize().x, maxDim],
				'margin-top': maxMargin
			};
			
			pages.each(function(other, j) {
				if (i != j) {
					var w = other.getSize().x;
					
					if (w != maxDim / 2) {
						styles[j] =	{
							width: [w, maxDim / 2],
							height: [w, maxDim / 2],
							'margin-top': -maxMargin / 3
						};
					}
				}
			});
			
			fx.start(styles);
		});
	});
	
	$$('#pages li').addEvent('mouseleave', function(event) {
		var styles = new Object();
		pages.each(function(page, i) {
			styles[i] =	{
				width: [page.getSize().x, 5 * maxDim / 8],
				height: [page.getSize().x, 5 * maxDim / 8],
				'margin-top': 0
			};
		});
		
		fx.start(styles);
	});
});