var effects = Array();
	var positions = Array();
	var fullWidth = 450;//anchura de fotos
	var initWidth = 100;//anchura de la foto central
	var newWidth = 40;//anchura de los laterales
//la anchura total es 4*newWidth +fullWidth +30px
	//var firstFocus = (Math.round(Math.random()*(4)));
	var firstFocus = 0;//panel que se abre al inicio
	
	window.onload=function(){
		Window.disableImageCache(); // Trying to disable the imageCache to fix IE6 issues
		showCases = document.getElementsByClassName('showCase'); // fetch showcase objects
		bgInitialMove = Math.round((showCases[0].getStyle('width').toInt()-newWidth)/2); // calculate how much the background should move when the initial shrink animation runs
		var numCasesCount = showCases.length; // count number of showcases

		// loop through all showcases
		showCases.each(function(showCase, i) {
			showCase.id = 'showCase'+i; // assign id
			effects[showCase.id] = showCase.effects(showCase.id, {duration: 500});
			effects[showCase.id]['bgPos'] = showCase.getStyle('background-position').toInt() - bgInitialMove; // save the original bg position

			if (i != firstFocus) {
				// shrink + move the background so it stays centered
				effects[showCase.id].custom({'width': [initWidth,newWidth], 'background-position': [showCase.getStyle('background-position').toInt(),effects[showCase.id]['bgPos']]});
			} else {
				// expand!
				effects[showCase.id].custom({'width': [initWidth,fullWidth], 'background-position': [showCase.getStyle('background-position').toInt(),0]});				
			}
			
			// add mouseover/mouseout events
			showCase.addEvent('click', function(){effects[this.id].emphasize()});
		});
	}
	
	fx.Styles.implement({
    emphasize: function(){ // mouseover
		for(var i=0; i<showCases.length; i++) {
			if ('showCase'+i != this.element.id && showCases[i].getStyle('width').toInt() > newWidth) {
				effects[showCases[i].id].clearTimer();
				effects[showCases[i].id].custom({'width': [showCases[i].getStyle('width').toInt(),newWidth], 'background-position': [showCases[i].getStyle('background-position').toInt(),effects[showCases[i].id]['bgPos']]});
			} else if ('showCase'+i == this.element.id) {
				effects[showCases[i].id].clearTimer();
				effects[showCases[i].id].custom({'width': [showCases[i].getStyle('width').toInt(),fullWidth], 'background-position': [showCases[i].getStyle('background-position').toInt(),0]});							
			}
		}
    }
	});