body{
 padding: 20px;
 text-align: center;
 background: black;
 color: #bbbbaa;
 font: 80%/140% georgia,serif;
 background-image: url(../support/background.jpg);
}

/* 
Main page title
------------------------------------------------- */
#SiteTitle {
}


/*
Container for all page text & information
------------------------------------------------- */
#Container {
 margin: 5px auto 20px;
 width: 700px;
 background: #222222;
 padding: 0px 30px 5px;
 border: 1px solid #444444;
}

/*
Menupath in the gallery (clickable for levels up)
------------------------------------------------- */
#GalleryMenu {
 border-bottom: 1px solid #444444;
 background-color: #333333;
 padding-top: 0px;
 padding-left: 5px;
 padding-bottom: 0px;
 margin-top: 10px;
 margin-bottom: 10px;
 text-align: left;
}

#GalleryMenu h2 {
	padding: 5px;
	margin: 0;
}


/*
Collection of all indexes/thumbs for different 
books or collections
------------------------------------------------- */
#PhotoBooks {
	float: left;
	margin-bottom: 12px;
 margin-top: 0px;
}

/*
Box with detailed information 
(thumb, description) of a specific book or 
collection)
------------------------------------------------- */
.PhotoBook {
 margin: 4px -4px 4px 12px;
 padding: 8px 0px 0px 8px;
 float: left;
 width: 314px;
 border: 1px solid #444444;
 background: #333333;
 line-height: 100%;
}

.PhotoBook a img {  }
.PhotoBook .Thumbnail {
 float: left; 
 margin-right: 6px;
}


.Thumbnail a:link img, a:visited img {
 opacity: 0.5;
}

.Thumbnail a:hover img {
 opacity: 1.0;
}

.PhotoBook h2 {
	padding: 0;
	margin: 0;
}

.PhotoBook p {
 line-height: 12px;
 font-size: 11px;
 padding: 4px 5px 3px;
 margin: 0px;
}

.PhotoBookDescription {
 font-size:100%;
}

.PhotoBookText {
 text-align:left;
 font: 90% "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;
}

.PhotoBookText h2 {
 font-size: 135%; 
 font-weight: bold;
 font-variant: small-caps;
 color: #bbbbaa;
 text-align: left;
}

.PhotoBookText h3 {
 font-size: 125%;
 font-weight: normal;
 font-variant: small-caps;
 color: #aaaaaa;
 text-align: left;
}

.PhotoBookText h4 {
 font-size: 115%;
 font-weight: bold;
 font-variant: small-caps;
 color: #bbbbaa;
 text-align: left;
 margin-top: 10px;
}

.PhotoBookText h5 {
 text-align: left;
}


/*
Box with text information 
(description only) of a specific book or 
collection)
------------------------------------------------- */
.TextBook {
 margin: 4px 0px 4px 0px;
 padding: 8px 0px 0px 12px;
 float: left;
 width: 685px; /*314px;*/
 border: 1px solid #444444;
 background: #333333;
 line-height: 100%;
 text-align: left;
}

.TextBook p {
 line-height: 16px;
 font-size: 100%;
 padding: 4px 5px 3px 12px;
 margin: 0px;
}

.TextbookDescription a {
 text-decoration: none;
}

.TextBookDescription {
 font-size:90%;
 font-family: arial;
}

.TextBookDescription em {
 font-size:90%;
 font-style: normal;
 font-family: arial;
}



/*
Everything for the image gallery
------------------------------------------------- */
.YG_Gallery {
 position: relative;
 margin-top: 2em;
}

#TheImage{
 margin: 0 auto 110px auto;
 height: 467px; /* orignal: 467px */
 width: 700px; /* original: 700px */
 background: black;
 border: 1px solid #696969; 
}

#TheImage img{
 margin-bottom: 10px;
}

/*
Galleria settings
------------------------------------------------- */
/* --- Galleria common CSS settings */

.galleria{list-style:none;width:200px}
.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0}
.galleria li a{display:none}
.galleria li div{position:absolute;display:none;top:0;left:180px}
.galleria li div img{cursor:pointer}
.galleria li.active div img,.galleria li.active div{display:block}
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto}
.galleria li .caption{display:block;padding-top:.5em}
* html .galleria li div span{width:400px} /* MSIE bug */

/*
End Galleria settings
------------------------------------------------- */

/*
Additional Gallery settings
------------------------------------------------- */
*{
 margin: 0;
 padding: 0;
}

.gallery{
 width: 702px;
 margin: 0 auto;
}

