function updateBackground() 
{
	screenWidth = $(window).width();
	screenHeight = $(window).height();
	
	var bg = jQuery("#bg");
	
	
	// Proporcion horizontal/vertical. En este caso la imagen es cuadrada
	ratio = 1;
	if (screenWidth/screenHeight > ratio) 
	{
		$(bg).height("auto");
		$(bg).width("100%");
	} 
	else 
	{
		$(bg).width("auto");
		$(bg).height("100%");
	}
	
	// Si a la imagen le sobra anchura, la centramos a mano
	if ($(bg).width() > 0) 
	{
		$(bg).css('left', (screenWidth - $(bg).width()) / 2);
	}
}

function wrapperCenter ()
{
	$('.wrapper').css({
        position:'absolute',
        left: ($(window).width() - $('.wrapper').outerWidth())/2,
        top: ($(window).height() - $('.wrapper').outerHeight())/2
   });
}

$(document).ready(function() 
{
	// Actualizamos el fondo al cargar la pagina
	updateBackground();
	wrapperCenter();
	
	$(window).bind("resize", function() 
			{
			// Y tambien cada vez que se redimensione el navegador
				updateBackground();
				wrapperCenter();
				
			});
	

	
	
});