.photocategories {width:100%;background-color:grey;}
.photocategories ul {list-style:square;margin:0;padding:0;border-collapse:collapse;}
.photocategories li {width:200px;display:inline;float:left;background-color:grey;padding:7px 0 7px 0;text-align:center;}
.photocategories li.normal {background-color:grey;border-bottom:1px grey solid;}
.photocategories li.selected {background-color:lightgray;border-bottom:1px lightgray solid;}
.photocategories li a {text-decoration:none;}
.photocategories li a:link {color:black;}
.photocategories li a:visited {color:black;}
.photocategories li a:hover {color:white;font-weight:bold;text-decoration:none;}

#galleryvarieties {margin:0;padding:0;float:left;width:150px;}
#galleryvarieties ul {list-style:none;margin:0;padding:0;}

#photosubgallery li a{text-decoration:underline;color:black;}
#photosubgallery li a:link{color:black;}
#photosubgallery li a:visited{color:black;}
#photosubgallery li a:hover{color:#017550;}

#photoimages {list-style:none;}
#photoimages li {float:left;position:relative;width:215px;height:240px;text-align:center;border:1px purple solid;border-collapse:collapse;}
#photoimages li img {border:2px white solid;}
#photoimages li a {text-decoration:none;}
#photoimages li a:link {color:black;}
#photoimages li a:visited {color:black;}
#photoimages li a:hover {color:#017550;}
#photoimages a .preview {display: none;}
#photoimages a:hover .preview {display: block;position: absolute;top:-30px;left:-100px;z-index: 1;}
#photoimages .preview {border:2px white solid;}

div#page {width:900px;background-color:#fff;margin-left:20px;text-align: left;border-color: #ddd;border-style: none solid solid;border-width: medium 1px 1px;}
div#container {padding: 20px;background-color:lightgrey;}

div.content {
	/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
	display: none;float: left;width: 550px; }
div.content a, div.navigation a {text-decoration: none;color: #777;}
div.content a:focus, div.content a:hover, div.content a:active {text-decoration: underline;}
div.controls {margin-top:5px;height:23px;color:black;}
div.controls a {padding: 5px;}
div.ss-controls {float:left;}
div.ss-controls a {color:black;font-weight:normal;}
div.ss-controls a:link {color:black;font-weight:normal;text-decoration:none;}
div.ss-controls a:visited {color:black;font-weight:normal;text-decoration:none;}
div.ss-controls a:hover {color:black;font-weight:normal;text-decoration:underline;}
div.nav-controls {float: right;}
div.nav-controls a {color:black;font-weight:normal;text-decoration:none;}
div.nav-controls a:link {color:black;font-weight:normal;text-decoration:none;}
div.nav-controls a:visited {color:black;font-weight:normal;text-decoration:none;}
div.nav-controls a:hover {color:black;font-weight:normal;text-decoration:underline;}
div.slideshow-container {position: relative;clear: both;
	height: 420px; /* This should be set to be at least the height of the largest image in the slideshow */}
div.loader {position: absolute;top: 0;left: 0;background-image: url('loader.gif');background-repeat: no-repeat;background-position: center;width: 550px;height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
}
div.pgslideshow {}
div.pgslideshow span.image-wrapper {display: block;position: absolute;top: 0;left: 0;}
div.pgslideshow a.advance-link {display: block;width: 550px;
	height: 420px; /* This should be set to be at least the height of the largest image in the slideshow */
	line-height: 420px; /* This should be set to be at least the height of the largest image in the slideshow */
	text-align: center;}
div.pgslideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {text-decoration: none;}
div.pgslideshow img {vertical-align: middle;border:2px solid purple;padding:5px;}
div.download {float: right;}
div.caption-container {position: relative;clear: left;height: 75px;}
span.image-caption {display: block;position: absolute;width: 550px;top: 0;left: 0;}
div.caption {padding: 12px;}
div.image-title {font-weight: bold;font-size: 1.4em;}
div.image-desc {line-height: 1.3em;padding-top: 12px;}
div.navigation {
	/* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
	color:orange;
}
ul.thumbs {clear: both;margin: 0;padding: 0;}
ul.thumbs li {float: left;padding: 0;margin: 5px 0 5px 10px;list-style: none;}
a.thumb {padding: 2px;display: block;border: 1px solid purple;}
ul.thumbs li.selected a.thumb {background: #000;}
a.thumb:focus {outline: none;}
ul.thumbs img {border:none;display: block;}
div.pagination {clear: both;}
div.navigation div.top {margin-bottom: 12px;height: 11px;}
div.navigation div.bottom {margin-top: 12px;}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {display: block;float: left;margin-right: 2px;padding: 4px 7px 2px 7px;border: 1px solid #ccc;}
div.pagination a:hover {background-color: #eee;text-decoration: none;}
div.pagination span.current {font-weight: bold;background-color: #000;border-color: #000;color: #fff;}
div.pagination span.ellipsis {border: none;padding: 5px 0 3px 2px;}