@charset "utf-8";
/* Consolidated original CSS — no removal of existing style rules. */

/* ===========================================================
   ORIGINAL FILE: style.css
   Rules preserved in original order.
   =========================================================== */

/* CSS Document */


/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   https://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
a { text-decoration: none !important;}

.ie6 img {
	width:100%;
}
.shadow {
	margin: 30px 0;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 4px 2px 0 rgba(0, 0, 0, 0.19);
	max-width: min(1280px, 100%);
	width: auto;
	height: auto;
}
.line {
	border-bottom: solid 2px #ddd;
	padding: 30px 0;
	max-width: min(1280px, 100%);
	width: auto;
	height: auto;
}
.small {
	padding: 0;
	max-width: 600px;
	width: 100%;
}
.big {
	border-bottom: solid 2px #ddd;
	padding: 30px 0 30px;
}
.helft {
	width:46%;
	padding:0 1%;
	
}
.gallery-row {
	flex-direction:row;
	align-content:center;
	margin: 0 auto;
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
}
.derde {
	padding: 21px 3px;
	width: 30%;
	}
.mini {
	padding: 21px 1%;
	width: 300px;
	}
.end {
	padding: 30px 0 60px 0;
	max-width: 800px;
	width: 100%;
}
html{
  margin:0 !important;
  padding:0 !important;
  height: auto;
  overflow-x: hidden; /* ok */
  overflow-y: auto;   /* body mag scrollen */
}
#header-fixed {
	display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000; /* zorgt dat hij boven alles blijft */
    background: white; /* of transparant, wat jij wil */
	padding-bottom: 10px;
}
body {
  	/*height:100%;
	/*width:100%
	
	overflow: auto;*/
	margin:6px auto 0;
	  height: auto;
  overflow-y: auto;
	overflow-x: hidden;
}
body.no-scroll {
  overflow: hidden; /* geen scroll mogelijk */
}

#blok-wrap p a {
	display: inline;
	color: #666666;
	font-weight: 500;
	width: 100%;
	text-align:left;
	z-index:5;
	max-width:1300px;
	min-width: 0px;
	line-height: 24px;			    
}

video {
width:100% !important;
max-width:900px;
object-fit: fill !important;
}
	
#wrapper {
	/*align-items: flex-start !important;*/
	  height: auto;
  min-height: 100vh; /* optioneel */
  overflow: visible;
	/*position: absolute;
	overflow-y: scroll;
	margin: 0 -20px;*/
}	

#webpage {
	  height: auto;
  min-height: 100vh; /* optioneel */
  overflow: visible;
	
	margin:0 auto;
	width:100%;
	/*height:100%;*/
	background-color:#fff;
	/*overflow-y:scroll;*/
	display:flex;
	flex-direction: column;
	}
#webpage-contact {
	margin:0 auto;
	width:100%;
	height:auto;
	background-color:#fff;
	/*overflow-y:scroll;*/
	display: flex;
	/* align-items: center; */
	flex-direction: column;
	overflow:visible;
}
.row {
	display: flex;
	flex-wrap: wrap;
	margin: 25px 0px;
	/* justify-content: center; */
	max-width: 900px;
	border-top:solid 6px #ddd;
	padding-top: 15px;
}
  #blok-wrap .row a{
	   width:35px;
	   cursor: grab;
	   min-width: 0px;
	   display: flex;
	   flex-wrap: wrap;
	   margin: 2px 5px;
	   }
.icon {
	width: 35px;
	}
#boven {
	height: 50px;
	background-color: #fff;
	/* height: 100%; */
	overflow: visible;
	/* position: absolute;
    top: 0; */
	z-index: 90;
	margin-top: 15px;
	display: flex;
	flex-direction: row;
	/* align-items: center; */
	/* align-content:  center; */
	justify-content: space-evenly;
	border-bottom: rgb(187 187 187) solid 2px;
	margin-right: 30px;
	width: 100%;
}	
		#menu{
		display:block;
		min-width: 40px;
		/* padding: 0px 4%; */
		}
		
		
#paginatitel {
	display:flex;
	/* align-content: flex-start; */
	align-items: center;
	justify-content: center;
	color:rgba(255,255,255,0.5);
	padding: 0px 20%;
	}
