/* style petertermaten - responsive:
kleuren: 
#666666 rgb(102, 102, 102) grijs - #666699 rgb(102, 102, 153) blauw - 
#808080 rgb(128, 128, 128) grijs menu - #e6e6e6 rgb(230, 230, 230) lichtgrijs menu
.item = aantal foto binnen figure
*/


* {
	box-sizing:border-box;
}

.cent-cont { /* center for large screen  */
	margin-left:auto;
	margin-right:auto;
	max-width:1200px; 
}
 
.row {
	display:flex;
	flex-wrap:wrap;
} 

.cont-center {
	display:flex;
	justify-content:center;
	align-content:center;
}


 /* For mobile phones: */
@media screen and (max-width: 600px) {
	.navbar {
		width:100%;
		padding:0.5em;
	}
	.main {
		width:100%;
		padding:0.5em;
	}
	.side {
		width:100%;
		padding:0.5em;
	}
	.main-full {
		width:100%;
		padding:0.5em;
	}
	.item-1 {
		max-width:100%;
	}
	.item-2 {
		max-width:100%;
	}
	.item-3 {
		max-width:100%;
	}
	header h1 {
		letter-spacing:0.3em;
		word-spacing:0.3em;
	}
	header h2 {
		letter-spacing:0.8em;
		word-spacing:0.8em;
	}
}

@media screen and (min-width: 601px) {
  /* For tablets: */
	.navbar {
		width:100%;
	}
	.main {
		width:60%;
		border-right:1px #e6e6e6 solid;
		padding:0.3em;
	}
	.side {
		width:40%;
		padding:0.3em;
	}
	.side figure {
		width:100%;
	}
	.main-full {
		width:100%;
		padding:0.5em;
	}
/*	.main-full figure {
		max-width:49%;
	} */
	.item-1 {
		width:49%;
	}
	.item-2 {
		width:95%;
	}
	.item-3 {
		width:95%;
	}
	.zoomTR:hover {
		transform:scale(2.5,2.5);
		transform-origin: top right;
	}
	header h1 {
		letter-spacing:0.4em;
		word-spacing:0.4em;
	}
	header h2 {
		letter-spacing:1em;
		word-spacing:1em;
	}
}

  /* For large screens: */


@media screen and (min-width: 900px) {
	.navbar {
		width:100%;
	}
	.main {
		width:70%;
		border-top:0;
		border-right:1px #e6e6e6 solid;
	}
	.side {
		width:30%;
		border-top:0;
	}
	.side figure {
		width:100%;
	}
	.main-full {
		width:100%;
	}
/*	.main-full figure {
		width:33%;
	} */
	.item-1 {
		width:33%;
	}
	.item-2 {
		width:80%;
	}
	.item-2-1 {
		width:49%;
	}
	.item-3 {
		width:90%;
	}
	.zoomTR:hover {
		transform:scale(2.5,2.5);
		transform-origin: top right;
	}
	header h1 {
		letter-spacing:0.5em;
		word-spacing:0.5em;
	}
	header h2 {
		letter-spacing:1em;
		word-spacing:1em;
	}
}


	/* for landscape on phone and tablet */
@media only screen and (orientation: landscape) {
	
}