/*Stijl FB */


html{
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}


@font-face {
    font-family: 'optimusprincepssemiboldRg';
    src: url('Fonts/optimusprincepssemibold-webfont.woff2') format('woff2'),
         url('Fonts/optimusprincepssemibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

#wrapper {
	width: 100%;
	/*background-color: hsl(55, 74%, 95%);*/
	background: linear-gradient(to bottom, #FCFAE9 10%,#E6FFA2 100%); /* groen: #E6FFA2* blauw: #E8FFFF  */
}

header {
	
}

.kop1{
	width: 100%;
	font-family: 'optimusprincepssemiboldRg', sans-serif;
	font-size: 7.5vw;
	padding-top: 25px;
	text-align: center;
	letter-spacing: 1px;
	color: #505050;
	text-shadow: 2px 2px 5px #bbb;
}


.kop2{
	font-family: 'Playfair Display', sans-serif;
	font-size: 2vw;
	margin: 40px 5px;
	text-align: center;
	letter-spacing: 5px;
	color: #505050;
	text-shadow: 2px 2px 5px #bbb;
}
	
.menu {
	width: 75%;
	font-family: 'Playfair Display', sans-serif;
	font-size: 1.8vw;
	color: #505050;
	margin: auto;
	text-align: center;
	padding: 0 2vw;
	
	}

.menu ul{
	padding: 10px;
	list-style-type: none;
}	

.menu li{
	display: inline;
	
	
}	

.menu li a{
	margin: auto;
	text-decoration: none;
	padding: 0 2vw;
	
}

.menu li a:hover {
	text-decoration-line: underline;
	
	
}

.menu li a:visited{
	color: #505050;
}	
	
.homefoto{
	width: 75%;
	margin: auto;
	padding-bottom: 20px;

}

.hometekst {
	width: 50%;
	margin: auto;
	padding-top: 20px;
	padding-left: 3px;
	padding-right: 3px;
	padding-bottom: 20px;
	text-align: center;
	color: #505050;   /*#E6FFA2; ----   achtergrondkleur  ----- */
	font-family: 'Playfair Display', sans-serif;
	font-size: 1vw;
}
	
.werkfoto{
	width: 75%;
	margin: auto;

}

.fotobijschrift {
	position: relative;
	font-family: 'Playfair Display', sans-serif;
	font-size: 1.8vw;
	text-shadow: 1px 1px 2px #fff;
	padding-top: 5px;
	padding-bottom: 15px;
	padding-left:5px;
	color: #505050;
}

.bijschriftschuin{
	font-family: 'Playfair Display', sans-serif;
	font-style: italic;
	font-size: 1.4vw;
	color: #505050;
}	

.tekstpagina {
	width: 85%;
	margin: auto;
	padding: 0 2vw;
	display: flex;
	/*flex-flow: row wrap;*/
}	

.tekst {
	width: 50%;
	padding-top: 20px;
	padding-left: 3px;
	padding-right: 3px;
	padding-bottom: 100px;
	
	font-family: 'Playfair Display', sans-serif;
	font-size: 2vw;
}

.tekst::first-letter {
	font-size: 2.7vw;
}

.fototekst {
	width: 50%;
	padding-top: 20px;
	padding-left: 3px;
	padding-right: 3px;

}
.video {

}	

.prijs {
	color: #000000;
	font-weight: bold;
}	

.contactpagina {
	width: 75%;
	margin: auto;
	padding: 0 2vw;
	
}

.contacttekst {
	width: 100%;
	text-align: center;
	padding-top: 20px;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 50px;
	
	font-family: 'Playfair Display', sans-serif;
	font-size: 2vw;
}
	
form {
	padding-top: 2px;
	padding-left: 3px;
	padding-right: 3px;
	padding-bottom: 100px;
	font-family: 'Playfair Display', sans-serif;
	font-size: 1.4vw;
	
}

	
table {
	margin: auto;

}

.instalink {
	width: 50%;
	margin: auto;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 50px;
	text-align: center;
}	
	
footer{
	width: 75%;
	margin: auto;
	padding-top: 20px;
	padding-bottom: 20px;
	font-family: 'Playfair Display', sans-serif;
	font-size: 1.7vw;
	text-align: center;
}
	
	
.fotogalerij {  max-width: 100%;  margin: 20px auto; text-align: center; }
.fotogalerij img { border: 1px solid darkgrey; margin: 4px; }
.foto-popup { display: none; }
.foto-popup:target { display: block; position: fixed; z-index: 999; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,0.8); text-align: center; }
.foto-popup img { max-width: 90%; max-height: 90%; position: relative; top: 1em; }
.vorige, .volgende { position: fixed; top: 50%; transform: translateY(-50%); text-decoration: none; color: darkgrey; font-size: 5em; }
.vorige:hover, .volgende:hover { color: white; }
.vorige { left: 20px; }
.volgende { right: 20px; }

@media screen and (max-width: 400px) { .vorige, .volgende { font-size: 3em; } } 