#paginatitel a {
    font-family: "acumin-pro-condensed",sans-serif;
    font-style: normal;
    font-weight: 400;
    color: #aaa;
    font-size: 26px;
    /* line-height: 50px; */
    padding: 12px 20px 0px;
    text-align: center;
    text-decoration: none;
    /*text-transform: uppercase;*/
	 border-bottom: transparent solid 5px;
    transition: all 0.2s ease 0s;
	
    /*margin: 0 2% 0;*/
}			
		#paginatitel  a:hover  {
		line-height: 23px;
		color: #7D7D7D;
		text-decoration:none;
		/*background-color:rgba(255,255,255,0.50);*/
		/*text-transform: uppercase;*/
		padding: 16px 20px 0px;
		border: rgb(187 187 187) solid 2px;
		border-radius: 5px 5px 0 0;
		margin: 10px 0 0 0;
		border-left: rgb(187 187 187) solid 2px;
		border-right: rgb(187 187 187) solid 2px;
		border-bottom: #fff solid 5px;
		transition: all 0.2s ease 0s;
		}
		
		#paginatitel  a.active  {
		line-height: 23px;
		color: #7D7D7D;
		text-decoration:none;
		/*background-color:rgba(255,255,255,0.50);*/
		/*text-transform: uppercase;*/
		padding: 16px 20px 0px;
		border: rgb(187 187 187) solid 2px;
		border-radius: 5px 5px 0 0;
		margin: 10px 0 0 0;
		border-left: rgb(187 187 187) solid 2px;
		border-right: rgb(187 187 187) solid 2px;
		border-bottom: #fff solid 5px;
		transition: all 0.2s ease 0s;
		}
			
	.header-knop {
			display:flex;
			float:right;
			/*background-color: #4b4b4b;*/
			height: 30px;
			/* border-radius: 5px; */
			padding: 10px 20px;
			border-left: thin #ffffff solid;
			border-top:none;
			align-items:center;
			justify-content:space-between;
			}
			
			.header-knop li {
			display:block;
			float:left;
			position:relative;
			margin:0 14px;
			color:#fff;
			font-weight:300;
			}
			.header-knop-home2 a {
			/*display:none;*/
			display:none;
			float:left;
			position:relative;
			background-image:url(images/knoppen/home.svg);
			width:35px;
			height:35px;
			margin:0;
			border-radius: 5px 5px 0 0;
			border: #fff solid 2px;
			border-left: #fff solid 2px;
			border-right: #fff solid 2px;
			border-bottom: #fff solid 2px;
			transition-duration:0.3s;
			}
			.header-knop-home a {
			display:block;
			float:left;
			position:relative;
			background-image:url(images/knoppen/Bart.svg);
			width:35px;
			height:35px;
			margin:0;
			border-radius: 5px 5px 0 0;
			border: #fff solid 2px;
			border-left: #fff solid 2px;
			border-right: #fff solid 2px;
			border-bottom: #fff solid 2px;
			transition-duration:0.3s;
			}
			.header-knop-home a:hover {
			background-image:url(images/knoppen/Bartdark.svg);
			border-top: rgb(187 187 187) solid 2px;
			margin: 12px 0 0 0;
			border: rgb(187 187 187) solid 2px;
			border-radius: 5px 5px 0 0;
			border-left: rgb(187 187 187) solid 2px;
			border-right: rgb(187 187 187) solid 2px;
			border-bottom: #fff solid 5px;
			}
			.header-knop-home a.active {
			background-image:url(images/knoppen/Bartdark.svg);
			/*background-color: #4b4b4b;*/
			border-top: rgb(187 187 187) solid 2px;
			margin: 12px 0 0 0;
			/* padding: 16px 30px 0px; */
			border-radius: 5px 5px 0 0;
			/* margin-top: 5px; */
			border-left: rgb(187 187 187) solid 2px;
			border-right: rgb(187 187 187) solid 2px;
			border-bottom: #fff solid 5px;
			}
			.header-knop-contact a {
			display:block;
			float:left;
			position:relative;
			background-image:url(images/knoppen/contactwhite.svg);
			width:35px;
			height:35px;
			margin:0;
			border-radius: 5px 5px 0 0;
			border: #fff solid 2px;
			border-left: #fff solid 2px;
			border-right: #fff solid 2px;
			border-bottom: #fff solid 2px;
			transition-duration:0.3s;
				
			}
		.header-knop-contact a:hover {
			background-image:url(images/knoppen/contact.svg);
			/*background-color: #4b4b4b;*/
			border-top: rgb(187 187 187) solid 2px;
			margin: 12px 0 0 0;
			/* padding: 16px 30px 0px; */
			border-radius: 5px 5px 0 0;
			/* margin-top: 5px; */
			border-left: rgb(187 187 187) solid 2px;
			border-right: rgb(187 187 187) solid 2px;
			border-bottom: #fff solid 5px;
			}
			.header-knop-contact a.active {
			background-image:url(images/knoppen/contact.svg);
			/*background-color: #4b4b4b;*/
			border-top: rgb(187 187 187) solid 2px;
			margin: 12px 0 0 0;
			/* padding: 16px 30px 0px; */
			border-radius: 5px 5px 0 0;
			/* margin-top: 5px; */
			border-left: rgb(187 187 187) solid 2px;
			border-right: rgb(187 187 187) solid 2px;
			border-bottom: #fff solid 5px;
			}			

			.header-knop-shop a {
			display:block;
			float:left;
			position:relative;
			background-image:url(images/knoppen/shopgrey.svg);
			width:35px;
			height:35px;
			margin:0;
			border-radius: 5px 5px 0 0;
			border: #fff solid 2px;
			border-left: #fff solid 2px;
			border-right: #fff solid 2px;
			border-bottom: #fff solid 2px;
			transition-duration:0.3s;
				
			}
		.header-knop-shop a:hover {
			background-image:url(images/knoppen/shopdark.svg);
			/*background-color: #4b4b4b;*/
			border-top: rgb(187 187 187) solid 2px;
			margin: 12px 0 0 0;
			/* padding: 16px 30px 0px; */
			border-radius: 5px 5px 0 0;
			/* margin-top: 5px; */
			border-left: rgb(187 187 187) solid 2px;
			border-right: rgb(187 187 187) solid 2px;
			border-bottom: #fff solid 5px;
			}
			.header-knop-shop a.active {
			background-image:url(images/knoppen/shopdark.svg);
			/*background-color: #4b4b4b;*/
			border-top: rgb(187 187 187) solid 2px;
			margin: 12px 0 0 0;
			/* padding: 16px 30px 0px; */
			border-radius: 5px 5px 0 0;
			/* margin-top: 5px; */
			border-left: rgb(187 187 187) solid 2px;
			border-right: rgb(187 187 187) solid 2px;
			border-bottom: #fff solid 5px;
			}	

	#gallery-space {
	  height: auto;
  min-height: 100vh; 
  overflow: visible;	
  overflow-y: visible;
   /* height: auto;
	min-height: 100vh;
    position: absolute;
    top: 75px;*/
    width: 100%;
    margin: 1% 1% 0 0%;
		padding-top: 60px;
 }

	#blok-wrap{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: flex-start;

  width: 100%;
  max-width: 1260px;
  margin: 0 auto;   /* 👈 this is the key */

  height: auto;
  overflow: visible;
		}
   
    #blok-wrap a{
	   width: 30%;
	   text-align:center;
	   z-index:5;
	   cursor:pointer;
	   flex-grow: 1;
	   flex-shrink: 1;
	   max-width: 500px;
	   min-width: 250px;
	   display: flex;
	   flex-wrap: wrap;
	   justify-content: center;
	   align-items: center;
	   align-content: center;
	   transition:1s;
	   position: relative;
	   }

	#blok-wrap-editorial{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: flex-start;

  width: 100%;
  max-width: 1950px;
  margin: 0 auto;   /* 👈 this is the key */

  height: auto;
  overflow: visible;
		}
   



  .blockhead {
	   width: 100%;
	   text-align:center;
	   z-index:5;
	   flex-grow: 1;
	   flex-shrink: 1;
	   max-width: 1280px;
	   min-width: 250px;
	   display: flex;
	   flex-wrap: wrap;
	   justify-content: center;
	   align-items: center;
	   align-content: center;
	   transition:1s;
	   position: relative;
	   margin: 20px 0px;
	   border-bottom: solid 6px #ddd;
	   padding-bottom: 30px;
	    }

  .blockhead-editorial {
	   width: 100%;
	   text-align:center;
	   z-index:5;
	   flex-grow: 1;
	   flex-shrink: 1;
	   max-width: 1950px;
	   min-width: 250px;
	   display: flex;
	   flex-wrap: wrap;
	   justify-content: center;
	   align-items: center;
	   align-content: center;
	   transition:1s;
	   position: relative;
	   margin: 20px 0px;
	   border-bottom: solid 6px #ddd;
	   padding-bottom: 30px;
	    }



