// JavaScript Document
$(window).load(resizeWindow);
document.write('<style type="text/css"> #hero-image {display: none;} </style>');

$(document).ready(function(){
	
	//If the User resizes the window, adjust the #container height
	//$(window).bind("resize", resizeWindow);
	

});

$( window ).resize(function() {
	resizeWindow();
});


function resizeWindow() {
	var wrapper = $('body');
	var hero = $("#hero-image");
	h = wrapper.height();
	w = wrapper.width();
	pageratio = h / w;
	imageratio = hero.height() / hero.width();
	if(pageratio < imageratio) {
		h = "100%";
		w = 'auto';
	} else {
		w = 'auto';
		h = "100%"
	}
	hero.css("height", h );
	hero.css("width", w );
	hero.show();
}