function showBef(){
        var popwidth = 360;
        var popheight = 440;
	var arrayPageSize = getPageSize();
	var arrayPageScroll = getScrollXY();


	var befdiv = document.getElementById("befpop");
        var leftpos = arrayPageScroll[0] + Math.round((arrayPageSize[2] - popwidth)/2);
        var toppos = arrayPageScroll[1] + Math.round((arrayPageSize[3] - popheight)/2);
	befdiv.style.left = leftpos + 'px';
	befdiv.style.top = toppos + 'px';
	// Prototype
	//new Ajax.Updater(befdiv, '/bef.html', {asynchronous:true, evalScripts:true});
	// JQuery
	$.get('/bef.html', function(data, status, req) {
			$('#befpop').empty();
			$('#befpop').append(data);
		});
	befdiv.style.display = "block";
	return;
}

function closeBef() {
	var befdiv = document.getElementById("befpop");
	befdiv.style.display = "none";
}


function getPageSize(){
  var xScroll, yScroll;
  if (window.innerHeight && window.scrollMaxY) {
    xScroll = document.body.scrollWidth;
    yScroll = window.innerHeight + window.scrollMaxY;
  } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
    xScroll = document.body.scrollWidth;
    yScroll = document.body.scrollHeight;
  } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
    xScroll = document.body.offsetWidth;
    yScroll = document.body.offsetHeight;
  }

  var windowWidth, windowHeight;
  if (self.innerHeight) { // all except Explorer
    windowWidth = self.innerWidth;
    windowHeight = self.innerHeight;
  } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
    windowWidth = document.documentElement.clientWidth;
    windowHeight = document.documentElement.clientHeight;
  } else if (document.body) { // other Explorers
    windowWidth = document.body.clientWidth;
    windowHeight = document.body.clientHeight;
  }

  // for small pages with total height less then height of the viewport
  if (yScroll < windowHeight) {
    pageHeight = windowHeight;
  } else {
    pageHeight = yScroll;
  }

  // for small pages with total width less then width of the viewport
  if (xScroll < windowWidth) {
    pageWidth = windowWidth;
  } else {
    pageWidth = xScroll;
  }

  arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
  return arrayPageSize;
}