.blockhead .blok-klein-full{
	   width: 45%;
	   text-align:center;
	   z-index:5;
	   flex-grow: 1;
	   flex-shrink: 1;
	   max-width: 1280px;
	   min-width: 250px;
	   display: flex;
	   flex-wrap: wrap;
	   justify-content: center;
	   align-items: center;
	   align-content: center;
	   transition:1s;
	   position: relative;
	   margin: 30px 10px;
	   }

.blockhead .blok-kleiner{
	   width: 25%;
	   text-align:center;
	   z-index:5;
	   flex-grow: 1;
	   flex-shrink: 1;
	   max-width: 300px;
	   min-width: 100px;
	   display: flex;
	   flex-wrap: wrap;
	   justify-content: center;
	   align-items: center;
	   align-content: center;
	   transition:1s;
	   position: relative;
	   padding:10px;
	   margin: 10px 1;
	   }

	#logo {
			position: absolute;
			/* display: block; */
			width: 10%;
			text-align:center;
			z-index: 115;
			/* cursor:pointer; */
			/* flex-grow: 1; */
			/* flex-shrink: 1; */
			max-width: 150px;
			min-width: 100px;
			/* display: flex; */
			/* flex-wrap: wrap; */
			/* justify-content: center; */
			/* align-items: center; */
			/* align-content: center; */
			transition:1s;
			/* position: absolute; */
			background-color: white;
			/* border: rgb(187 187 187) solid 2px; 
			-webkit-border-radius:5px;
			-moz-border-radius:5px;*/
			/* border-radius:5px; */
			margin: 10px 20px;
			/* height: auto; */
	   }

	 
	#blok-wrap-klein {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		align-content: flex-start;
		height: 100%;
		overflow: auto;
		width: 94%;
		padding: 0.5% 3%;
		}

	  #blok-wrap-klein a{
	   width: 30%;
	   text-align:center;
	   z-index:5;
	   cursor:pointer;
	   flex-grow: 1;
	   flex-shrink: 1;
	   max-width: 400px;
	   min-width: 250px;
	   display: flex;
	   flex-wrap: wrap;
	   justify-content: center;
	   align-items: center;
	   align-content: center;
	   transition:1s;
	   }
	#blok-wrap-heel-klein {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		align-content: flex-start;
		height: 100%;
		overflow: auto;
		width: 94%;
		padding: 0.5% 3%;
		}

	  #blok-wrap-heel-klein a{
	   width: 20%;
	   text-align:center;
	   z-index:5;
	   cursor:pointer;
	   flex-grow: 1;
	   flex-shrink: 1;
	   max-width: 290px;
	   min-width: 150px;
	   display: flex;
	   flex-wrap: wrap;
	   justify-content: center;
	   align-items: center;
	   align-content: center;
	   transition:1s;
	   }
	     
.wrapper-gallery {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		/*height: 98%;*/
		overflow: auto;
		width: 100%;
		flex-direction: column;
		/*margin: 35px 0 0 0;*/
		background-color: white;
		/*padding: 80px 0 0 0;*/
		}
	
		.tekst{
			display: flex;
			justify-content: center;
			font-size:18px; 
			font-family: "acumin-pro", sans-serif;
  			font-weight: 200;
			z-index:101;
			
			-webkit-border-radius:5px;
			-moz-border-radius:5px;
			border-radius:5px;
			overflow:hidden;
			width: 100%;
			text-align:center;
			cursor:pointer;
			flex-grow: 2;
			flex-shrink: 2;
			/* max-width: 300px; */
			/* min-width: 200px; */
			position:relative;
			

		}	
		.darklayer{
			color:rgba(50,50,50,0.0);
			transition-duration:1s;
			z-index:100;
			position: absolute;
			width: 100%;
			/* height: 100%; */
			/* align-items: center; */
			/* justify-content: center; */
			/* display: flex; */
			/* flex-direction:column; */
			}
			.darklayer:hover {
			background-color:rgba(230,230,230,1);
			z-index:101;
			color:#fff;
			}
			.darklayer:hover {
			background-color:rgba(230,230,230,1);
			z-index:101;
			color:#fff;
			}
		
		
		#blok-wrap-klein .blok:hover{
			border:2px solid rgba(120,120,120,0.5);
			-moz-box-sizing: border-box;
   			-webkit-box-sizing: border-box;
			box-sizing: border-box;
			background-color:rgba(120,120,120,0.5);
			padding: 10px;
		}

	   	.blokhead {
			/*-webkit-border-radius:5px; 
			-moz-border-radius:5px;
			border-radius:15px;*/
			overflow:hidden;
			
		  	display:block;
		 	background-repeat:none;
		 	z-index:5;
		   	transition:1s;
				   		
			/*-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
			border:10px solid #fff;*/
	}
   		.blockhead .blok {	
			width: 100%;
			max-width:1260px;
			margin-left: auto;
  			margin-right: auto;
			
			overflow:hidden;
			display: flex;
			z-index:5;
			transition:1s;
			padding: 5px 10px;
			max-height: 680px;
			align-content: center;
			justify-content: center;
			align-items: center;
			margin: 5px 0px;
			 min-width: 0;
			}


