var navegador = navigator.appName
              			
			
			var myFluidGrid = {
				COLNUMBER : 2, // Minimum column number.
				COLMARGIN : 10, // Margin (in pixel) between columns/boxes.
				COLWIDTH : 185, // Fixed width of all columns.
				ABSOLUTE_X: 160,
				ABSOLUTE_Y: 467, //longito desde arrib al final de la foto 467 + 10 px d margen
				ALTURA_TOTAL: 0,
				MARGEN_INF: 100
				};
				
				function doLayout() {
					var pointer = 0;
					var arr = [];
					var columns = 4;// Math.max(this.COLNUMBER, parseInt($('body').innerWidth() / (this.COLWIDTH + this.COLMARGIN)));
					var anchoTotal=((columns)*(myFluidGrid.COLWIDTH))+(myFluidGrid.COLMARGIN*3)+1; //el pixel descuadrado de los 11 px de separacion
					var posicion; // recoge la posicion del elemento, la columna en la que esta 0, 1 , 2, 3 para cambiar el margen entre el elemnto 1 y 2

					
					$('.box').css('position', 'absolute').css('width', myFluidGrid.COLWIDTH  + 'px');
					$('.box').each(function() {
						var tempLeft = (pointer * (myFluidGrid.COLWIDTH + myFluidGrid.COLMARGIN));
						
						posicion=$(this).attr("id"); 
						if (posicion==2 || posicion==3) //para calcular la posicion de las segunda y tercera caja hay q tener en cuenta el px de mas del espacio de 11px
						               tempLeft=tempLeft+1;
						$(this).css('left', tempLeft + myFluidGrid.ABSOLUTE_X + 'px');
						
						
						if (navegador == "Microsoft Internet Explorer"){
						  var tempTop = myFluidGrid.ABSOLUTE_Y+10;
						}
						else{
						   var tempTop = myFluidGrid.ABSOLUTE_Y;
						   }
						if (arr[pointer]) { tempTop = arr[pointer];	}
						
						$(this).css('top', tempTop + 'px');
						
						arr[pointer] = tempTop + $(this).outerHeight();
						
						//----------PARA QUE "Pelonio" se situe bajo el grid dinamico
						if (myFluidGrid.ALTURA_TOTAL<arr[pointer]){  
						    myFluidGrid.ALTURA_TOTAL=arr[pointer];//VAmos guatrdando la altura maxima de las columnas
						    }

						$('.pie').css('position', 'absolute').css('width', anchoTotal + 'px');
						$('.pie').css('top', myFluidGrid.ALTURA_TOTAL + myFluidGrid.MARGEN_INF + 'px');
						//-----------------------------
						
						pointer++;
						if (pointer == columns) { pointer = 0; }
					});
												
					
				}
				
				
			doLayout(); 
			
			$(window).resize(function() {
				doLayout();
			});
				
		
				
			
		$(window).ready(function() {
				doLayout();
			}).resize(function() {
				doLayout();
			});
		
		$(window).load(function(){
				doLayout();
			}).resize(function() {
				doLayout();
			});
			
			
		//Por si lo anterior no basta	
	    setTimeout("doLayout();",2000);	//ms de retardo para que le de tiempo a hacer las consultas y cargar las fotos, y no se monten las fotos del grid