var img = new Image();
    
var picWidth;
var picHeight;

var bodyWidth;
var bodyHeight;
    
var picRatio;
var bodyRatio;

function initBackground(imgUrl)
{
    img.src = imgUrl;
}

Event.observe(window, 'load', function()
{
    picWidth = img.width;
    picHeight = img.height;
    
    picRatio = picWidth/picHeight;
    $('bg').insert(img);
    img.id = "bgImage";
    
    placeBackground();

});

window.onresize = function()
{
    placeBackground();

}

function placeBackground()
{
	
	$('bg').style.display = 'none';
	
    bodyWidth = $('content').offsetWidth;
    bodyHeight = $('content').offsetHeight;
	
	

    if(bodyWidth < $('site').offsetWidth)
    {
        bodyWidth = $('site').offsetWidth;
        
    }
    
    
    if(bodyHeight < document.viewport.getHeight())
    {
        bodyHeight = document.viewport.getHeight();
    }   

    bodyRatio = bodyWidth/bodyHeight;
	
	$('bg').style.display = 'block';
    
    if(picRatio < bodyRatio)
    {
        
        
        $('bg').style.width = bodyWidth+'px';
        $('bgImage').style.width  = bodyWidth+'px';
        
        $('bg').style.height = bodyHeight+'px';
        $('bgImage').style.height=  bodyWidth/picRatio+'px';
        
        $('bgImage').style.top = '-'+(bodyWidth/picRatio-bodyHeight)/2+'px';
        $('bgImage').style.left = 0+'px';
        
    }
    else
    {
        $('bg').style.height = bodyHeight+'px';
        $('bgImage').style.height=  bodyHeight+'px';
        
        
        $('bg').style.width = bodyWidth+'px';
        $('bgImage').style.width = picRatio*bodyHeight+'px';
        
        $('bgImage').style.left = '-'+ (picRatio*bodyHeight-bodyWidth)/2+'px';
        $('bgImage').style.top = 0+'px';
        
    }       
}