function overlay(overlayName, contentName) 
	{	
		el = document.getElementById(overlayName);
		el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
		
		if (el.style.visibility == "hidden")
		{
	    if (window.detachEvent)
		    window.detachEvent('onresize', OnWindowResize);
	    else if (window.removeEventListener)
		    window.removeEventListener('resize', OnWindowResize, false);
	    else
		    window.onresize = null;
		}else
		{
		  // set initial screen width/height
		  el.style.width = document.documentElement.offsetWidth + 'px';
		  el.style.height = document.documentElement.offsetHeight + 'px';				
  		  	  
  		// set our external method parameters
      vOverlayName = overlayName;
      vContentName = contentName;	       		  		
  		  		
	    // call once to center everything
	    OnWindowResize();	
    	
	    if (window.attachEvent)
		    window.attachEvent('onresize', OnWindowResize);
	    else if (window.addEventListener)
		    window.addEventListener('resize', OnWindowResize, false);
	    else
		    window.onresize = OnWindowResize;
    	
	    // we won't bother with using javascript in CSS to take care
	    //   keeping the window centered
	    if (document.all)
		    document.documentElement.onscroll = OnWindowResize;
	}
}

function closeOverlay()
{
	overlay(vOverlayName, vContentName);
}

var vOverlayName, vContentName;
function OnWindowResize()
{
	// we only need to move the dialog based on scroll position if
	// we're using a browser that doesn't support position: fixed, like < IE 7
	var left = window.XMLHttpRequest == null ? document.documentElement.scrollLeft : 0;
	var top = window.XMLHttpRequest == null ? document.documentElement.scrollTop : 0;
	
	// centre overlay  div
	var div = document.getElementById(vOverlayName);
	div.style.width = GetWindowWidth() + 'px';
	div.style.height = GetWindowHeight() + 'px';			
	div.style.left = Math.max((left + (GetWindowWidth() - div.offsetWidth) / 2), 0) + 'px';
	div.style.top = Math.max((top + (GetWindowHeight() - div.offsetHeight) / 2), 0) + 'px';
			
	// centre overlay content div	
	var divcontent = document.getElementById(vContentName);
	divcontent.style.left = (GetWindowWidth())/2 - (divcontent.offsetWidth)/2 + 'px';
	divcontent.style.top = "0px";//(top + (GetWindowHeight()*2 - divcontent.offsetHeight)/2) - divcontent.offsetHeight*2  + 'px';	
	//debug: alert("top=" + top + "&left=" + left + "&overlayTop=" + div.style.top + "&contenttop=" + divcontent.style.top);
}

function GetWindowWidth()
{
	var width =
		document.documentElement && document.documentElement.clientWidth ||
		document.body && document.body.clientWidth ||
		document.body && document.body.parentNode && document.body.parentNode.clientWidth ||
		0;
		
	return width;
}

function GetWindowHeight()
{
    var height =
		document.documentElement && document.documentElement.clientHeight ||
		document.body && document.body.clientHeight ||
  		document.body && document.body.parentNode && document.body.parentNode.clientHeight ||
  		0;
  		
  	return height;
}


function $(id)
{
	return document.getElementById(id);
}