.blockhead-editorial .blok {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: center;

    width: 100%;
    max-width: 1950px;
    box-sizing: border-box;

    overflow: visible;
    max-height: none;
    height: auto;

    padding: 0;
    margin: 10px 0;
    gap: 0;
}




.blockhead-editorial .blok img {
    display: block;
    height: auto;
    max-width: 100%;
    flex-shrink: 0;
}

/* Row 1: 1/3 + 2/3 */
.blockhead-editorial .blok:nth-child(1) img:first-child {
    width: 33.3333%;
}

.blockhead-editorial .blok:nth-child(1) img:last-child {
    width: 66.6667%;
}

/* Row 2: 2/3 + 1/3 */
.blockhead-editorial .blok:nth-child(2) img:first-child {
    width: 66.6667%;
}

.blockhead-editorial .blok:nth-child(2) img:last-child {
    width: 33.3333%;
}

/* Row 3: 3/3 */
.blockhead-editorial .blok:nth-child(3) img {
    width: 100%;
}

/* Row 4: 2/3 + 1/3 */
.blockhead-editorial .blok:nth-child(4) img:first-child {
    width: 66.6667%;
}

.blockhead-editorial .blok:nth-child(4) img:last-child {
    width: 33.3333%;
}



   		.blockhead .panoramisch {	
			width: 100%;
			margin-left: auto;
  			margin-right: auto;
			overflow:hidden;
			display: flex;
			z-index:5;
			transition:1s;
			max-height: 600px;
			align-content: center;
			justify-content: center;
			align-items: center;
			 min-width: 0;
			}
	   panoramisch img{
		   max-width:100%;
		   height:auto;
		   display:block;}

		   	a .blok {
			-webkit-border-radius:5px; 
			-moz-border-radius:5px;
			border-radius:15px;
			overflow:hidden;
			
		  	display:block;
		 	background-repeat:none;
		 	z-index:5;
		   	transition:1s;
				   		
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
			border:10px solid #fff;
			padding:none !important;
	}

			a .blok:hover{
			border:10px solid rgba(120,120,120,0.5);
			-moz-box-sizing: border-box;
   			-webkit-box-sizing: border-box;
			box-sizing: border-box;
			background-color:rgba(120,120,120,0.5);
			/*	padding: 10px;*/
		}
	   .blok img{
		   max-width:100%;
		   height:auto;
		   display:block;
		   
		 /*-webkit-border-radius:5px; 
			-moz-border-radius:5px;
			border-radius:5px;*/
			z-index:50;
		   }
	
		#blok-wrap-klein a .blok img{
		   max-width:100%;
		   height:auto;
		   display:block;
			z-index:50;
		  -webkit-border-radius:5px;
		   -moz-border-radius:5px;
		   border-radius:5px;
		   
		   border: solid 2px rgb(255, 255, 255);
		   box-sizing: border-box;
		   border-style: dashed;
		   }
	
	.knop{
		text-align:center;
		position:absolute;
		bottom:0px;
		color:white;
		width:100%;
		height:35px;
		}
	#contact {
		height:50px;
		font-family:Aktiv Grotesk;}
	
  
		
		
		
h1 {
			width: 100%;
			font-size: 24px;
			line-height: 30px;
			font-family: "Spectral", serif;
  			font-style: italic;
  			font-weight: 400;
			color:#898989;
			text-align: left;
			margin: 24px 0px 20px;
			
			/* float: inline-start;font-family: "quasimoda",sans-serif;
			font-weight: 300;font-style:italic; */
	
	}
	
.hoofdtitel {
	display: block;
	width: 100%;
	margin: 0 0 0 15%;
}

#blok-wrap .hoofdtitel h1 a {
    display: inline !important;
}

h2 {
			font-size: 26px;
			/* line-height: 26px; */
			font-family: "acumin-pro-condensed",sans-serif;
			font-weight: 400;
			color: #666666;
			text-align:center;
			/* margin:1%; */
			border: solid 2px #ccc;
			padding: 10px 8px 6px;
	}
.blok h2 {
	text-decoration: none !important;
	color: #262626;
	font-weight: 300;
}
h5{
			font-size: 20px;
			line-height: 20px;
	font-family: "acumin-pro", sans-serif;
  	font-weight: 200;
			text-align:center;
			margin: 0 1% 1%;
			color:rgba(150,150,150,1);
			}
h3 {
			font-size:26px;
			line-height:30px;
			font-family: "acumin-pro", sans-serif;
  			font-weight: 200;
			color:#696969;
			text-align:center;
			padding: 0 0 5px 0;
			margin: 0;
	}

.wrapper-gallery h3 {
			font-size:26px;
			line-height:30px;
				font-family: "acumin-pro", sans-serif;
  	font-weight: 200;
			color:#696969;
			text-align:center;
			padding: 10px 0 15px 0;
			margin: 0;
			letter-spacing: 1px;
	}
/*h4 {
			font-size: 35px;
			line-height:20px;
			font-family: "quasimoda-2",sans-serif;
			font-weight:200;
			color:#ddd;
			text-align: center;
			margin: 0 0 20px 0;
	}*/

