/* 1. Main
---------------------- */
* {margin:0; padding:0;}

body {background: White; color:#F9F9F9; font-family: sans-serif; font-size: medium; text-align:center; height: 100%; /* for older browsers */}

p {line-height: 140%; margin: 0.3em 0; padding: 0.1em 0 0.5em 0;}

.hide, hr, h1 {display: none;}

input, textarea {font-family: sans-serif; font-size: 100%;}

fieldset {border: none;}

a, a:link {color: White; outline: none;}
a:hover {color: #B8D9D7;}


#main { margin: 0 auto; position: relative; width: 100%; text-align: left;}
 
.inside {margin: 0 auto; position: relative; width: 960px;}

 #eiland
 {  background: #285A73 url('../img/02-bg.jpg') repeat-x 0 0;
    z-index: 1001;
     height: 1200px;
     position: relative;
   }
 
 #sea {
	 height: 1200px;
           position: relative;
		   
		   background: #5B7C69 url('../img/03-bg.jpg') repeat-x 0 0; z-index: 1000;
		   }



 


#algemeen {background: #78A8D9 url('../img/01-bg.jpg') repeat-x 0 0; z-index: 1002;}
#algemeen {height: 1200px; position: relative;}

 
.algemeentekst{
	background: #89ABCB  no-repeat 0 0;
	color: white;
	font-size: 100%;
	padding: 10px 17px 17px 17px;
	text-align: justify;
	position: absolute;
	height: 342px;
	width: 599px;
	top: 434px;
	left: 126px;
	overflow: hidden;
	font-family: 'Roboto', serif;
	font-weight: 400;
	background-color: #35466A;
}

.algemeentekst ul {
	text-decoration:none;
	list-style:square;	
	padding-left:15px;
	line-height:20px;
	padding-bottom:10px;
}
 


.visietekst{
	background: #89ABCB  no-repeat 0 0;
	color: white;
	font-size: 100%;
	line-height: 110%;
	padding: 10px 17px 17px 17px;
	text-align: justify;
	position: absolute;
	height: 236px;
	width: 596px;
	top: 912px;
	left: 273px;
	overflow: hidden;
	background-color: #648DBB;
	font-family: 'Roboto', serif;
	font-weight: 400;
}

.aanbodtekst{
	background: #89ABCB  no-repeat 0 0;
	color: white;
	font-size: 100%;
	line-height: 130%;
	padding: 15px 17px 17px 17px;
	text-align: justify;
	position: absolute;
	height: 169px;
	width: 695px;
	top: 385px;
	left: 96px;
	overflow: hidden;
	background-color: #7BAAD8;
	font-family: 'Roboto', serif;
}


.aanbodtekst P {
padding-bottom:10px;
padding-top:10px;
}

.aanbodtekst ul {
	text-decoration:none;
	list-style:square;	
	padding-left:15px;
	line-height:20px;
	
}
.aanbodtekst ul li {
padding-left:15px;
	
}





#eiland .inside {background: transparent url('../img/eiland3.png') no-repeat 50% 215px; height: 100%;}

.vakantiediv{
	background: #05253a;
	position: absolute;
	left: 42px;
	heigth: 350px;
	width: 450px;
	top: 300px;
	text-align: left;
	height: 280px;
	border: #FFF 1px thin;
	padding: 20px;
	background-color: #05253a;
	font-family: 'Roboto', serif;
	font-size: 100%;
}

  .vakantiediv h2{
	color: white;
	height:30px;
 	margin-bottom:5px;
font-family: 'Ubuntu', sans-serif;
	font-size:140%;
}
 
.vakantiedag{
	width:450px;
	line-height:25px;
	margin-bottom:20px;
	color: #F9F9F9;
}

.datum{
width:50%;
display:block;
float:left;
}
.reden{
width:50%;
display:block;
float:left;
}
#sea .inside {background: transparent url('../img/bg-contact.jpg') no-repeat 0 147px; height: 100%;}

 .vlerkopvangnaam {
	background: url('../img/vlerkopvang-sea.png') no-repeat 0 0;
	position: absolute;
	top: 129px;
	left: -2px;
	z-index: 10;
	width: 400px;
	height: 140px;
}

 .contactdiv{
	background: #05253a;
	position: absolute;
	left: 469px;
	heigth:200px;
	width:400px;
	top: 761px;
	text-align:left;
	height: 200px;
	border:#FFF 1px thin;
	padding:20px;
	font-family: 'Roboto', serif;
	font-size:100%;
}
  .contactdiv h2{
	
color: white;
left:0;
top:0;
height:50px; 
font-family: 'Ubuntu', sans-serif;
	font-size:140%;
}

  .locatiesprijzendiv{
	position: absolute;
	left: 34px;
	width: 550px;
	top: 830px;
	height: 300px;
	border: #FFF 1px thin;
	padding: 20px;
	background-color: #14384C;
}

  .dommelvlerkdiv{
	position: absolute;
	left: 692px;
	width: 220px;
	top: 832px;
	height: 300px;
	border: #FFF 1px thin;
	padding: 20px;
	background-color: #14384C;
}
.dommelvlerklogodiv
{	clear:both;
	 
	height:190px;
	width:220px;
	background: transparent url('../img/dommelvlerk.png');
	background-repeat:no-repeat;
	background-position:center;
	
}

.locatiesdiv
{	clear:both;
	display:block;
	height:40%;
	width:550px;
}

.dommellocatiediv
{
	/*height:100%;*/
	width:220px;
	float:left;
	text-align:center;
}

.locatiediv
{
	/*height:100%;*/
	width:183px;
	float:left;
	text-align:center;
}
.locatiediv h2{
	color: white;
	 
	height:30px;
	line-height:30px;
	width:100%;
	font-family: 'Ubuntu', sans-serif;
	font-size:140%;
	

}
 .locatiediv p{
	height:60px;
color: white;
 padding-top:10px;
font-family: 'Roboto', serif;

 font-size:100%;

}

.prijzendiv
{  clear:both;  
   display:block;
	height:60%;
	width:100%;
}
.prijsdiv
{
	 
	width:100%;
	 
	text-align:center;
	
}
.prijsdiv h2
{
	color: white;
    line-height:25px;
	width:100%;
	 font-family: 'Ubuntu', sans-serif;
	font-size:110%;
}

.aanwezigheiddiv
{

	height:100%;
	width:33.3%;
	float:left;
	text-align:center;
	
}

.prijsdiv p{
	 
    color: white;
font-family: 'Roboto', serif;

 font-size:100%;

}

 

.adres{
	    width:100%;
		color: #fff;
		font-size:120%;
		line-height:140%;
		font-family: 'Roboto', serif;
	font-size:100%;
	
   
}
.mail-icon{
	width:34px;
	height:34px;
	position:absolute;
	top:103px;
	right:19px;
	background-image:url(../img/pin-icon.png);
	background-repeat:no-repeat;
   
}
.pin-icon{
	width:34px;
	height:34px;
	position:absolute;
	top:190px;
	right:21px;
	background-image:url(../img/mail-icon.png);
	background-repeat:no-repeat;
   
}
#footer {
		background: transparent url('../img/zand-schat.png') no-repeat 50% 0;
		color: #B8D9D7;
		margin: 0 auto; 
		text-align: center;
		position: absolute; bottom: 0; height: 400px; width: 100%; z-index: 1004;}



