/* ************************************************ */
/* ******** SIMKI Standard Bildergallerie ********* */
/* ************************************************ */
/* Image lightbox: thumbnails anlegen mit H = 118, slides mit H = 1080 */
div.imagelightbox_gallery {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.imagelightbox_gallery a img {
height: 118px;
border: 1px solid #C2C2C2;
}
.imagelightbox_gallery a img:hover {
border-color: #F07D19;
}

</* button type="button" class="imagelightbox-arrow imagelightbox-arrow-left" style="display: block;"></button> */
.imagelightbox-arrow-left {
background: green !important;

}
button[type=button] .imagelightbox-arrow .imagelightbox-arrow-left {
display: none !important;
}



/* ************************************************ */
/* ******************* original ******************* */
/* ************************************************ */
#imagelightbox {
cursor: pointer;
position: fixed;
z-index: 10000;
-ms-touch-action: none;
touch-action: none;
/* -webkit-box-shadow: 0 0 3.125em rgba(0, 0, 0, .75); /* 50 */
/* box-shadow: 0 0 3.125em rgba(0, 0, 0, .75); /* 50 */
}

/* ACTIVITY INDICATION */
#imagelightbox-loading, #imagelightbox-loading div {
display: none; /* bmx */
border-radius: 50%;
}

#imagelightbox-loading {
width: 2.5em; /* 40 */
height: 2.5em; /* 40 */
background-color: #444;
background-color: rgba(0, 0, 0, .5);
position: fixed;
z-index: 10003;
top: 50%;
left: 50%;
padding: 0.625em; /* 10 */
margin: -1.25em 0 0 -1.25em; /* 20 */
-webkit-box-shadow: 0 0 2.5em rgba(0, 0, 0, .75); /* 40 */
box-shadow: 0 0 2.5em rgba(0, 0, 0, .75); /* 40 */
}

#imagelightbox-loading div {
width: 1.25em; /* 20 */
height: 1.25em; /* 20 */
background-color: #fff;
-webkit-animation: imagelightbox-loading .5s ease infinite;
animation: imagelightbox-loading .5s ease infinite;
}
@-webkit-keyframes imagelightbox-loading {
	from { opacity: .5;	-webkit-transform: scale( .75 ); }
	50%  { opacity: 1;	-webkit-transform: scale( 1 ); }
	to   { opacity: .5;	-webkit-transform: scale( .75 ); }
}
@keyframes imagelightbox-loading {
	from { opacity: .5;	transform: scale( .75 ); }
	50%  { opacity: 1;	transform: scale( 1 ); }
	to   { opacity: .5;	transform: scale( .75 ); }
}

/* OVERLAY */
#imagelightbox-overlay {
background-color: rgba(0, 0, 0, .8);
position: fixed;
z-index: 9998;
top: 0;
right: 0;
bottom: 0;
left: 0;
}

/* "CLOSE" BUTTON */
#imagelightbox-close {
position: fixed;
top: 2.5em;
right: 2.5em;
z-index: 10002;
width: 26px;
height: 26px;
border: none;
background-color: transparent;
background-image: url(../images/pic_GalClose.svg);
background-size: contain;
transition: background-image .3s;
}
#imagelightbox-close:hover, #imagelightbox-close:focus {
background-image: url(../images/pic_GalClose_ov.svg);
}

/* CAPTION */
#imagelightbox-caption {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 10001;
padding: 0 10px 20px 10px;
font-family: 'latoregular';
font-size: 16px;
text-align: center;
color: #FFFFFF;
}

/* ARROWS */
.imagelightbox-arrow {
position: fixed;
top: 50%;
z-index: 10001;
width: 24px;
height: 30px;
margin-top: -15px;
border: none;
background-color: transparent;
background-size: contain;
transition: background-image .3s;
}

.imagelightbox-arrow-left {
left: 2.5em;
background-image: url(../images/pic_GalPrv.svg);
}
.imagelightbox-arrow-left:hover, .imagelightbox-arrow-left:active {
background-image: url(../images/pic_GalPrv_ov.svg);
background-color: transparent; /* bmx */
}

.imagelightbox-arrow-right {
right: 2.5em;
background-image: url(../images/pic_GalNxt.svg);
}
.imagelightbox-arrow-right:hover, .imagelightbox-arrow-right:active {
background-image: url(../images/pic_GalNxt_ov.svg);
background-color: transparent; /* bmx */
}

#imagelightbox-loading, #imagelightbox-overlay, #imagelightbox-close, #imagelightbox-caption, #imagelightbox-nav, .imagelightbox-arrow {
-webkit-animation: fade-in .25s linear;
animation: fade-in .25s linear;
}

@-webkit-keyframes fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@keyframes fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@media only screen and (max-width: 41.250em) { /* 660 */
	#container { width: 100%; }
	#imagelightbox-close { top: 1.25em; right: 1.25em; width: 20px; height: 20px; }
	#imagelightbox-nav { bottom: 1.25em; } /* 20 */
	.imagelightbox-arrow { width: 20px; height: 20px; margin-top: -10px; }
	.imagelightbox-arrow-left { left: 1.25em; }
	.imagelightbox-arrow-right { right: 1.25em; }
}

@media only screen and (max-width: 20em) { /* 320 */
	.imagelightbox-arrow-left  { left: 0; }
	.imagelightbox-arrow-right { right: 0; }
}