var Scaling = {
	ref: null,
	classRatios: {
		larger: 0.22,
		largest: 0.17
	},
	setup: function() {
		Scaling.ref = document.body.appendChild(document.createElement("div"));
		var ref = Scaling.ref;
		ref.appendChild(document.createTextNode("reference"));
		ref.style.position = "absolute";
		ref.style.top = "0";
		ref.style.left = "-123em";
		ref.style.width = "10em";
		Scaling.scaleToRatio();
		window.onresize = Scaling.scaleToRatio;
		if (navigator.userAgent.indexOf("MSIE") == -1) setInterval(Scaling.scaleToRatio, 1000);
	},
	getRatio: function() {
		var docWidth = document.documentElement.clientWidth;
		var ratio = Scaling.ref.offsetWidth / docWidth;
		return ratio;
	},
	scaleToRatio: function() {
		var ratio = Scaling.getRatio();
		var ratios = Scaling.classRatios;
		var newClassName = "";
		for (var className in ratios)
			if (ratios[className] > ratio) newClassName = className;
		document.body.className = newClassName;
	}
};

var queryElements = [];
function queryElementById(id, f) {
	var n = document.getElementById(id);
	if (!n && !window.loaded) setTimeout(function() { queryElementById(id, f); }, 200);
	else if (n && !n.queried && f) {
		n.queried = true;
		f();
	}
}
window.loaded = false;
window.onload = window.onstop = function() {
	this.loaded = true;
	queryElementById("creator", Scaling.setup);
};
queryElementById("creator", Scaling.setup);
