function showOverlay($overlayDiv, $imageSrc, $imageWidth, $imageHeight) {
	var winW = 630, winH = 460;

	if (parseInt(navigator.appVersion)>3) {
 		if (navigator.appName=="Netscape") {
  			winW = window.innerWidth;
  			winH = window.innerHeight;
 		}
 		
 		if (navigator.appName.indexOf("Microsoft")!=-1) {
  			winW = document.body.offsetWidth;
  			winH = document.body.offsetHeight;
 		}
	}


	// the whole overlay layer	
	var imageLayer = document.getElementById($overlayDiv);
	
	// the img-Tag inside imageLayer 
	var largeImageTag = document.getElementById('largeImage');

	/* hide image tag to prevent flickering */
	largeImageTag.style.display = 'none';
	largeImageTag.src=$imageSrc;

	// border around image
	var border = 20;

	var imageLayerWidth = $imageWidth +  border;
	var imageLayerHeight = $imageHeight + border + 15;

	var pxLeft = (winW - imageLayerWidth) / 2;
	var pxTop = (winH - imageLayerHeight) / 2;

	//alert('Window (WxH): ' + winW + "x" + winH + "\n" + 'Layer (Left, Top): ' + pxLeft + "," + pxTop + "\n" + "ImageLayer (Width x Height): " + imageLayerWidth + "x" + imageLayerHeight);

	imageLayer.style.position = "absolute";
	imageLayer.style.left = pxLeft + "px";
	imageLayer.style.top = pxTop + "px";
	imageLayer.style.zIndex = "5000";

	imageLayer.style.padding = border + "px";
	imageLayer.style.backgroundColor = "white";

	document.images['largeImage'].width = $imageWidth;
	document.images['largeImage'].height = $imageHeight;
	
	imageLayer.style.visibility='visible';

	Effect.Appear('largeImage', {duration: 1.5});	
}

function hideOverlay ($imageLayer, $imgTag) {
	var imageLayer = document.getElementById($imageLayer); 
	var largeImageTag = document.getElementById($imgTag);	
	
	imageLayer.style.visibility='hidden';
	largeImageTag.style.display = 'none'; //.visibility = 'hidden';	
}