@charset "utf-8";
/* CSS Document */
div#header {
	background: #c5c4c2 url(images/headprint.jpg) top center no-repeat;
	width: auto;
	height: 125px;
	overflow: hidden;
	border-bottom: 3px solid #000;
	z-index: 0;
	}

/*page specific navagation*/
div#topLinks {
	float: right;
	z-index: 4;
	}
	
div#topLinks a {
	margin-left: 10px;
	}

div#topLinks a.home {
    display: block;
    width: 45px;
    height: 37px;
	background: url("images/home.png") 0 0 no-repeat;
	text-decoration: none;
	float: left;
	}
	
div#topLinks a:hover.home {
    background-position: 0 -38px;
	float: left;
	}
	
div#topLinks a.print {
    display: block;
    width: 45px;
    height: 37px;
	background: url("images/print.png") 0 -72px no-repeat;
	text-decoration: none;
	float: left;
	}
	
div#topLinks a:hover.print {
    background-position: 0 -36px;
	float: left;
	}
	
div#topLinks a.web {
    display: block;
    width: 45px;
    height: 37px;
	background: url("images/web.png") 0 0 no-repeat;
	text-decoration: none;
	float: left;
	}
	
div#topLinks a:hover.web {
    background-position: 0 -37px;
	float: left;
	}

div#topLinks a.pic {
    display: block;
    width: 45px;
    height: 37px;
	background: url("images/photo.png") 0 0 no-repeat;
	text-decoration: none;
	float: left;
	}
	
div#topLinks a:hover.pic {
    background-position: 0 -37px;
	float: left;
	}

div#topLinks a.contact {
    display: block;
    width: 45px;
    height: 37px;
	background: url("images/contact.png") 0 0 no-repeat;
	text-decoration: none;
	float: left;
	}
	
div#topLinks a:hover.contact {
    background-position: 0 -37px;
	float: left;
	}
	
/*page specific formatting*/
.item {
	background: #000 url('images/content.jpg') top right no-repeat;
	display: none;
	width: 620px;
	height: 406px;
	margin: 0px;
	padding: 10px;
	border: 4px solid #eee;
	position: relative;
	left: -80px;
	top: -104px;
	z-index: 15;
	text-align: left;
	}
	
.image {
	float: left;
	padding: 0px 10px 0px 0px;
	}	

a.close {
    display: block;
    width: 20px;
    height: 20px;
	background: url("images/close.jpg") -20px 0px no-repeat;
	text-decoration: none;
	float: right;
	}
	
a:hover.close {
    background-position: -40px 0px;
	}
	
.close span {
	display: none;
	}
	
.p1 {
	display: inline;
	}
	
.p1 span {
	display: block;
	font-weight:bold;
	}

/* slides styling */

/*this defines the photo box size, background and text*/
.photo {width:416px; height:0px; background: none; text-align:left; position:relative; margin: 35px;}

/*this group defines the width of the tabs and formatting for the text content.  it also hides annoying list bullets.*/
.photo ul.topic li {display:block; float:left;}

/*this group hides the images*/
.photo ul.topic li a ul, 
.photo ul.topic li ul 
{display:none;}

/*this defines the size, location, and color of the background box behind the thumbnails. Set width and height to the total thumb box width and height x4 + 16*/
.photo ul.topic li a ul, 
.photo ul.topic li ul 
{display:block; position:absolute; left:0px; top:0px; list-style:none; padding:0; margin:0; height:0px; width:416px;}

/*this defines the outermost line on the thumbnail box.  Set width and height to image box size plus border and margin*/
.photo ul.topic li a ul li, 
.photo ul.topic li ul li 
{display:inline; width:92px; height:87px; float:left;  margin:6px;}

/*this defines the inside thumbnail box size and color.  Set width and height to image size plus border.*/
.photo ul.topic li a ul li a, 
.photo ul.topic li ul li a 
{display:block; width:90px; height:85px; cursor:default; float:left; text-decoration:none; background:#444; border:1px solid #666;}

/*this defines the thumbnail image size and border.  Set this to smaller than the image size by percentage of choice*/
.photo ul.topic li a ul li a img, 
.photo ul.topic li ul li a img 
{display:block; width:88px; height:83px; border:1px solid #eee;}

/*this makes the large hover thumbnail appear above the small thumbnail*/
.photo ul.topic li a ul li a:hover, 
.photo ul.topic li ul li a:hover 
{white-space:normal; position:relative;}

/*this defines the size and location of the large hover thumbnail.  Set width and heigh to thumb size.*/
.photo ul.topic li a ul li a:hover img, 
.photo ul.topic li ul li a:hover img 
{position:absolute; left:-9px; top:-8px; width:104px; height:98px; border-color:#fff;}

/*this brings the large picture up in the right place*/
.photo ul.topic li:hover ul li a:focus, 
.photo ul.topic li:hover ul li a:active,
.photo ul.topic li a:hover ul li a:active 
{position:static; outline:0;}

/*this makes the active small image hidden*/
.photo ul.topic li ul li a:focus img, 
.photo ul.topic li ul li a:active img, 
.photo ul.topic li a ul li a:active img 
{position:static; width:100px; height:75px; padding:0; background:#000; border:0; z-index:5;}

/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/lightbox3.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.

Thanks Stu!
=================================================================== */