h4 {
   color: #8f8e8e;
    font-family: "quasimoda-2",sans-serif;
    font-size: 35px;
    font-weight: 200;
    line-height: 20px;
    margin: 10px 0 20px;
    text-align: center;
    width: 100%;
}

	
strong{
			font-family: "quasimoda-2",sans-serif;
			font-weight: 600;
			color: #a59967;
			}		
			
			
p {
	font-size: 18px;
	line-height: 24px;
	font-family: "acumin-pro", sans-serif;
  	font-weight: 200;
	display:block;
	margin: 10px 0px 30px 0px;
	max-width: 900px;
	text-align: left;
	color: #666666;
	padding: 10px;
}	   

.blok-links {
	justify-content:left; 
	width: 100%;
}

.blockhead p {
	font-size: 18px;
	line-height: 24px;
	font-family: "acumin-pro", sans-serif;
	font-weight: 200;
	display:block;
	max-width: 300px;
	min-width:220px;
	text-align: left;
	color: #666666;
	margin: 10px 30px 30px 30px;
	border: solid thin #CDCDCD;
}


.form-row p {
	text-align: center;
	color: #a59967;
}	 
	

.adres {
	line-height: 26px;
	color: #666666;
	font-family: "acumin-pro",sans-serif;
	font-size: 18px;
	font-weight: 200;
	text-align: left;
	/* padding: 0 30px; */
	/* border-left: solid 1px #ddd; */
	border-right: solid 1px #ddd;
	margin: 16px 0;
	width: 33%;
	display: block;
	padding: 0 0 0 15px;
	min-width: 200px;
}
.copyright {
	padding: 0 0 0 15px;
	color: #666666;
	font-family: "acumin-pro-condensed",sans-serif;
	margin: 16px 0;
	display: block;
	width: 60%;
}
	.copyright p {
    
    font-size: 16px;
    font-weight: 300;
    line-height: 21px;
    /* margin: 0 15px; */
    min-width: 150px;
    text-align: justify;
    /* width: 66%; */
}		
	#donker{
			background-color:#757575;
			border: 2px solid #757575;}
#donker img {
	width:60%;
}
				

.logo {
	width:25px;}

.darklayer img{
/*	width: 75%; */
	width: 100%;
  height: 100%;
  background-color: white;
 /* border-left: 2px solid rgb(200 200 200);*/
  border-right: 2px solid rgb(200 200 200);
	}
	
.center {
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
}

	#profiel {
		padding: 5px 20px;
		text-align: left;
		/*margin: 0 0 20%;*/
	}
	#profiel2 {
		padding: 5px 20px;
		text-align: left;
		}

#profiel a { 
	width: auto;
	text-align: left;
	min-width: 0px;
	display: inline;
	}
.wrapper-small-img-wrap {
/* align-content: center; */
	flex-wrap: wrap;
	flex-direction: row;
	width: 100%;
	max-width:1200px;
	/* align-items: center; */
	/* align-content: flex-start; */
	display: flex;
	justify-content: center;
	
}

.small-img-wrap {
	flex: auto;
	max-width: 450px;
	margin: 10px;
	}
/* Overlay achtergrond */
#image-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  display: none;
  z-index: 2000;

  /* 👇 belangrijk */
  overflow-y: auto;
  padding: 60px 20px;
}

#image-overlay .overlay-content {
  position: relative;
  max-width: 1280px;
  margin: auto;
}

#image-overlay img {
  width: 100%;
  height: auto;
  display: block;
}
#overlay-image {
  transform-origin: center top;
  transition: transform 0.15s ease-out;
  cursor: zoom-in;
}


/* Sluitknop */
.overlay-close {
   position: fixed;
  top: 20px;
  right: 20px;
  z-index: 10000;

  font-size: 40px;
  background: none;
  border: none;
  color: white;
  cursor: pointer;
}

.blok-kleiner.uitvergroten {
  cursor: zoom-in;
}
.banner {
	width: 100%;
	   text-align:center;
	   z-index:5;
	   flex-grow: 1;
	   flex-shrink: 1;
	   /*max-width:0px;*/
	   min-width: 250px;
	   display: flex;
	   flex-wrap: wrap;
	   justify-content: center;
	   align-items: center;
	   align-content: center;
	   transition:1s;
	   position: relative;
	   /*margin: 0px;
	   border-bottom: solid 6px #e4e4e4;*/
	   /*padding-bottom: 0px;*/
		background-color: #e4e4e4;
}
.blok.banner {
	/*width: 100vh;*/
  /*height: 20vh;
	min-height: 200px;*/
	/*max-height: 300px;*/

	/*AFvoeging voor sticker*/
	/* overflow: hidden;*/
	
	/*toevoeging voor sticker*/
	position: relative;
}

.blok.banner img {
  object-fit: cover;
	/*min-height: 200px;
	max-height: 30px;*/
	
	/*toevoeging voor sticker*/
	display: block;
	max-width: 100%;
}
/*toevoeging voor sticker*/
.blok.banner > a > img:first-child {
 	height: 100%;
	width: 100%;
	min-height: 200px;
}

.banner-sticker {
  position: absolute;
  right: 30px;
  bottom: -16px;
  width: 15%;   /* pas aan aan je SVG */
  height: auto;
  z-index: 2;
  pointer-events: none; /* voorkomt interferentie */
min-width:120px;
}

.prijs {
	width: 100%;
	   text-align:center;
	   z-index:5;
	   flex-grow: 1;
	   flex-shrink: 1;
	   /*max-width:0px;*/
	   min-width: 250px;
	   display: flex;
	   flex-wrap: wrap;
	   justify-content: center;
	   align-items: center;
	   align-content: center;
	   transition:1s;
	   position: relative;
	   /*margin: 0px;
	   border-bottom: solid 6px #e4e4e4;*/
	   /*padding-bottom: 0px;*/
		background-color: #e4e4e4;
}
.blok.prijs {
	/*width: 100vh;*/
  /*height: 20vh;
	min-height: 200px;*/
	max-height: 500px;

	/*AFvoeging voor sticker*/
	/* overflow: hidden;*/
	
	/*toevoeging voor sticker*/
	position: relative;
		padding: 0px;
}

