/*---- Image Gallery CSS ----*/
.gallery_box {
	float:right;
	width:450px;
}

.gallery
	{
	margin:0;
	padding:0;
	padding-bottom:20px;
	overflow:hidden; /* Clears the floats */
	list-style:none;
	text-align: center;
	}

.gallery li
	{
	float:left;
	display:inline; /* For IE so it doesn't double the 1% left margin */
	width:30%;
	padding:10px 0;
	height:108px; /* Height of img (75) + 2 times 3px padding + 2 times 1px border = 83px */
	position:relative; /* This is the key */
	}

.gallery a,
.gallery img
	{
	display:block;
	width:100%;
	border:0px solid white;
	}


.gallery a:link,
.gallery a:visited,
.gallery a:focus,
.gallery a:hover,
.gallery a:active
	{
	padding:3px;
	background: none;
	width:100px; height:100px;
	border:1px solid #005596;
	position:absolute; top:50%; left:50%; /* position it so that image's top left corner is in the center of the list item */
	margin:-41px 0 0 -41px; /* Pull the image into position with negative margins (margins value is half of the width of the image) */
	}

.gallery a:hover
	{
	border-color: black;
	background:white;
	}