/* Wrappers */
.wrapper-gallery {
	width: 97vw; 
	margin: 5px auto;
}

.thumbs {
	background-image: linear-gradient(black, grey);
}

.galerij {
	max-width: 1700px;
	margin: 6rem auto .5rem auto;
	display: grid;
	/*grid-column: span 1;*/
	padding: .1rem .5rem .1rem .5rem;
}

.galerij-margin {
	padding-left: .5rem;
	padding-right: .5rem;
	/*background-color: rgba(255, 255, 255, 0.7);*/
}
	

.galerij p {
	text-align: center;
	font-family: cinder, sans-serif;
	font-size: 1rem;
	font-weight: 300;
	line-height: 1.5rem;
	color: #cd1719;
}

.grid-container {
	margin-top: .1rem;
	display: grid;
	/*grid-template-columns: 
		repeat(auto-fit, minmax(18rem, 1fr));*/
	grid-auto-flow: row;
	grid-gap: .5rem;
	/*padding: .5rem;*/
	/*grid-template-rows: repeat(38, 80px);*/
}

.grid-container div {
	background-color: rgba(255, 255, 255, 1.0);
	background-repeat: no-repeat;
	background-position: top;
	background-size: cover;
	grid-auto-flow: column;
	cursor: pointer;
	border: .1rem solid #fbeba3;
	display: flex;
}

.grid-container div:hover {
	transform: scale(1.1);
	transition: transform ease-out 500ms;
}

.img1 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/1.jpg");
	max-width: 100%;
}

.img2 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/2.jpg");
	max-width: 100%;
}

.img3 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/3.jpg");
	max-width: 100%;
}

.img4 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/4.jpg");
	max-width: 100%;
}

.img5 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/5.jpg");
	max-width: 100%;
}

.img6 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/6.jpg");
}

.img7 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/7.jpg");
}

.img8 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/8.jpg");
}

.img9 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/9.jpg");
}

.img10 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/10.jpg");
}

.img11 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/11.jpg");
	max-width: 100%;
}

.img12 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/12.jpg");
	max-width: 100%;
}

.img13 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/13.jpg");
	max-width: 100%;
}

.img14 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/14.jpg");
	max-width: 100%;
}

.img15 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/15.jpg");
	max-width: 100%;
}

.img16 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/16.jpg");
}

.img17 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/17.jpg");
}

.img18 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/18.jpg");
}

.img19 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/19.jpg");
}

.img20 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/20.jpg");
}

.img21 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/21.jpg");
	max-width: 100%;
}

.img22 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/22.jpg");
	max-width: 100%;
}

.img23 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/23.jpg");
	max-width: 100%;
}

.img24 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/24.jpg");
	max-width: 100%;
}

.img25 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/25.jpg");
	max-width: 100%;
}

.img26 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/26.jpg");
}

.img27 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/27.jpg");
}

.img28 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/28.jpg");
}

.img29 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/29.jpg");
}

.img30 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/30.jpg");
}

.img31 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/31.jpg");
	max-width: 100%;
}

.img32 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/32.jpg");
	max-width: 100%;
}

.img33 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/33.jpg");
	max-width: 100%;
}

.img34 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/34.jpg");
	max-width: 100%;
}

.img35 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/35.jpg");
	max-width: 100%;
}

.img36 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/36.jpg");
}

.img37 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/37.jpg");
}

.img38 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/38.jpg");
}

.img39 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/39.jpg");
}

.img40 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/40.jpg");
}

.img41 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/41.jpg");
	max-width: 100%;
}

.img42 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/42.jpg");
	max-width: 100%;
}

.img43 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/43.jpg");
	max-width: 100%;
}

.img44 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/44.jpg");
	max-width: 100%;
}

.img45 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/45.jpg");
	max-width: 100%;
}

.img46 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/46.jpg");
}

.img47 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/47.jpg");
}

.img48 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/48.jpg");
}

.img49 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/49.jpg");
}

.img50 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/50.jpg");
}

.img51 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/51.jpg");
	max-width: 100%;
}

.img52 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/52.jpg");
	max-width: 100%;
}

.img53 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/53.jpg");
	max-width: 100%;
}

.img54 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/54.jpg");
	max-width: 100%;
}

.img55 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/55.jpg");
	max-width: 100%;
}

.img56 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/56.jpg");
}

.img57 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/57.jpg");
}

.img58 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/58.jpg");
}

.img59 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/59.jpg");
}

.img60 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/60.jpg");
}

.img61 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/61.jpg");
	max-width: 100%;
}

.img62 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/62.jpg");
	max-width: 100%;
}

