var active = null;
var ie = null;

if (document.all) {
  ie = true;
}

// the variables for the window dimensions
var win_width,win_height;
var centerhor, centerver;

//Get dimensions of the window
function dimensions() {
	if(ie) {
	  win_width=document.body.clientWidth;
	  win_height=document.body.clientHeight;
	}
	else {
	  win_width=window.innerWidth;
	  win_height=window.innerHeight;
	}
	centerhor = (win_width/2) ;
	centerver = (win_height/2);
}


//position the element on the page.
function placeIt(which) {
	var condense = document.getElementById('layer' + which).style;
	if (which == 1 || which == 2){
		if(ie){
			condense.pixelLeft = centerhor + 175; 
			condense.pixelTop = 150;
		}else {
			condense.left = (centerhor+155) + 'px'; 
			condense.top = 140 + 'px';
		}
	}else if (which == 3 || which == 4) {
		if(ie){
			condense.pixelLeft = centerhor - 350; 
			condense.pixelTop = 150;
		}else {
			condense.left = (centerhor-368) + 'px'; 
			condense.top = 140 + 'px';
		}
	}
}

function displayDescription(num){
	dimensions();
	placeIt(num);
	/*first check if a layer is active and make it invisible */
	var elemID = "layer" + (num);
	if (active != null) {
		document.getElementById(active).style.visibility = "hidden";
	}

	/*now make the selected DIV visible */
	document.getElementById(elemID).style.visibility = "visible";
	/*set the new layer's ID to "active" */
	active = elemID;
}

function hideDescription(num){
	var elemID = "layer" + (num);
	document.getElementById(elemID).style.visibility = "hidden";
}

function displayDescription2(num){
	/*first check if a layer is active and make it invisible */
	var elemID = "layer" + (num);
	if (active != null) {
		document.getElementById(active).style.display = "none";
	}

	/*now make the selected DIV visible */
	document.getElementById(elemID).style.display = "block";
	/*set the new layer's ID to "active" */
	active = elemID;
}