// function to determine how far horizontally the browser is scrolled  
  function scrollX() {
  	var de = document.documentElement;
	return self.pageXOffset || (de && de.scrollLeft) || document.body.scrollLeft;
  }
  
  // function to determine how far verticallly the browser is scrolled
  function scrollY() {
  	var de = document.documentElement;
	return self.pageYOffset || (de && de.scrollTop) || document.body.scrollTop;
  }

  // return the height of the veiwport	
  function windowHeight() {
   	var de = document.documentElement;
	return self.innerHeight || (de && de.clientHeight) || document.body.clientHeight;
  }
  // return the width of the veiwport	
  function windowWidth() {
   	var de = document.documentElement;
	return self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;
  }
  
  /***** function to create the lightbox  
  bxContent : url of the external document or text message 
  bxTitle: title of the box
  w, h of the box
  type: 0 - normal message text
  		1 - external document
  redirectUrl: url to redirect to after user click Close button.
  *******/
  		
  function showBox(bxContent, bxTitle, w, h, type, redirectUrl )
  { 
	if(typeof(bxTitle)=="undefined") 	bxTitle =document.title;
	if(typeof(w)=="undefined") 			w=600;
	if(typeof(h)=="undefined") 			h=480;
	if(typeof(type)=="undefined") 		type=0;	
	/*
	if (type==0) {
		w=500;
		h=150;
	}
	*/
	var wint = ((windowHeight()/2 ) - (h))-100;
	var winl = scrollX() + (windowWidth()/2 ) - (w/2);
	if (h > (windowHeight()/2))  wint = wint - (h - (windowHeight()/2))-100;
	if (wint<0)   wint = 10;	
	
    var layer = document.createElement('div');
    layer.id = 'layer';
	layer.style.height= windowHeight() + document.documentElement.offsetHeight  + 'px'; // add document.documentElement.offsetHeight so it will cover whole page in IE
    document.body.appendChild(layer); 
   
    var div = document.createElement('div');
    div.id = 'box';
    div.style.height = h;
    div.style.width = w;
    div.style.top = wint + 'px';
	div.style.left = winl + 'px';
    // div.style.border = '1px solid silver';
    document.body.appendChild(div); 
	
	// heading
    var elhd = document.createElement('div');
	elhd.className = 'boxedhead hd';
	elhd.innerHTML = bxTitle; 
	div.appendChild(elhd);	  	  
	
	// content  
    var elc = document.createElement('div');
	elc.className = 'boxed content'
	elc.style.height =  (h - elhd.style.height - 20);
	elc.innerHTML = ((type==0) ? '<p>' + unescape(bxContent) + '</p>' : ajaxinclude(bxContent)); //+ '<br><br>' ;	
	
	var elft = document.createElement('div');
	elft.className = 'boxed ft';
		// close button	
	    var a = document.createElement('input');
		a.type = 'button';
		a.className = 'button';
	    a.value = 'Continue';
	    a.onclick = function()
	    {
	      document.body.removeChild(document.getElementById('layer'));
	      document.body.removeChild(document.getElementById('box'));
		  if(typeof(redirectUrl)!="undefined" && redirectUrl!="" )		  
		  	location.replace(unescape(redirectUrl));
	    };

	elft.appendChild(a);		
		
	div.appendChild(elc);
	div.appendChild(elft);		
	
	if (elhd.style.height+elc.style.height+elft.style.height < h)   div.style.height = elhd.style.height+elc.style.height+elft.style.height;

  }