 #rolloverWrap {
	width: 900px;
	height: 525px;
	border: 1px solid #cfcfcf;
	margin: 0 auto;
	padding: 3px;
	/*
position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -215px;
	margin-left: -455px
*/
 }
 
.growImage {
	
	/* set thumbnail window width and height, should be the same as its parent div */
	width: 150px;
	height: 105px;
	
	/* position it in top corner of parent div */
	position:relative;
	left:0px;
	top:0px;
	background-image: url('../images/bg_thumb.png');
	background-repeat: no-repeat;
	/* turn the opacity to 0 to hide the image until we resize it */
	opacity: 0;
	filter:alpha(opacity=0);	
}

a .growImage {
	border: none;
	outline: none;
	padding: 5px;
}


a:active, a:focus{
	outline: 0;	
}
.caption {
	z-index: 11;
	position: relative;
	top: 164px;
	left: -70px; 
	width: 294px;
	/* height: 20px; */
	background-color: black;
	color:white;
	font-size: 0.85em;
	margin-top: -35px; 
	padding: 3px;
	opacity: 0; filter:alpha(opacity=80);
}



.growDiv { 
	/* this div will hold a background image which is the same as the image to zoom */

	/* Position the div - this is totally optional */
	left: 0px; 
	top: 0px;
	position:relative;
	
	/* Give a width - this is mandatory otherwise the other divs will move when the image is hovered over */
	/* The width should be at least the same width as the thumbnail width */
	width:150px;	
	height:105px;
	
	/* Float so images line up side by side */
	float:left; 
}
