/* CSS Document */

/* needed for IE to make :active state work first time */
#gallery a, a:visited {
	color:#000;
}
/* gallery container */
#gallery {
	width:770px;
	height: 500px;
	position: relative;
}
#gallery img {
	border: 1px solid #000000;
}
/* thumbs container */
#gallery .thumbnails {
	width:225px;
	position: absolute;
	top: 30px;
}
/* thumbs style */
#gallery a.thumbs, #gallery a.thumbs:visited {
	display:block;
	display:inline;
	color:#000;
	text-decoration:none;
	width:100px;
	height:100px;
	float:left;
	z-index:50;
	border: 1px solid #000000;
	margin-bottom: 5px;
	margin-right: 5px;
}
/* prevents display of image (em) and description (span) until hovered or activated */
#gallery a.thumbs em, #gallery a.thumbs span {
	display: none;
}
/* white border to thumbs on hover */
#gallery a.thumbs:hover {
	border:1px solid #FFFFFF;
}
/* describe thumbs on hover */
#gallery a.thumbs:hover span {
	position:absolute;
	font-style:italic;
	color:#000000;
	top: 425px;
	width: 225px;
	z-index: 100;
	left: 0px;
	display: block;
}
/* styles first line of description when using line break tag */
#gallery a.thumbs:hover span:first-line {
	font-style:normal; 
	font-weight:bold; 
	font-size:1.1em; 
	color:#000;
}
/* black border to thumbs on activate */
#gallery a.thumbs:active, #gallery a.thumbs:focus {
	border: 1px solid #000000;
}
/* displays image (em) on activate */
#gallery a.thumbs:active em, #gallery a.thumbs:focus em {
	display:block;
	position: absolute;
	top: 0px;
	z-index: 50;
	left: 300px;
}
#gallery h1 {
	text-align:left;
	font-size: 1.2em;
	color: #660000;
	clear: both;
	font-style: normal;
	text-transform: none;
}