/* CSS Document */

body {background:black; font-family:Verdana, Arial, Helvetica, sans-serif; color:white;}
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

h1 {font-size:120%;}
h2 {font-size:110%;}
p { text-align:justify; font-size:80%; }
.centercol { text-align:center; color:#99FFFF;}

.gallerycontainer{
position: relative;
padding-left:50px;
height: 500px;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid blue;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: white;
text-decoration: none;
height:350px;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span { /*CSS for enlarged image*/
visibility: visible;
top: 0;
left: 230px; /*position where enlarged image should offset horizontally */
z-index: 50;
}



.thumbnail span#first {
visibility: visible;
top: 0;
left: 320px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

</style>
<script type="text/javascript" src="p7pm/p7popmenu.js"></script>
<style type="text/css" media="screen">
<!--
@import url("p7pm/p7pmh22.css");
.style2 {
	color: #009999;
	font-weight: bold;
}


#squares {font-size:90%; text-align:center; color:#CCC;}
#squares img {margin-bottom:10px;}