@charset "utf-8";
/* CSS Document */

a:link {
	color: #FFF; 
	text-decoration: none; 
	background-color: transparent;
}

a:visited { 
	color:#FFF;  
	text-decoration: none; 
	background-color: transparent;
}

a:hover { 
	color: #FFF; 
	text-decoration: underline; 
	background-color: transparent;
}

a:active { 
	color: #FFF; 
	text-decoration: none; 
	background-color: transparent;
}

html,body { 
	margin: 0px; 
	margin-left:auto;
	margin-right:auto;
	padding: 5px;
	font-family: Arial, Verdana, Helvetica, sans-serif; 
	color:#000; 
	background: url(images/background1.jpg) repeat-x #c4c4c0;
	width:100%;
	font-size: 14px; 
	line-height: 20px; 
}

#header {
	background:url(images/header.jpg) no-repeat #8c8c88;
	height:152px;
	font:Arial, Helvetica, sans-serif oblique;
}

#footer {
	background:url(images/footer.jpg) no-repeat #c4c4c0;
	height:164px;
}

#body {
	margin:0px;
	padding:5px;
	font-family:Arial, Helvetica, sans-serif;
	background: url(images/background2.jpg) repeat-x #8c8c88;
	min-height:500px;
}

/* Show/hide setup for the gallery*/
	div#gallery {border:0px;}
	div#gallery a:hover {background:transparent} /* this seems to be necessary for it to work properly in IE6, I'm honestly not sure why */
	div#gallery a img.bigh {height:0px;width:0px;border-width:0;z-index:8;} /* hide the big image by making its height and width 0 */
	div#gallery a img.bigv {height:0px;width:0px;border-width:0;z-index:8;} /* hide the big image by making its height and width 0 */
	div#gallery a:hover img.bigh {position:absolute;margin-left:-100px;margin-top:-270px;width:400;height:267;border:1px;z-index:9;} /* make the big image appear in the same space as the frame at right when the visitor hovers over one of the image in left column */
	div#gallery a:hover img.bigv {position:absolute;margin-left:-67px;margin-top:-403px;width:267;height:400;border:1px;z-index:9;} /* make the big image appear in the same space as the frame at right when the visitor hovers over one of the image in left column */


/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.thumbnail{
position: relative;
z-index: 0;
vertical-align:top;
padding:5px;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background: none;
padding: 0px;
width:100%;
height:100%;
border: 1px solid thin white;
visibility: hidden;
color: transparent;
text-decoration: none;
}

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

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
z-index:100;
top: -330px;
left: 10px; /*position where enlarged image should offset horizontally */

}