.overlay-bg {
     display: none; 
    position: fixed;
    top: 0;
    left: 0;
    height:100%;
    width: 100%;
    background: #000; /* fallback */
    background: rgba(0,0,0,0.75);
	z-index: 1005;
}
    .overlay-content {
        background: #fff;
        padding: 1%;
        width: 40%;
        position: relative;
        top: 15%;
        left: 50%;
        margin: 0 0 0 -20%; /* add negative left margin for half the width to center the div */
        border-radius: 4px;
        box-shadow: 0 0 5px rgba(0,0,0,0.9);
    }
 
    .close-btn {
        cursor: pointer;
        border: 1px solid #333;
        padding: 2% 5%;
        background: #a9e7f9; /* fallback */
        background: -moz-linear-gradient(top,  #a9e7f9 0%, #77d3ef 4%, #05abe0 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a9e7f9), color-stop(4%,#77d3ef), color-stop(100%,#05abe0));
        background: -webkit-linear-gradient(top,  #a9e7f9 0%,#77d3ef 4%,#05abe0 100%);
        background: -o-linear-gradient(top,  #a9e7f9 0%,#77d3ef 4%,#05abe0 100%);
        background: -ms-linear-gradient(top,  #a9e7f9 0%,#77d3ef 4%,#05abe0 100%);
        background: linear-gradient(to bottom,  #a9e7f9 0%,#77d3ef 4%,#05abe0 100%);
        border-radius: 4px;
        box-shadow: 0 0 4px rgba(0,0,0,0.3);
    }
    .close-btn:hover {
        background: #05abe0;
    }
.downloads_vlerk {
	display: block;
	position: absolute;
	top: 1350px;
	left: 616px;
	z-index: 10;
	height: 30px;
	width: 500px;
}
.downloads_dommel {
	display: block;
	position: absolute;
	top: 1382px;
	left: 616px;
	z-index: 10;
	height: 30px;
	width: 500px;
}
.downloads_algemeen {
	display: block;
	position: absolute;
	top: 1442px;
	left: 617px;
	z-index: 10;
	height: 30px;
	width: 500px;
	}
.downloads_dommel ul {
	text-decoration:none;
    list-style:none;	
	line-height:20px;
	text-align:center;
	font-family: 'Roboto', serif;
	font-size:100%;
}

.downloads_dommel ul li{
	display:block;
	
	padding-bottom:10px;
	
}
.downloads_dommel ul li a{
	text-decoration:none;
	color: #14384C;
}


.downloads_vlerk ul {
	text-decoration:none;
    list-style:none;	
	line-height:20px;
	text-align:center;
	font-family: 'Roboto', serif;
	font-size:100%;
}

.downloads_vlerk ul li{
	display:block;
	
	padding-bottom:10px;
	
}
.downloads_vlerk ul li a{
	text-decoration:none;
	color: #14384C;
}


.downloads_algemeen ul {
	text-decoration:none;
    list-style:none;	
	line-height:20px;
	text-align:center;
	font-family: 'Roboto', serif;
	font-size:100%;
}

.downloads_algemeen ul li{
	display:block;
	
	padding-bottom:10px;
	
}
.downloads_algemeen ul li a{
	text-decoration:none;
	color: #14384C;
}



/*graphics
---------------------- */

.bottle{
	display: block;
	background: url('../img/bottle.png') no-repeat 0 0;
	position: absolute;
	top: 943px;
	left: 726px;
	z-index: 1003;
	height: 128px;
	width: 128px;
}
.bottle2{
	display: block;
	background: url('../img/bottle4.png') no-repeat 0 0;
	position: absolute;
	top: 1183px;
	left: 706px;
	z-index: 1003;
	height: 125px;
	width: 150px;
}
.download-text {
	display: block;
	background: url('../img/download.png') no-repeat 0 0;
	position: absolute;
	top: 835px;
	left: 726px;
	z-index: 10;
	height: 30px;
	width: 115px;
}
.maan{
	display: block;
	background: url('../img/maan.png') no-repeat 0 0;
	position: absolute;
	top: 14px;
	left: 800px;
	z-index: 1003;
	height: 159px;
	width: 205px;
}
.mail{
	display: block;
	background: url('../img/mail.png') no-repeat 0 0;
	position: absolute;
	top: 871px;
	left: 96px;
	z-index: 1003;
	height: 128px;
	width: 128px;
}
.raket{
	display: block;
	background: url('../img/raket-naam.png') no-repeat 0 0;
	position: absolute;
	top: 40px;
	left: 10px;
	z-index: 1003;
	height: 344px;
	width: 512px;
}
.vlerkopvang-naam {
	display: block;
	background: url('../img/titel-vlerkopvang.png') no-repeat 0 0;
	position: absolute;
	top: 63px;
	left: 56px;
	z-index: 10;
	height: 150px;
	width: 400px;
}

.bus {
	display: block;
	position: absolute;
	background: url('../img/vlerkbus.png') no-repeat 0 0;
	height: 287px;
	width: 200px;
	top: 482px;
	right: -11px;
	z-index: 1002;
}

.zeepaardje {
	cursor: help;
	display: block;
	position: absolute;
	z-index: 1000;
	background: url('../img/zeepaardje.png') no-repeat 0 0;
	height: 48px;
	width: 48px;
	top: 132px;
	right: 729px;
}
.turtle {
	cursor: help;
	display: block;
	position: absolute;
	z-index: 1000;
	background: url('../img/turtle.png') no-repeat 0 0;
	height: 256px;
	width: 256px;
	top: 379px;
	right: 129px;
}
.nemo {
	cursor: help;
	display: block;
	position: absolute;
	z-index: 1000;
	background: url('../img/nemo.png') no-repeat 0 0;
	height: 200px;
	width: 200px;
	top: 766px;
	right: 669px;
}
.schat {
	cursor: help;
	display: block;
	position: absolute;
	z-index: 2001;
	background: url('../img/schat.png') no-repeat 0 0;
	height: 256px;
	width: 256px;
	top: 924px;
	right: 102px;
}
#ac-wrapper {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(255,255,255,.6);
z-index: 1101;
}
#popup{
width: 550px;
height: 220px;
background: #FFFFFF;
border: 5px solid #000;
border-radius: 25px;
color:#009;
-moz-border-radius: 25px;
-webkit-border-radius: 25px;
box-shadow: #64686e 0px 0px 3px 3px;
-moz-box-shadow: #64686e 0px 0px 3px 3px;
-webkit-box-shadow: #64686e 0px 0px 3px 3px;
position: relative;
top: 25%; left:25%;
}

#popup a{
 color:#000;
}