.gallery li{
 width: 70px;
 height: 46px;
 border: 1px solid #696969;
 margin: 0 3px 3px;
 background: #000000;
}

.gallery li div{
 left: 240px;
}

/*
Navigation block for thumbs
------------------------------------------------- */
.Navigate {
 padding-top: 10px;
 clear: both;
 font: 80% 'helvetica neue',sans-serif;
 letter-spacing: 2px;
 text-transform: uppercase;
}

/*
Caption text of an image
------------------------------------------------- */
.caption {
 font-style: normal;
 font-size: 0.8em;
 line-height: 1.5;
 text-align: left;
}

.caption h3 {
 font: 120% "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;
 font-weight: normal;
 margin-bottom: 5px;
 color: #bbbbaa;
 }

.caption h4 {
 font: 120% "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;
 font-weight: normal;
 margin-bottom: 5px;
 color: #bbbbaa;
}

.caption h5 {
 font: 100% "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;
 font-weight: normal;
 color: #bbbbaa;
}

.caption h6 {
 font: 100% "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;
 font-weight: normal;
 text-align: right;
 color: #696969;
 margin-bottom:5px;
}

.caption hr {
	margin: 0 0 5px 0;
}

/*
Information session: text below thumbs
------------------------------------------------- */
.Info {
 font-style: normal;
 text-align: left;
 font-family: arial, georgia,serif;
 font-size: 90%;
 font-weight: normal;
}

.Info h2 {
 font-size: 135%; 
 font-weight: bold;
 font-variant: small-caps;
 color: #aaaaaa;
 text-align: center;
}
 
.Info h3 {
 font-size: 125%;
 font-weight: normal;
 font-variant: small-caps;
 color: #aaaaaa;
 text-align: center;
}

.Info h4 {
 font-size: 115%;
 font-weight: normal;
 font-variant: small-caps;
 color: #aaaaaa;
 text-align: left;
 margin-top: 10px;
}

.Info h5 {
 text-align: center;
}

.Info p {
 /*line-height: 12px;
 font-size: 100%px; */
 padding: 4px 0px 3px 0px;
 margin: 0px;
}
.Info img {
 border: 2px groove #bbbbaa;
}

/*
Below the containerbox display a copyright/credit
notice
------------------------------------------------- */
#CreditNotice {
	margin: 0 auto;
	width: 640px;
	font-size: 85%;
	color: #294550;
	text-align: right;
	clear: both;
}

#CreditNotice a {
	text-decoration: none;
	color: #294550;
	border-bottom: 1px dotted #294550;
}
#CreditNotice a:hover {
	color: #748da0;
	border-bottom: 1px solid #294550;
	text-decoration: none;
}


/*
Formatting
---------------------------------------------------------- */
a:link, a:visited { 
 color: #748da0;
 text-decoration: none;
 font-weight: bold;
}

a:hover { 
 color: #8db8cf;
 text-decoration: none; 
	font-weight: bold;
}

h1 {
 font: small-caps 125% Georgia, "Times New Roman", "Arial", serif;
 letter-spacing: 3px;
 color: #aaaaaa;
}

h1 a:link, h1 a:visited { 
 color: #aaaaaa;
 text-decoration: none;
 font-weight: bold;
}

h1 a:hover { 
 color: #bbbbaa;
 text-decoration: none; 
	font-weight: bold;
}

h2 {
 font: 115% "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;
 font-weight: normal;
 font-variant: small-caps;
 color: #aaaaaa;
}

h2 a:link, h2 a:visited { 
 color: #748da0;
 text-decoration: none;
 font-weight: bold;
}

h2 a:hover { 
 color: #8db8cf;
 text-decoration: none; 
	font-weight: bold;
}

h3 {
 font: 115% "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;
 font-weight: normal;
 color: #aaaaaa;
}

h3 a:link, h3 a:visited { 
 color: #748da0;
 text-decoration: none;
 font-weight: bold;
 border-bottom: thin outset;
}

h3 a:hover { 
 color: #8db8cf;
 text-decoration: none; 
	font-weight: bold;
}

h5 {
 font: 105% "Helvetica Neue", "Lucida Grande", Helvetica, Arial, sans-serif;
}

h6 a:link, h6 a:visited { 
 color: #748da0;
 text-decoration: none;
 font-weight: bold;
 border-bottom: thin outset;
}

h6 a:hover { 
 color: #8db8cf;
 text-decoration: none; 
	font-weight: bold;
}

img {
	border: 0;
}

hr {
	clear: both;
	height: 0;
	border: 0;
	border-top: 1px solid #444444;
	margin: 0 0 12px 0;
	padding: 0;
}
