
/*
The method for creating the mouse-over photo thumbnail gallery would not have been possible without the tutorials provided by Stu Nicholls. He's a clever fellow who deserves all the credit for showing me how to do this. 

http://www.cssplay.co.uk/index.html
*/

body {
	color:#333;
	background-color:white;
	margin:20px;
	padding:0px;
	font:11px verdana, arial, helvetica, sans-serif;
	}
h1 {
	margin:0px 0px 15px 0px;
	padding:0px;
	font-size:28px;
	font-weight:900;
	color:#ccc;
	}
h2 {
	font:bold 12px/14px verdana, arial, helvetica, sans-serif;
	margin:0px 0px 5px 0px;
	padding:0px;
	}
p {
	font:11px/20px verdana, arial, helvetica, sans-serif;
	margin:0px 0px 16px 0px;
	padding:0px;
	}
.Content>p {margin:0px;}
.Content>p+p {text-indent:30px;}

div.commentlink {
	position:absolute;
	width:150px;
	top:20px;
	left:20px;
	border:1px solid black;
	background-color:#eee;
	padding:10px;
	
}

a {
	
	font-size:11px;
	font-family:verdana, arial, helvetica, sans-serif;
	font-weight:600;
	text-decoration:none;
	}
a:link {color:#09c;}
a:visited {color:#07a;}
a:hover {background-color:#eee;}

.a, .a:visited {
	color:#606;
	}


#container {
	position:relative; 
	width:565px; 
	height:700px;
	left: 80px; 
	background:#eee; 
	border:1px solid #000; 
	margin:0 auto;
	}
#container b {
	font-weight:normal; 
	width:565px; 
	text-align:center; 
	position:absolute; 
	bottom:250px; 
	left:0;
	color:#eee; 
	font-family:tahoma, geneva, "lucida sans unicode", "lucida grande",verdana, sans-serif; 
	letter-spacing:1px; 
	line-height:1.7em; 
	z-index:1;
	}

a.gallery, a.gallery:visited {
	display:inline; color:#000; 
	text-decoration:none; 
	border:1px solid #000; 
	width:50px; 
	height:50px; 
	float:left; 
	margin: 2px 2px; 
	position:relative; 
	cursor:default;
	}

	a.slidea {background:url(t1.jpg);background-repeat: no-repeat;}
	a.slideb {background:url(t2.jpg);background-repeat: no-repeat;}
	a.slidec {background:url(t3.jpg);background-repeat: no-repeat;}
	a.slided {background:url(t4.jpg);background-repeat: no-repeat;}
	a.slidee {background:url(t5.jpg);background-repeat: no-repeat;}
	a.slidef {background:url(t6.jpg);background-repeat: no-repeat;}
	a.slideg {background:url(t7.jpg);background-repeat: no-repeat;}
	a.slideh {background:url(t8.jpg);background-repeat: no-repeat;}
	a.slidei {background:url(t9.jpg);background-repeat: no-repeat;}
	a.slidej {background:url(t10.jpg);background-repeat: no-repeat;}
	a.slidek {background:url(t11.jpg);background-repeat: no-repeat;}
	a.slidel {background:url(t12.jpg);background-repeat: no-repeat;}
	
	a.slidem {background:url(t13.jpg);background-repeat: no-repeat;}
	a.sliden {background:url(t14.jpg);background-repeat: no-repeat;}
	a.slideo {background:url(t15.jpg);background-repeat: no-repeat;}
	a.slidep {background:url(t16.jpg);background-repeat: no-repeat;}
	a.slideq {background:url(t17.jpg);background-repeat: no-repeat;}
	a.slider {background:url(t18.jpg);background-repeat: no-repeat;}
	a.slides {background:url(t19.jpg);background-repeat: no-repeat;}
	a.slidet {background:url(t20.jpg);background-repeat: no-repeat;}

a.gallery span {
	visibility:hidden; 
	display:block; 
	position:absolute; 
	width:510px; 
	height:400px; 
	top:189px; 
	left:9px; 
	color:#000; 
	background:#eee; 
	text-align:center; 
	border:0px solid #fff; 
	font-family:tahoma, geneva, "lucida sans unicode", "lucida grande",verdana, sans-serif; 
	letter-spacing:1px; 
	cursor:default;
	}

a.slidea span {left: 15px; top:120px;}
a.slideb span {left:-41px; top:120px;}
a.slidec span {left:-97px; top:120px;}
a.slided span {left:-153px; top:120px;}
a.slidee span {left:-209px; top:120px;}
a.slidef span {left:-265px; top:120px;}
a.slideg span {left:-321px; top:120px;}
a.slideh span {left:-377px; top:120px;}
a.slidei span {left:-433px; top:120px;}
a.slidej span {left:-489px; top:120px;}

a.slidek span {left: 15px; top:68px;}
a.slidel span {left:-41px; top:68px;}
a.slidem span {left:-97px; top:68px;}
a.sliden span {left:-153px; top:68px;}
a.slideo span {left:-209px; top:68px;}
a.slidep span {left:-265px; top:68px;}
a.slideq span {left:-321px; top:68px;}
a.slider span {left:-377px; top:68px;}
a.slides span {left:-433px; top:68px;}
a.slidet span {left:-489px; top:68px;}

a.gallery:hover {
	white-space:normal; 
	border:1px solid #fff; 
	z-index:100;
	}

a.gallery:hover span {
	visibility:visible; 
	z-index:100;
	}

a.gallery:hover span img {
	margin:10px; 
	border:1px 
	solid #000; 
	position:relative; 
	z-index:100;
	}

a.gallery:active, a.gallery:focus {
	border:1px solid #c00; 
	z-index:10;
	}

a.gallery:active span, a.gallery:focus span {
	visibility:visible; 
	z-index:10;
	}

a.gallery:active span img, a.gallery:focus span img {
	border:1px solid #000; 
	position:relative; 
	margin:10px; 
	z-index:10;
	}

#adsie {
	clear:both;
	text-align:center; 
	width:750px; 
	margin-top:10px;
	}
	
#smalladsie {
	clear:both; 
	text-align:center;
	width:468px; 
	margin-top:10px;
	}

div.photo_navbar {
	position:absolute;
	width:150px;
	top:50px;
	left:20px;
	border:1px solid black;
	background-color:#eee;
	padding:10px;
	z-index:2;

	voice-family: "\"}\"";
	voice-family:inherit;
	width:150px;
	}


body>div.photo_navbar {
	width:150px;
	}
		







              	
