/*
Supersized - Fullscreen Slideshow jQuery Plugin - Version 3.1.3
*/

* { margin:0; padding:0; }
body {
   margin: 0;
   padding: 0;
   background: #fff;
   background-image:url(images/BG-kraft2.gif);
   font: 10px/13px 'Lucida Sans',sans-serif;
}

a{	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#000;
	text-decoration:none;
	}
	


h1 {font-family:Verdana, Geneva, sans-serif; text-align:center; font-weight:400; font-size:1em; padding:2px; color:#fff; opacity:1;}

img	{ border:none; }
	
#supersized-loader { position:absolute; top:50%; left:50%; z-index:10; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background-color:#111; background:rgba(0,0,0,0.8) url(images/ss-img/progress.gif) no-repeat center center; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
	
	#supersized { position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; min-width:inherit; width:100%; pointer-events: none; }
		#supersized img{ width:auto; height:auto; position:relative; display:none; outline:none; border:none; }
			#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
			#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/
		
		#supersized a { z-index:-30; position:absolute; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111;}
			#supersized a.prevslide { z-index:-20; }
			#supersized a.activeslide { z-index:-10; }
			#supersized a.prevslide img, #supersized a.activeslide img{ display:inline; }
	
	/*Controls Section*/
	#controls-wrapper { margin:0 auto; height:62px; min-width:600px; width:100%; bottom:20%; left:0; z-index:4; background:url(../img/nav-bg2.png) repeat-x; position:fixed; }
		#controls { overflow:hidden; height:100%; text-align:left; z-index:5; padding:0 114px; /* Increase padding to give thumbnails room */ }
			#slidecounter { float:left; color:#888; font:15px "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:bold; text-shadow:#000 0 -1px 0; margin:19px 10px 18px 20px; }
			#slidecaption { overflow:hidden; position:absolute; top:35px; left:96px; color:#FFF; font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif; font-size:.8em; letter-spacing:1px;}
			#navigation { width:80px; float:left; margin:8px 0 0 20px; z-index:800;}
	

	/*Thumbnail Navigation*/	
	#nextthumb,#prevthumb { z-index:6; display:none; position:fixed; bottom:12px; height:75px; width:100px; overflow:hidden; background:#ddd; border:2px solid #fff; }
		#nextthumb { right:12px; }
		#prevthumb { left:12px; }
			#nextthumb img, #prevthumb img { width:150px; height:auto;  }
			#nextthumb:active, #prevthumb:active { bottom:10px; }
			#navigation > :hover,#nextthumb:hover, #prevthumb:hover { cursor:pointer; }/*supersized script*/

#topbg{
	
	width:750px;
	height:120px;
	background-image:url(http://vandeb.frankvandenbroek.nl/html/images/BG-header.png);
	background-repeat:no-repeat;
	position: fixed;
	_position:absolute;
	top:0;
	left:50%;
	margin-left:-375px;
	text-align:center;
	z-index:950;
	}
			
.logo {
	width: 16%;
	height: 16%;
	position: absolute;
	top: 50%;
	margin-top: -8%;
	left: 50%;
	margin-left:-8%;
	}
	
	.image-hover {
    width:100px;
    height:100px;
    position:relative;
    top:-100px;
    left:0;
    display: block;
    background-color: rgba(0, 0, 0, .5);
    color: #FFF;
    -webkit-transition: .4s ease-in-out opacity;
    -moz-transition: .4s ease-in-out opacity;
    -o-transition: .4s ease-in-out opacity;
    transition: .4s ease-in-out opacity;
    opacity: 0;
}
.image-hover:hover {
    opacity: 1;
}

.content {
	width:18%;
	min-width:100px;
	padding bottom:100%;
	overflow:hidden;
	position:absolute;
	bottom:5%;
	left:8%;
	display:block;
	background-color:#d9e5e9;
	border: solid thin #5c7d8b;
	border-radius: 5px;
	box-shadow:1px 3px 3px #777;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-style:italic; font-weight:400; font-size:1.7em; padding:20px 20px 20px 10px; line-height:1em;
	opacity:.7;
	}
	
.content2 {
	width:18%;
	min-width:100px;
	padding bottom:5%;
	overflow:hidden;
	position:absolute;
	bottom:-10px;
	left:10%;
	margin-left:-50px;
	display:block;
	background-color:#000;
	border: solid thin #5c7d8b;
	border-radius: 20px;
	box-shadow:1px 3px 3px #777;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-style:italic; font-weight:400; font-size:1.7em; padding:10px 20px 20px 10px; line-height:1em;
	opacity:.9;
	}
	
		
.content3 {
	width:100%;
	min-width:100px;
	overflow:hidden;
	position:absolute;
	top:0px;
	left:5%;
	margin-left:-50px;
	display:block;
	background-color:#000;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-style:normal; font-weight:100; font-size:1em; padding:38px 20px 10px 20px; line-height:1em; color:#fff; text-align: center; letter-spacing:.3em;
	opacity:.9;
	
	
	
.content:hover {
	opacity:1;
	cursor:pointer;
	}