function getScrollXY() {
  var scrOfX = 0, scrOfY = 0;
  if ( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  return [ scrOfX, scrOfY ];
}

// jQuery slideshow
$(window).load(function() {
	// Load the slides
	var slides = $('#slidelist li');
	// Timeout saver
	var refreshTimer;
	// Rotation speed in ms
	var refreshRate = 5000;
	// Total number of slides
	var totalSlides = slides.size();
	// Next, current, and previous
	var nextSlide = 1;
	var thisSlide = 0;
	var prevSlide = totalSlides - 1;
	// Initialize the slideshow
	init();

	// Set everything up
	function init() {
		// Load the slide and caption
		loadSlides();
		// Begin the rotation
		clearTimeout(refreshTimer);
		refreshTimer = setTimeout(function () {
			currentChange('next');	
		}, refreshRate);
		setHover();
	}

	// Set hover effect on slide list
	function setHover() {
		$('.slottext').each(function(idx,el) {
				if ( $(this).parent().hasClass('sloton') ) {
					$(this).parent().data('saveClass', 'sloton');
				} else {
					$(this).parent().data('saveClass', 'slotoff');
				}
			});
		$('.slottext').hover(function(ev) { // Hover in
				$(this).parent().removeClass('slotoff');
				$(this).parent().addClass( 'sloton' );
			},
			function(ev) { // Hover out
				$(this).parent().removeClass('sloton');
				var saved =  $(this).parent().data('saveClass');
				if ( saved ) {
					$(this).parent().addClass( saved );
				} else {
					$(this).parent().addClass( 'slotoff' );
				}
			});
	}

	// Change the current image and link
	function currentChange(direction) {
		// Identify the current image
		var fromSlide = 'slot' + thisSlide;
		// Which direction?
		switch (direction) {
		case 'next':
			incrementSlide();
			break;
		case 'prev':
			decrementSlide();
			break;
		default:
			return;
		}
		// Turn off highlighting of the "from" slide
		$('#' + fromSlide).removeClass('sloton').addClass('slotoff');
		// Save the new highlight class
		$('#' + fromSlide).data('saveClass', 'slotoff');
		// Turn on highlighting for the "to" slide
		var toSlide = 'slot' + thisSlide;
		$('#' + toSlide).removeClass('slotoff').addClass('sloton');
		// Save the new highlight class
		$('#' + toSlide).data('saveClass', 'sloton');
		// Prepare the new slide for display
		var newurl = $(slides[thisSlide]).find('a').attr('href');
		var newimage = $(slides[thisSlide]).find('img').attr('src');
		var newalt = $(slides[thisSlide]).find('img').attr('alt');
		var newcaption = $(slides[thisSlide]).find('span').text();
		// Fade out the old
		// $(slides[thisSlide]).find('img').stop(true,true).animate({ opacity: 0 }, 500, function() {
		$('#slotcontainer').fadeOut(300, function() {
			$('#slotanchor').attr('href', newurl);
			$('#slotimage').attr('src', newimage);
			$('#slotimage').attr('alt', newalt);
			$('#slotimage').attr('title', newalt);
			// $(slides[thisSlide]).find('img').stop(true,true).animate({ opacity: 1 }, 500);
			$('#slotcontainer').fadeIn(300);
			$('#slotcaption').empty();
			$('#slotcaption').text(newcaption);
		});
		// Restart the rotation
		clearTimeout(refreshTimer);
		refreshTimer = setTimeout(function () {
			currentChange('next');	
		}, refreshRate);
	}

	// Grab the input slides and load the first one
	function loadSlides() {
		// Retrieve from the secret list
		$(slides).each(function(idx) {
			// Set up the slide switching links
			$('#slot' + idx).find('a').click(function() {
				gotoSlide(idx);
				return false;
			});
			var slideurl =  $(this).find('a').attr('href');
			var slideimage =  $(this).find('img').attr('src');
			var slidealt =  $(this).find('img').attr('alt');
			var slidecaption =  $(this).find('span').text();
			if (idx == 0) {
				$('#slotanchor').attr('href', slideurl);
				$('#slotimage').attr('src', slideimage);
				$('#slotimage').attr('alt', slidealt);
				$('#slotimage').attr('title', slidealt);
				$('#slotcaption').empty();
				$('#slotcaption').text(slidecaption);
				$('#slotcontainer').fadeIn(300);
			}
		});
	}

	// Go to a particular slide
	function gotoSlide(targetSlide) {
		// Stop the rotation 
		clearTimeout(refreshTimer);
		if (targetSlide == thisSlide) {
			return;
		}
		// Turn off all highlighting
		$('.slottext').each(function(idx,el) {
			$(this).parent().removeClass('sloton').addClass('slotoff').data('saveClass','slotoff');
		});
		// Increment the rotation counter until the next slide is the desired one
		while (targetSlide != nextSlide) {
			incrementSlide();
		}
		currentChange('next');
		// Stop the rotation (currentChange restarted it)
		clearTimeout(refreshTimer);
		return;
	}

	// Rotate forward
	function incrementSlide() {
		if (++thisSlide == totalSlides) {
			thisSlide = 0;
		}
		if (++nextSlide == totalSlides) {
			nextSlide = 0;
		}
		if (++prevSlide == totalSlides) {
			prevSlide = 0;
		}
	}

	// Rotate backward
	function decrementSlide() {
		if (--thisSlide < 0) {
			thisSlide = totalSlides - 1;
		}
		if (--nextSlide < 0) {
			nextSlide = totalSlides - 1;
		}
		if (--prevSlide < 0) {
			prevSlide = totalSlides - 1;
		}
	}

});