// JavaScript Document

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

function fullscreen(){
	//Set background size
	//Set id
	var bg = "#bg";
	var cont = "#container";
	var side = "#side";
	var main = "#main";
	var header = "#header_other";
	//Set default size
	var defaultwidth = 3872;
	var defaultheight = 2592;
	//Get browser window size
	var browserwidth = $(window).width();
	var browserheight = $(window).height();
	//Get ratio
	var ratiowidth = browserwidth / defaultwidth;
	var ratioheight = browserheight / defaultheight;
	var ratio = Math.max(ratiowidth, ratioheight);
	//Scale the image
	var scalewidth = defaultwidth * ratio;
	var scaleheight = defaultheight * ratio;
	//Center the image
	var centerx = Math.floor((browserwidth - scalewidth) / 2);
	var centery = Math.floor((browserheight - scaleheight) / 2);
	//Set background CSS
	$(bg).css({
		'width': scalewidth,'height': scaleheight,'left': centerx,'top': centery
	});
	
	//Set container size
	var sideheight = $(side).height();
	var mainheight = $(main).height();
	//Set container CSS
	if(mainheight > (sideheight + 2)){
		$(side).css({'height': mainheight});
		var sideheight2 = $(side).height();
	}
	var containerheight = $(cont).height();
	//height size
	if(browserheight > containerheight){
		$(side).css({'height': (browserheight - 232)});
	} else {
		$(side).css({'height': sideheight2 - 2});
	}
	//width size
	var containerwidth = $(cont).width();
	if(browserwidth > 1000){
		$(header).css({'width':(browserwidth - 1002)});
		$(cont).css({'width': browserwidth});
	} else {
		$(header).css({'width': 0});
		$(cont).css({'width': 1000});
	}
}