.blok.prijs img {
  object-fit: cover;
	/*min-height: 200px;
	max-height: 30px;*/
	
	/*toevoeging voor sticker*/
	display: block;

}
/*toevoeging voor sticker*/
.blok.prijs > a > img:first-child {
 	height: 100%;
	width: 100%;
	min-height: 200px;
}
.prijs-sticker {
  position: absolute;
  right: 30px;
  bottom: 30px;
  width: 15%;   /* pas aan aan je SVG */
  height: auto;
  z-index: 2;
  pointer-events: none; /* voorkomt interferentie */
min-width:120px;
}
/* HEADER — logo above navigation at 1024px */


/* RESPONSIVE: 900px and smaller */
@media screen and (max-width: 900px) {
    #logo {
        position: absolute;
        width: 10%;
        min-width: 100px;
        max-width: 150px;
        margin: 10px 20px;
        z-index: 115;
    }

    #boven {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        justify-content: flex-start;
        width: auto;
        height: auto;
        min-height: 110px;
        margin: 15px 20px 0 160px;
        border-bottom: none;
    }

    /* The line sits behind the tabs, not beneath the icons */
    #boven::before {
        content: "";
        position: absolute;
        top: 54px;
        left: -160px;
        right: -20px;
        border-bottom: 2px solid rgb(187, 187, 187);
        pointer-events: none;
        z-index: 0;
    }

    #paginatitel {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        width: auto;
        padding: 0;
        position: relative;
        z-index: 1;
        margin-right: 26px;
    }

    #menu {
        width: 362px;
        align-self: flex-end;
        display: flex;
        justify-content: flex-end;
        margin-top: 5px;
    }

    .header-knop {
        float: none;
        justify-content: center;
        padding: 5px 10px;
        transform: scale(0.8);
        transform-origin: center center;
    }

    #gallery-space {
        padding-top: 125px;
    }
}

/* RESPONSIVE: 600px and smaller */
@media screen and (max-width: 600px) {


/* Logo: 15px from top */
#logo {
    position: absolute;
    width: 90px;
    min-width: 90px;
    max-width: 90px;
    margin: 15px 10px 0;
}

/* Both menus aligned to the right */
#boven {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;

    width: auto;
    height: auto;
    min-height: 100px;

    margin: 0 12px 0 115px;
    border-bottom: none;
}

/* Horizontal line between the rows */
#boven::before {
    top: 65px;
    left: -115px;
    right: -12px;
}

/* Upper navigation row */
#paginatitel {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: auto;
    padding: 0;
    margin: 0;
}

/* Lower icon row */
#menu {
    display: flex;
    width: auto;
    align-self: flex-end;
    justify-content: flex-end;
    margin: 5px 0 0;
}

.header-knop {
    float: none;
    justify-content: flex-end;
    padding: 5px 0;
    transform: scale(0.8);
    transform-origin: right center;
    border-left: none;
}


.header-knop li {
    margin: 0 6px;
}


    #gallery-space {
        position: relative;
        width: 100%;
        height: auto;
        padding-top: 125px;
    }

    p {
        font-size: 18px;
        font-weight: 200;
        color: #696969;
        margin: 15px;
    }

    .blockhead p {
        margin: 10px 75% 30px 30px;
    }

    .adres {
        width: 100%;
        min-width: 200px;
        font-size: 18px;
        font-weight: 200;
        color: #696969;
        border-right: none;
    }

    .wrapper-gallery {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        overflow: auto;
        width: 94%;
        flex-direction: column;
        background-color: white;
        padding-top: 20px;
        padding-left: 3%;
        padding-right: 3%;
    }

    /* Preserve existing small-screen home-icon styling */
    .header-knop-home2 a {
        display: block;
        float: left;
        position: relative;
        background-image: url(images/knoppen/home.svg);
        width: 35px;
        height: 35px;
        margin: 0;
        border-radius: 5px 5px 0 0;
        border: #fff solid 2px;
        transition-duration: 0.3s;
    }

    .header-knop-home2 a:hover {
        background-image: url(images/knoppen/homewhite.svg);
        margin: 12px 0 0 0;
        border: rgb(187, 187, 187) solid 2px;
        border-radius: 5px 5px 0 0;
        border-bottom: #fff solid 5px;
    }

    .header-knop-home2 a.active {
        background-image: url(images/knoppen/homewhite.svg);
        border-top: rgb(187, 187, 187) solid 2px;
        margin: 12px 0 0 0;
        border-radius: 5px 5px 0 0;
        border-left: rgb(187, 187, 187) solid 2px;
        border-right: rgb(187, 187, 187) solid 2px;
        border-bottom: #fff solid 5px;
    }

    .row {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .copyright {
        width: 100%;
    }

    #profiel {
        padding: 5px 20px;
        text-align: left;
        margin: 5% 0 5%;
    }

    .blockhead {
        width: 100%;
        text-align: center;
        z-index: 5;
        flex-grow: 1;
        flex-shrink: 1;
        max-width: 1280px;
        min-width: 250px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        align-content: center;
        transition: 1s;
        position: relative;
        margin: 20px 0 50px;
        border-bottom: solid 6px #ddd;
        padding-bottom: 50px;
    }

    .blockhead .blok-klein {
        margin: 5px 10px;
    }

    .blockhead-editorial .blok {
        flex-direction: column;
        margin: 25px 0;
        gap: 20px;
    }

    .blockhead-editorial .blok:nth-child(n) img:first-child,
    .blockhead-editorial .blok:nth-child(n) img:last-child {
        width: 100%;
        max-width: 100%;
        height: auto;
    }

    .hoofdtitel {
        margin: 0 0 0 15px;
    }

    h1 {
        width: 100%;
        font-size: 20px;
        line-height: 28px;
        font-family: "Spectral", serif;
        font-weight: 400;
        color: #898989;
        text-align: left;
        margin: 20px 0;
        font-style: italic;
    }

    h2 {
        font-weight: 400;
        color: #666666;
    }

    .banner-sticker {
        width: 80px;
        right: 10px;
    }

    .prijs-sticker {
        width: 80px;
        right: 10px;
        bottom: 10px;
    }
}

