div.content {
	
	/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
	
display: none;
	
position: absolute;
	
left: 190px;
	
top: 0;
	
width: 600px;
	
height: 500px;
	
border: 0px solid #777;
}


div.content a, div.navigation a {
	
text-decoration: none;
	
color: #666;
	
font-family: Helvetica,Arial,sans-serif;
	
font-size: 11px;
}


div.content a:focus, div.content a:hover, div.content a:active {
	
	text-decoration: none;
	

}


div.controls {
	
margin-top: 438px;
	
height: 20px;
}


div.controls a {
	display: block;
	float: left;
	margin-right: 3px;
	padding: 3px 6px 3px 6px;
	border: 1px solid #ccc;
	font-family: Helvetica,Arial,sans-serif;
	font-size: 11px;
}



div.controls a:hover {
	
	background-color: #ddd;
	
	text-decoration: none;
	
	color: #26466D;
	
	border-color: #26466D;
	

}



div.nav-controls {
	
	float: left;
	

}



div.ss-controls {
	
	float: left;
	

}


div.ss-controls a{
	
	width: 30px;
	

}



div.slideshow-container {
	position: absolute;
	top: 35px;
	left: 0;
	width: 600px;
	height: 400px;
	overflow: hidden;
	 

/* height 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: 580px;
	
height: 400px;
	 /* This should be set to be at least the height of the largest image in the slideshow */
}




div.slideshow {
	width: 580px;
	height: 400px;
	/* border: 1px solid #888; */
}


div.slideshow.history {
	/* border: 1px solid #888; */
	width: 580px;
}







div.slideshow span.image-wrapper {
	display: block;
	position: absolute;
	width: 580px;
	height: 400px;
	/* border : 3px solid #fff; */
	overflow:hidden;
	/* background-color: #fff; */
}


div.slideshow.history span.image-wrapper {

	/* width: 574px;*/
	/* height: 394px;*/
	/* border : 3px solid #fff;*/
	/* background-color: #fff;*/

}


div.slideshow a.advance-link {
	
	display: block;
	
	width: 580px;
	
	height: 400px;
	 /* This should be set to be at least the height of the largest image in the slideshow */
	line-height: 0px;
	 /* This should be set to be at least the height of the largest image in the slideshow */
	text-align: center;
	

}


div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
	
	text-decoration: none;
	

}

/* value for image height for photos with 4-3 aspect ratio*/


div.slideshow img {
    position: absolute;
    left: 0;
    top: 0;
    height: 432px;
    padding: 0px;
    background-color: #E1E4E6;
}

div.slideshow.history img {
   height: 400px;
}	


/* value for image height for photos with 3-2 aspect ratio*/


div.slideshow.new img {
   height: 400px;
}


div.download {
	
	float: right;
	
}


div.caption-container {
	
position: absolute;
	
top: 30px;
	
left: 4px;
	
height: 20px;
}


div.caption-container.history {
		
top: 460px;
}










span.image-caption {
	
	display: block;
	
	position: absolute;
	
	top: 0;
	
	left: 0;
	
	

}


div.caption {
	
    float: left;
	
	padding: 0 0 0 0;
	

}


div.image-title {
	
	font-weight: bold;
	
	font-size: 1.2em;
	

}


div.image-desc {
	
	line-height: 1.3em;
	
	padding-top: 12px;
	

}



div.navigation {
	
        /* The display of navigation is set inline using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
	
/* display: none; */
	
position: absolute;
	
bottom: 34px;
	
left: 12px;
	
width: 175px;
	
height: 320px;
}



ul.thumbs {
	
clear: both;
	
width: 175px;
	
margin: 0;
	
padding: 0;
	
position: absolute;
	
bottom: 28px;
	
/* color: #333; */
}


ul.thumbs li {
	
	float: left;
	
	padding: 0;
	
	margin: 0 3px 3px 0;
	
	list-style: none;
	
	background: #ddd;
	
	width: 50px;
	
	height: 50px;
	
	overflow: hidden;
	


}


a.thumb {
	
	padding: 0;
	
	display: block;
	
	border: 1px solid #ccc;
	
	width: 48px;
	
	height: 48px;
	
	overflow: hidden;
	
	

}


ul.thumbs li.selected a.thumb {
	
	background: #ccc;
	
	border: 1px solid #26466D;
	

}


a.thumb:hover {
	
	border: 1px solid #26466D;
	
	background: #ccc;
	

}


a.thumb:focus {
	
	border: 1px solid #26466D;
	
	outline: none;
	

}


ul.thumbs img {
	
    position: relative;
	
    left: -12px;
	
    top: 0;
	
	display: block;
	
	width: 70px;
	
	

}


ul.thumbs li.size2{
	
      width: 103px;
	
      overflow: hidden;
	 

}



ul.thumbs  li.size2 a {
	
      width: 103px;
	 
      overflow: hidden;
	 	

}



ul.thumbs li.size2 img{
	
    position: relative;
	
    top: -12px;
	
    left: 0;
	
	width: 101px;
	
	height: 75px;
	

}



div.pagination {
	
	clear: both;
	

}




div.navigation div.top {
	
	margin-top: -25px;
	
	height: 20px;
	

}


div.navigation div.bottom {
	
margin-top: 291px;
	
height: 21px;
}


div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
	
	display: block;
	
	float: left;
	
	margin-right: 3px;
	
	padding: 3px 6px 3px 6px;
	
	border: 1px solid #ccc;
	
	font-family: Helvetica,Arial,sans-serif;
	
    font-size: 11px;
	

}


div.pagination a:hover {
	
	background-color: #ddd;
	
	text-decoration: none;
	
	color: #26466D;
	
	border-color: #26466D;
	

}


div.pagination span.current {
	
	font-weight: bold;
	
	background-color: #26466D;
	
	border-color: #26466D;
	
	color: #fff;
	

}


div.pagination span.ellipsis {
	
	border: none;
	
	padding: 5px 0 3px 2px;
	

}