body 
{
    background-color : #000000;
    background-image:url('images/background1.jpg') ;
    background-position:center;
    background-attachment:fixed;
    background-repeat:no-repeat;
    padding: 0px;
    
    
}
div#container 
{
    padding:  20px ;
}
#container
{
    background-color : #D7D7D7;
    max-width : 960px;
    margin: auto; /* container centreren */
    text-align:left;
}
h1{
font-family: 'Fredericka the Great', cursive;
}
h2{
font-family: 'Ubuntu', sans-serif;
}
h3{
font-family: 'Play', sans-serif;
}
p{
font-family: 'Orbitron', sans-serif;
}
em
{
   color:Red;
}


/*********************************/
/*** CSS voor pagina Gallery  ***/
/*******************************/

/* Zwarte box acter foto's */
#box {
	text-align: left;
	width: 600px;
	margin: 30px auto 0 auto; /* Centreren */
	background: #000;
	overflow: hidden;
	border: 10px solid #000;
	box-shadow: #131313 0px 3px 10px;	

}


ul#gallery{
	margin: 0px;
	padding: 0px;
	list-style: none;
	position: relative;
	width: 600px;
	height: 438px;
	overflow: hidden;	
}

ul#thumb {
	margin: 0px;
	padding: 0px;
	list-style: none;
	position: relative;
	background: #000;
	width: 600px;
}
/* Thumbnails naast elkaar zetten */
ul#thumb a {
	border: 1px solid #979797;
	width: 35px;
	height: 35px;
	display: block;
	overflow: hidden;
	float: right;
	margin: 10px 0px 0px 10px;
	opacity: 0.75;
}


ul#gallery li {	
	position: absolute;
}
/* bar voor text onder photo */	
ul#gallery li p {
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;/*text kleur*/
	background: rgba(0, 0, 0, .5);/* bar kleur*/
	width: 100%;/* bar verlengen tot einde van photo */
}
/* toon photo als klik op Thumbnail, aangeklikte foto naar voor */
ul#gallery li:target {
	z-index: 10;
}
/*********************************/
/*** CSS voor pagina Engine   ***/
/*******************************/

#image
{
    max-width : 500px;}
    
.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: -350px; /*position where enlarged image should offset horizontally */

}

#guide6 p 
{
    float:right;
}