/* Taken from ... http://cssdemos.tupence.co.uk/image-popup.htm */

/*** Style the unordered list with the class 'enlarge' ***/
ul.enlarge {
	list-style-type: none;			/* Remove the bullets. */
	margin-left: 0;
	text-indent: 10px;			/* Offset the images toward the centre of the viewing area. */
	}
ul.enlarge li {
	display: inline-block; 		/* Places the images in a line. */
	margin: 10px 20px 0 20px;
	position: relative;
	z-index: 0;						/* Resets the stack order of the list items - later we'll increase this. */
	}
ul.enlarge img {
	background-color: #eae9d4;
	border-radius: 4px;
	box-shadow: 0 0 6px rgba(132, 132, 132, .75);
	padding: 6px;
	-moz-border-radius: 4px;
	-moz-box-shadow: 0 0 6px rgba(132, 132, 132, .75);
	-webkit-border-radius: 4px;
	-webkit-box-shadow: 0 0 6px rgba(132, 132, 132, .75);
	}
ul.enlarge span {
	background-color: #eae9d4;
	border-radius: 8px;
	box-shadow: 0 0 20px rgba(0,0,0, .75);
	color: #495a62;
	font-family: Verdana, "Droid Sans", sans-serif;
	font-size: .9em;
	left: -9999px;
	padding: 10px;
	position: absolute; 
	text-align: center;
	-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
	-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75));
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	}
ul.enlarge li:hover {
	cursor:pointer;
	z-index: 50;
	}
ul.enlarge span img {
	background: #ccc;
	padding:2px;
	}
ul.enlarge li:hover span {
	left: 20px;			/* Distance from left of thumbnail to left of the popup image. */
	top: -250px; 		/* Distance from bottom of thumbnail to top of the popup image -- originally -300. */
	}
ul.enlarge li:hover:nth-child(2) span {
	left: -100px;
	}
ul.enlarge li:hover:nth-child(3) span {
	left: -200px;
	}
/**IE Hacks - see http://css3pie.com/ for more info on how to use CS3Pie and to download the latest version**/
ul.enlarge img, ul.enlarge span {
	behavior: url(pie/PIE.htc);
	}