/* RESPONSIVE: 380px and smaller */
@media screen and (max-width: 380px) {
    #logo {
        width: 75px;
        min-width: 75px;
        max-width: 75px;
        margin: 0 5px;
    }

    #boven {
        margin-left: 92px;
        margin-right: 8px;
    }

    #boven::before {
        left: -92px;
        right: -8px;
    }

    /* Keep Illustratie and Archief visible */
    #paginatitel a,
    #paginatitel a.active,
    #paginatitel a:hover {
        font-size: 18px;
        padding-left: 6px;
        padding-right: 6px;
    }

    .header-knop {
        padding: 5px 0;
    }

    .blok-links {
        display: none;
    }
}

/* ===========================================================
   ORIGINAL FILE: grafische-vormgeving.css
   Rules preserved in original order.
   =========================================================== */

/* CSS Document */
	

	#overlay-container{
	width: 100%;
	  height: calc(100% - 70px);
	z-index:100;
	display:none;
	position: fixed;
	/* margin-top: 70px; */
	left:0;
	right:0;
	top: 70px;
	/* display: none; */
	}		


#overlay-container-nieuw{
	width:100%;
	height:100%;
	z-index:50;
	display:none;
	position: absolute;
	top:0;
	left:0;
	right:0;
	}
.wrap-caroussel {
	width:100%;
	height: 100%;
	display:flex;
	align-items: flex-start;
	justify-content:center;
	flex-direction: column;
	align-content: center;
	}			
		
	.flex {
	display:flex;
	align-items: flex-start;
	justify-content: center;
	}
#uitleg {
    display: block;
    flex-grow: 2;
    flex-shrink: 2;
    height: auto;
    width: 100%;
    color: #fff;
    margin: 10px 0 0 0;
}
.tekst1{
			    padding: 8%;
}
.tekst2{
			color:rgba(50,50,50,1);
			font-size:18px;
	font-family: "acumin-pro", sans-serif;
  	font-weight: 200;
			margin: 30px 0 30px 0;
			max-width: 800px;
			}
.wrapper-gallery .tekst2 p {
	color: #696969;	
}

#svgallery-nieuw {
    flex-shrink: 2;
    height: 100%;
    width: 100%;
    padding: 0;
    /*display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;*/
    display: block;
    /*align-items: flex-start;
    justify-content: flex-start;*/
    overflow: hidden;
    margin: 58px 0px 0px 0px;
}

#svgallery {
    flex-shrink: 2;
    height:75%;
    width: 100%;
    padding: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    overflow: hidden;
    margin: 0 -30px 0 0px;
}

#uit-knop {
	background-color: rgba(255,255,255);
    background-image: url("images/knoppen/uitknop-gray-klein.svg");
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    display: flex;
    float: left;
    height: 65px;
    min-width: 80px;
    transition: all 0.5s ease 0s;
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0;
    z-index: 105;
    border-bottom: thin #CCC solid;
}
		#uit-knop:hover {
				background-image:url("images/knoppen/uitknop-white-klein.svg");
				background-position:center;
				background-repeat: no-repeat;
			background-color: rgba(200, 200, 200, 1);
				transition-duration:0.5s;
				}
				
#uitleg-tekst{
			position:relative;
			padding:10% 0 0 0;}
			
				.tekst2 p {
			    color: #666666;
			    font-family: "acumin-pro", sans-serif;
  				font-weight: 200;
			    font-size: 18px;
			    text-align:left;
			    padding: 0 0 5px 0;
			    line-height: 24px;
	}
.tekst2 a{
			    color: #888888;
			    /*border: solid #cccccc 1px;
			    padding: -0 3px;*/
				font-weight: 600;
			    }
ul {
	text-align:right;
	list-style-type: none;
}

.tekst2 ul{
			margin: 0;
			/* font-size:14px; */
			/* line-height:16px; */
			padding: 0;
			}
.tekst2 li {
			text-align: left;
			padding: 2px 0 4px 2px;
			font-size: 18px;
			font-weight: 200;
			line-height: 16px;
			color: rgba(200,200,200,1.00);
			background-position: 0px 8px;
			background-image: url(images/knoppen/list.png);
			background-repeat: no-repeat;
			/* margin-right: 20px; */
}

.wrapper-gallery .tekst2 li {
			color:#888888;
}
	
.portfolio {
			width: 100%;
			overflow:hidden;
			/*background-repeat:none;*/
			z-index:5;
			transition:1s;
			display: flex;
			align-items: center;
			flex-direction: column;
			margin:1%;
			}
.portfolio img {
	max-width: 300px;
}

.wrapper-small-images{
	margin: 20px 0 50px;
	flex-direction:  column;
	display:  flex;
}		

.wrapper-small-images img{
	max-width: 400px;
	margin:20px;
}			
.klein {
	border-bottom: solid 2px #ddd;
	padding: 30px 0;
	width:50%;}

@media screen and (max-width : 600px ) {
	#overlay-container{
	margin-top: 25px;
	}	
#paginatitel {
	/*display: none;*/
	margin:28px 10px 0 0;
	padding:0px;
	}
#paginatitel a {
/*	display: none;*/
	}
