/*
	Defines the look and layout of the post slideshow

	Structure:
	----------
		|-+ #page-image
		| |-+ .slides
		| | |-- img.header-image
		| | |-+ #header-snippet
		| | | |-+-- h2 #snippet-title       .snippet-text
		| | | | |-- a  .snippet-link
		| | | |
		| | | |-- p    #snippet-description .snippet-text
		| |
		| |-+ .preview-links
		| | |-- p#page-preview		- The text showing the title of the mouse-overed slide
		| | |-- a			- The slide links, if they exist
		| | |-- a.activeSlide		- The currently selected slide

*/

#page-image {
	padding: 2px;
	display: none;
}
	.slides {
	}
		.header-image {
		}
		#header-snippet {
			background: #3A3A3A;
			color: #FFF;
			opacity: 0.7;
			position: relative;
			text-align: left;
			/* This needs to be quite high since the script increases the z-index on the images */
			/* If you have more than 32 slides, maybe consider deleting some or just upping this value */
			z-index: 32;
			/* Change this if you've altered any of the fonts or sizes */
			top: -62px;
		}
			#header-snippet:hover { opacity: 1; }
			.snippet-text {
				margin: 0;
				padding: 4px 8px;
			}
			.snippet-title {
				font-weight: bold;
				font-size: 28px;
				font-family: "Georgia", Serif;
				line-height: 22px;
				letter-spacing: normal !important;
			}
				/* No hover on the snippet or the link */
				a.snippet-link {
					color: #FFF;
					text-decoration: none;
					display: block;
					border: 1px solid #3A3A3A;
				}
				/* Hovering on the snippet but not the link */
				#header-snippet:hover a.snippet-link {
					color: #DFDFDF;
				}
					/* Hovering over the link and (therefore) the snippet */
					a.snippet-link:hover {
						color: #FFF !important;
					}
				a.snippet-link:hover {
				}
			.snippet-description {
				font-style: italic;
				padding: 4px 16px;
				font-family: Verdana, Arial;
				font-size: 14px;
				line-height: 21px;
			}
	.preview-links {
	}
		#page-preview {
		}
			#page-preview a {
			}
				#page-preview a.activeSlide {
				}