.img63 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/63.jpg");
	max-width: 100%;
}

.img64 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/64.jpg");
	max-width: 100%;
}

.img65 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/65.jpg");
	max-width: 100%;
}

.img66 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/66.jpg");
}

.img67 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/67.jpg");
}

.img68 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/68.jpg");
}

.img69 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/69.jpg");
}

.img70 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/70.jpg");
}

.img71 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/71.jpg");
	max-width: 100%;
}

.img72 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/72.jpg");
	max-width: 100%;
}

.img73 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/73.jpg");
	max-width: 100%;
}

.img74 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/74.jpg");
	max-width: 100%;
}

.img75 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/75.jpg");
	max-width: 100%;
}

.img76 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/76.jpg");
}

.img77 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/77.jpg");
}

.img78 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/78.jpg");
}

.img79 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/79.jpg");
}

.img80 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/80.jpg");
}

.img81 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/81.jpg");
	max-width: 100%;
}

.img82 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/82.jpg");
	max-width: 100%;
}

.img83 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/83.jpg");
	max-width: 100%;
}

.img84 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/84.jpg");
	max-width: 100%;
}

.img85 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/85.jpg");
	max-width: 100%;
}

.img86 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/86.jpg");
}

.img87 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/87.jpg");
}

.img88 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/88.jpg");
}

.img89 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/89.jpg");
}

.img90 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/90.jpg");
}

.img91 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/91.jpg");
	max-width: 100%;
}

.img92 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/92.jpg");
	max-width: 100%;
}

.img93 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/93.jpg");
	max-width: 100%;
}

.img94 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/94.jpg");
	max-width: 100%;
}

.img95 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/95.jpg");
	max-width: 100%;
}

.img96 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/96.jpg");
}

.img97 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/97.jpg");
}

.img98 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/98.jpg");
}

.img99 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/99.jpg");
}

.img100 {
	aspect-ratio: 3/2;
	background-image: url("img/thumbs/100.jpg");
}

/* Popup window when clicked */
.img-window {
	width: 100vw;
	height: 100vh;
	background-image: url("../../opmaak/achtergrond/dark_wood.png");
	/*background-color: rgba(0, 0, 0, 0.9);*/
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 100;
}

.img-window img{
	max-height: 97vh;
	max-width: 90vw;
	cursor: pointer;
	border: .2rem;
	border-style: solid;
	border-color: #fbeba3;
}

/* Next image */
.img-btn-prev {
	display: block;
	left: 40px;
	position: fixed;
	top: 48vh;
	z-index: 500;
	font-family: Arial, Helvetica, sans-serif;
	color: #fff;
	cursor: pointer;
	text-transform: uppercase;
	
}

.img-btn-prev img {
	max-width: 10vw;
	opacity: 0.7;
	transition: opacity 500ms;
}

.img-btn-prev img:hover{
	opacity: 1;
}

.img-btn-next {
	display: block;
	right: 40px;
	position: fixed;
	top: 48vh;
	z-index: 500;
	font-family: Arial, Helvetica, sans-serif;
	color: #fff;
	cursor: pointer;
	text-transform: uppercase;
	
}

.img-btn-next img {
	max-width: 10vw;
	opacity: 0.7;
    transition: opacity 500ms;
}

.img-btn-next img:hover{
	opacity: 1;
}

@media only screen and (min-width: 768px){
.grid-container {
	grid-template-columns: 
		repeat(auto-fit, minmax(18rem, 1fr));
}
}

@media only screen and (min-width: 950px){
.grid-container {
	/*margin-top: 10px;*/
	/*grid-template-columns: repeat(8, 1fr);
	grid-template-rows: repeat(29, 150px);*/
}
	.wrapper-gallery p {
	font-size: 22px;
	font-weight: 600;
	line-height: 30px;
}
}

@media only screen and (min-width: 1270px){
.grid-container {
	/*grid-template-columns: repeat(8, 1fr);
	grid-template-rows: repeat(29, 220px);*/
	grid-template-columns: 
		repeat(auto-fit, minmax(16.5rem, 1fr));
	grid-auto-flow: row;
	grid-gap: 1rem;
	/*padding: 5px;*/
}
}

@media only screen and (min-width: 1540px){
.grid-container {
	/*grid-template-columns: repeat(10, 1fr);
	grid-template-rows: repeat(23, 220px);*/
}
}

/*@media only screen and (min-width: 1890px){
.grid-container {
	grid-template-columns: repeat(12, 1fr);
	grid-template-rows: repeat(19, 220px);
}
}*/