body {
background-color: black;
width: 1285px;
height: auto;
text-align: center:
}




.page  {
position: absolute;
width: 1215px;
height: auto;
margin-left: 40px;
background-color: #82ffc0;
}


.header {
position: relative;
width: 100%;
height: 401px;
background-color: #82ffc0;
border-bottom: 1px solid black;
}


.headerimg {
position: relative;
width: 1215px;
height: 300px;
background-color: #82ffc0;
background-image: url("images/banner.png");
background-repeat: no-repeat;
border-bottom: 1px solid black;
}


.headerbalk {

}


.sibis {
position: relative;
float: left;
background-color: #82ffc0;
width: 300px;
height: 100px;
font-family: monotype corsiva;
font-size: 90px;
text-align: center;
color: blue;
}


.telnr {
position: relative;
float: right;
width: 899px;
height: 40px;
background-color: #82ffc0;
font-family: monotype corsiva;
font-size: 35px;
font-weight: bold;
text-align: center;
padding-right: 15px;
}


.naam {
position: relative;
float: right;
width: 899px;
height: 45px;
background-color: #82ffc0;
font-family: monotype corsiva;
font-size: 30px;
color: black;
font-weight: none;
text-align: center;
padding-right: 15px;
padding-top: 15px;
}

.p1 {
color: blue;
font-weight: bold;
}

.navbarcontainer {
position: absolute;
width: 301px;
height: 290px;
background-color: #82ffc0;
}

.navbar {
position: relative;
float: left;
margin-top: 0px;
width: 301px;
height: 200px;
}



ul {
     list-style-type: none;
     margin: 0px;
     padding: 0px;
     background-color: #82ffc0;     
} 




li a {
     display: block;
     width: 301px;
     height: 40px;
     font-size: 30px;
     generic-family: Serif;
     font-family: Times New Roman;
     font-weight: bold;
     color: black;  
     border-bottom: 0.5px solid black;
     text-align: center;
     padding-top: 10px;
     padding-bottom: 0px;
}

li a:hover {
    background-color: black;
    color: #82ffc0;
}



a:link {
    text-decoration: none;
}


li.current {
   background-color: white;
   color: black; 
}


.inhoud {
background-color: white;
position: relative;
width: 534px;
height: auto;
min-height: 360px;
float: left;
margin-left: 301px;
margin-top: 0px;
generic-family: Serif;
border-right: 0.5px solid black;
border-left: 0.5px solid black;
border-bottom: 0.5px solid black;
font-family: Times New Roman;
font-size: 21px;
text-align: left;
padding: 40px;
}





.fotoboek {
background-color: white;
position: relative;
width: 534px;
height: auto;
min-height: 360px;
float: left;
margin-left: 301px;
margin-top: 0px;
generic-family: Serif;
border-right: 0.5px solid black;
border-left: 0.5px solid black;
border-bottom: 0.5px solid black;
font-family: Times New Roman;
font-size: 21px;
text-align: left;
padding: 40px;
}







.lightbox-target {
position: fixed;
top: -100%;
background: black;
width: 50%;
height: 60%;
-webkit-transition: opacity .5s ease-in-out;
-moz-transition: opacity .5s ease-in-out;
-o-transition: opacity .5s ease-in-out;
transition: opacity .5s ease-in-out;
overflow: hidden;
z-index: 1;
}

/* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */

.lightbox-target img {
margin: auto;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
max-height: 0%;
max-width: 0%;
border: 10px solid white;
box-shadow: 0px 0px 8px rgba(0,0,0,.3);
box-sizing: border-box;
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
}

/* Styles the close link, adds the slide down transition */

a.lightbox-close {
display: block;
width:50px;
height:50px;
box-sizing: border-box;
background: white;
color: white;
text-decoration: none;
position: absolute;
top: -80px;
right: 0;
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
}

/* Provides part of the "X" to eliminate an image from the close link */

a.lightbox-close:before {
content: "";
display: block;
height: 30px;
width: 1px;
background: black;
position: absolute;
left: 26px;
top: 10px;
-webkit-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-o-transform:rotate(45deg);
transform:rotate(45deg);
}

/* Provides part of the "X" to eliminate an image from the close link */

a.lightbox-close:after {
content: "";
display: block;
height: 30px;
width: 1px;
background: black;
position: absolute;
left: 26px;
top: 10px;
-webkit-transform:rotate(-45deg);
-moz-transform:rotate(-45deg);
-o-transform:rotate(-45deg);
transform:rotate(-45deg);
}

/* Uses the :target pseudo-class to perform the animations upon clicking the .lightbox-target anchor */

.lightbox-target:target {
opacity: 1;
top: 0;
bottom: 0;
}

.lightbox-target:target img {
max-height: 100%;
max-width: 100%;
}

.lightbox-target:target a.lightbox-close {
top: 0px;
}



.fotoarnold {
background-color: #82ffc0;
position: absolute;
width: 257px;
height: auto;
min-height: 400px;
float: left;
margin-left: 916px;
margin-top: 0px;
padding-left: 24px;
padding-top: 24px;
}



.footer {
width: 1195px;
height: 200px;
position: relative;
margin-top: 10px;
float: left;
background: #82ffc0;
background: -webkit-linear-gradient(#82ffc0, #bdffde);
background: -o-linear-gradient(#82ffc0, #bdffde);
background: -moz-linear-gradient(#82ffc0, #bdffde);
background: linear-gradient(#82ffc0, #bdffde);
generic-family: Serif;
font-family: Times New Roman;
font-size: 20px;
text-align: justify;
padding: 10px;
}