.flex-images { overflow: hidden; position: relative; }
.flex-images .item { float: left; margin: 5px; background: #eee; box-sizing: content-box; overflow: hidden; position: relative;  }
.flex-images .item img { display: block; width: auto; height: 100%; max-width: none; }
.flex-images .item .caption { position: absolute; bottom: 0; left: 0; right: 0; padding: 4px 6px; font-size: 13px; color: #fff; background: #222; background: rgba(0,0,0,.7); }
.flex-images .item .caption { 
	-webkit-transform: scaleY(0);
	-o-transform: scaleY(0);
	-ms-transform: scaleY(0);
	transform: scaleY(0);
	-webkit-transform-origin: bottom;
	-o-transform-origin: bottom;
	-ms-transform-origin: bottom;
	transform-origin: bottom;
	-webkit-transition: -webkit-transform 0.26s ease-out;
	-o-transition: -o-transform 0.26s ease;
	-ms-transition: -ms-transform 0.26s ease;
	transition: transform 0.26s ease;
}
.flex-images .item:hover .caption { 
	-webkit-transform: scaleY(1);
	-o-transform: scaleY(1);
	-ms-transform: scaleY(1);
	transform: scaleY(1);
}

/* fix to get the caption on the image on landscape mobile screens */
@media (max-width:991px) and (orientation:landscape) {
	#lightcase-info {
		position: absolute;
		background: none;
		width: 100%;
		bottom: 0;
		padding: 0px !important;
		z-index: 1;
	}

	#lightcase-info #lightcase-caption {
		color: #fff !important;
		font-size: 20px !important;
		background: #0009;
		padding: 0 10px !important;
	}
}

a[class*='lightcase-icon-'] {
	opacity: 1 !important;
	font-size: 48px !important;
	z-index: 2147483647 !important;
}
#lightcase-overlay,
#lightcase-case {
	z-index: 2147483647 !important;
}
/* Sluit-kruisje en pijltjes: altijd zichtbaar, groter, en boven de foto */
a[class*='lightcase-icon-'] {
	opacity: 1 !important;
	font-size: 48px !important;
	z-index: 2147483647 !important;
}
a[class*='lightcase-icon-']:before {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 1.6em;
	height: 1.6em;
	line-height: 1.6em !important;
	box-sizing: border-box;
	background: rgba(0,0,0,.55);
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0,0,0,.4);
}
a[class*='lightcase-icon-']:hover:before {
	background: rgba(0,0,0,.85);
}
@media screen and (max-width: 640px) {
	a[class*='lightcase-icon-'] {
		font-size: 38px !important;
		padding-bottom:5px;
	}
}