window.addEvent( 'domready', function() {

	var $body = window.document.body;
	
	if ( $body.getElement( '.is_ie6' ) || $body.getElement( '.is_ie7' ) )
		return;
		
	$body.setStyles({ 'overflow-x': 'hidden', 'background-image': 'none', 'background-color': 'black' });
	
	var $bg = new Element( 'img', {
		id: 'background',
		width: 3360,
		height: 2100,
		src: '/Resources/BML/Sites/TeacherTraining/Layout/bg-03.jpg',
		style: 'z-index: 0; position: absolute; bottom: 0px; left: 0px; background: white'
	}).inject( $body );

	var resizeImage = (function() {
	
		$bg.setProperties({
			width: 3360,
			height: 2100
		});
		
		var windowSize = $body.getSize();
		
		var windowWidth = window.getSize().x,
			windowHeight = window.getSize().y;
		
		var imageWidth = $bg.getProperty( 'width' ),
			imageHeight = $bg.getProperty( 'height' );
		
		var newSize = scaleSize( windowWidth, windowHeight, imageWidth, imageHeight );
		
		var newWidth = newSize[0],
			newHeight = newSize[1];
			
		if ( newHeight < windowHeight )
		{
			var ratio = windowHeight / newHeight;
			
			newWidth = newWidth * ratio;
			newHeight = newHeight * ratio;
		}
		
		$bg.setProperties({
			width: newWidth,
			height: newHeight
		});
	
	});
	
	var scaleSize = ( function( maxW, maxH, currW, currH ) {
		
		var ratio = currH / currW;
		
		if ( currW >= maxW && ratio <= 1 )
		{
			currW = maxW;
			currH = currW * ratio;
		}
		else if ( currH >= maxH )
		{
			currH = maxH;
			currW = currH / ratio;
		}
		
		return [currW, currH];
	
	});
	
	resizeImage();
	
	window.addEvent( 'resize', function() {
		
		resizeImage();
	
	});

});