#paginatitel a:first-child {
  display: none;
}
.shadow {
	margin: 5px 0;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 4px 2px 0 rgba(0, 0, 0, 0.19);
}
.line {
	border-bottom: solid 2px #ddd;
	padding: 5px 0;
	max-width: 800px;
	width: 100%;
}
.small {
	padding: 5px 0;
	max-width: 600px;
	width: 100%;
}
.end {
	padding: 5px 0 60px 0;
}
	
	.klein {
	border-bottom: solid 2px #ddd;
	padding: 30px 0;
	width: 100%	}
		
#svgallery {
    display: flex;
    flex-grow: 2;
    flex-shrink: 2;
    height: 70%;
    margin: 0;
    min-width:300px;
    width:100%;
}
#uit-knop {
    background-color: #FFF;
    background-image: url("images/knoppen/uitknop-gray-klein.svg");
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    display: flex;
    float: left;
    height: 65px;
    min-width: 80px;
    transition: all 0.5s ease 0s;
    width: 100%;
    position: absolute;
    top: 0px;
    left: 0;
    /* padding-bottom: 25px; */
    z-index: 105;
border-bottom: medium #4E4E4E solid;
	}

.portfolio{
			overflow:hidden;
			background-repeat:none;
			z-index:5;
			transition:1s;
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
			display: flex;
			align-items: center;
			align-content: center;
			justify-content: center;
			flex-direction: column;
			margin:1%;
			}
}

/* ===========================================================
   ORIGINAL FILE: contact.css
   Rules preserved in original order.
   =========================================================== */

/* CSS Document */


/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   https://www.alistapart.com/articles/fluid-images/ 
*/
.form {width: 60%;/* align-items: center; *//* justify-content: center; */justify-items: center;}
.form-row {
	display: block;
	width:100%;
	min-width:300px;
	text-align: center;
	justify-items: center;
}
.mailform {
	display: block;
	/*height: 100%;*/
	max-width: 750px;
	margin: 15px 50px 0;
}
.formline {
	display: block;
	}
label{
	color: #696969;
	font-family: "acumin-pro",sans-serif;
	font-size: 18px;
	font-weight: 300;
	line-height: 50px;
	margin: 20px 25px 10px 15px;
	text-align: left;
	max-width: 400px;
	}

input {
	color: #696969;
	font-family: "acumin-pro",sans-serif;
	font-size: 18px;
	font-weight: 300;
	
	width: 60%;
	min-width: 300px;
	background-color: #fff;
	margin: 10px 0 10px 0;
	border: solid #eee 1px;
	/*height: 20px;*/
	border-radius: 4px;
	line-height: 21px;
	padding: 5px;
}
.inputbox {
	color: #555555;
	width: 60%;
	min-width: 300px;
	background-color: #fff;
	margin: 10px 0 10px 0;
	border: solid #eee 1px;
	/*height: 30px;*/
	border-radius: 4px;
	font-family: "acumin-pro",sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 21px;
		padding: 5px;
}

.adresgegevens {
  display: none;
}

.adres-legend {
  font-weight: 600;
  margin-bottom: 1rem;
}


legend {
	color: #555555;
	font-family: "acumin-pro",sans-serif;
	font-size: 17px;
	font-weight: 600;
	line-height: 21px;
	margin: 20px 25px 10px 15px;
	text-align: left;
	max-width: 400px;
	padding:0;
}
.submit {
		line-height: 21px;
		margin: 15px auto;
		text-align: center;
		max-width: 100px;
		height: 50px;
		font-weight: 600;
		border: solid 2px #ddd;
		/* float: right; */
		justify-content: center;
		align-items: center;
		display: flex;
		}


textarea {
	width: 99%;
	background-color: #eee;
	margin: 10px 0 5px;
	border: solid #ccc 1px;
	height: 200px;
	border-radius: 4px;
	}
#border-top {
	border-top: solid 1px #ddd;
	padding: 12px 0;
}
.icons-row {display: block;padding-top: 5px;}
#blok-wrap .icons-row a{
	   width:35px;
	display: block;
	float: left;
	   cursor: grab;
	   min-width: 0px;
	   margin: 5px 5px;
	   }
.error {
  margin: 4px 0 10px;
  color: #c00;
  font-size: 0.85rem;
}
input.error,
select.error {
  border: 1px solid #c00;
}
#form-success {
	border: solid #757575 2px;
}

@media (orientation: portrait) {
/*.mailform {
	display: block;
	height: 100%;
	max-width: 80%;
	margin-top: 15px auto;
}*/
.form {
	width: 90%;/* align-items: center; *//* justify-content: center; */justify-items: center;}
.form-row {
	display: block;
	width:100%;
	min-width:300px;
	text-align: center;
}
	input {
	color: #555555;
	width: 96%;
	min-width: 200px;
	background-color: #fff;
	margin: 0;
	border: solid #eee 1px;
	/*height: 20px;*/
	border-radius: 4px;
	font-family: "quasimoda",sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 21px;
		padding: 5px;
}
.inputbox {
	color: #696969;
	width: 96%;
	min-width: 200px;
	background-color: #fff;
	margin: 0;
	border: solid #eee 1px;
	/*height: 30px;*/
	border-radius: 4px;
	font-family: "acumin-pro",sans-serif;
	font-size: 18px;
	font-weight: 200;
	line-height: 21px;
		padding: 5px;
}
	label{
	color: #696969;
	font-family: "acumin-pro",sans-serif;
	font-size: 18px;
	font-weight: 200;
	line-height: 50px;
	margin: 20px 25px 10px 15px;
	text-align: left;
	max-width: 400px;
	}
}

/* ===========================================================
   COMPATIBILITY: Previous PHP pages loaded grafische-vormgeving.css
   before style.css, unlike portfolio pages. In the <=600px
   breakpoint the two files set different #paginatitel margins.
   This restores the original PHP value without disturbing the
   portfolio pages. No other shared same-specificity selectors
   were found that require this adjustment.
   =========================================================== */
@media screen and (max-width: 600px) {
    body.legacy-php-css-order #paginatitel {
        margin: 0;
    }
}
