function layoutFeaturePopup() {
	// set size of feature popup
	var w = document.body.clientWidth;
	var h = document.body.clientHeight;
	
	w -= 5;
	h -= 5;

	var scroll = getScrollPosition();

	var featureMarginTop = 100;
	var featureMarginLeft = 300;
	var featureMarginRight = 50;
	var featureMarginBottom = 50;

	var featureWidthOpt = 600;
	var featureMarginLeftMin = 100;
	var featureMarginLeftMax = 500;

	var featureWidth = w - featureMarginLeft - featureMarginRight;

	// enforce maximum left margin
	if (featureWidth > featureWidthOpt) {
		var adj = featureWidth - featureWidthOpt;
		var adjadj = (featureMarginLeft + adj) - featureMarginLeftMax;
		if (adjadj > 0) {		
			adj -= adjadj;
		}
		else {
			adjadj = 0;
		}
		featureMarginLeft += adj;
		featureWidth = featureWidthOpt; // + adjadj;
	}

	// enforce minimum left margin
	if (featureWidth < featureWidthOpt) {
		var adj = featureWidthOpt - featureWidth;
		var adjadj = featureMarginLeftMin - (featureMarginLeft - adj);
		if (adjadj > 0) {		
			adj -= adjadj;
		}
		else {
			adjadj = 0;
		}
		featureMarginLeft -= adj;
		featureWidth = featureWidthOpt - adjadj;
	}

	var featureCloseButtonMargin = 30;

	style = document.getElementById("feature").style;
	style.top = 0 + scroll.y + featureMarginTop + "px";
	style.left = 0 + scroll.x + featureMarginLeft + "px";
	style.width = 0 + featureWidth + "px";
	style.height = 0 + h - featureMarginTop - featureMarginBottom + "px";

	var bstyle = document.getElementById("featurecontent").style;
	bstyle.height = 0 + h - featureMarginTop - featureMarginBottom - featureCloseButtonMargin + "px";
}

function showFeature(id) {
	document.getElementById('featurecontent').innerHTML = document.getElementById(id).innerHTML;
	document.getElementById('feature').style.display='block';
}

function hideFeature() {
	document.getElementById('feature').style.display='none';
}

function toggleScreenshot( id, slot) {
	if (slot == 'us') {
		document.getElementById(id+'-them').style.display = 'none';
		document.getElementById(id+'-us').style.display = 'block';
	}
	else {
		document.getElementById(id+'-us').style.display = 'none';
		document.getElementById(id+'-them').style.display = 'block';
	}
}
