function sizePanels(loc) {
	var c = document.getElementById('content');
	var lh = Math.max(10,c.offsetHeight - 150); // see below
	var rh;
	if (loc == 'cp') {
		rh = c.offsetHeight - (20 + 30 + 20 + 114 + 52 + 72 + 102 + 6);
		// = rhheader.height, colours.height, colourscheme.height, edit.height, mainblock.height, rgbsliders.height, savefields.height
		// + 6... I think this is the border/padding/border of the right-panel itself...?
	}
	else {
		rh = Math.max(10,c.offsetHeight - 208);
		// prevents IE errors if rh drops below zero
		// this mainly happens on the text-only page -- not *quite* sure why
	}
	// 150 is the total height of all the menu items
	// 208 is the total height of the right-hand stuff [colourscheme and iboxes, or colourpick stuff]
	// -4 and -6 below takes into account... er... border/padding of each outerpanel
	// and the borders of the innerpanel respectively. Phew ;-)
	// we should probably do this dynamically in javascript for neatness
	document.getElementById('panel_left').style.height = (lh-4) + 'px';
	document.getElementById('subpanel_left').style.height = (lh-6) + 'px';
	document.getElementById('panel_right').style.height = (rh-4) + 'px';
	document.getElementById('subpanel_right').style.height = (rh-6) + 'px'; 
}