/* Slideshow container */

/*
.show {
  width: 90vw;
  height: 70vh;
  max-width: 830px;
  max-height: 551px;
  position: relative;
  margin: auto;
}
.slide {
  position: relative;
  display: none;
  width: 100%;
  height: 100%;
height: 551px;  oder feste Höhe 
  overflow: visible; 
	will-change: transform;
}
*/

.slideimg {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	will-change: transform;
}

.slideimg img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	cursor: pointer;
	position: static; /* wichtig: nicht absolut */
	transform: none;  /* kein shift notwendig */
}

.zone {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 50%;
	z-index: 2;
}
/* Next & previous buttons */
.zone.fw {
	left: 0;
	cursor: w-resize; /* Pfeil nach links */
}
.zone.rw {
	right: 0;
	cursor: e-resize; /* Pfeil nach rechts */
}

/* Caption text */
.text {
  color: #333;
  position: absolute;
	bottom: 0;
/*	top: 100%;*/
  max-width: 60%;
	line-height: 1.2em;
	padding: 0 2em;
}

.text .txt {
	display: inline-block;
}

/* Number text (1/3 etc) */
.number {
	padding-right: 1em;
}
.number a {
	font-size: 1em;
	border: 0;
/*	border: 1px solid #fff;*/
	padding: 1px 3px 0.5px;
	margin: 0 1px;
}
.number a.active,
.number a:hover  {
/*	border: 1px solid #fff;*/
	color: #333;
}

/* Fading animation (Desktop only) */
.fade {
  opacity: 1;
}
/*@media (min-width: 1024px) {*/
  .fade {
    animation-name: fade;
    animation-duration: 1.6s;
  }
/*}*/
@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

/* Tablets (z. B. iPads, ~768px) 
@media screen and (max-width: 800px) {
  .slideshow-container {
    max-width: 600px;
    max-height: 400px;
  }
  .mySlides {
    height: 400px;
  }
}
*/
/* Smartphones im Querformat (~600px) */
@media screen and (max-width: 600px) {
  .slideshow-container {
		width: 90vw;
		height: 60vh;
    max-width: 480px;
    max-height: 320px;
  }
  .mySlides {
/*    height: 320px;*/
  }
  .text {
    font-size: 0.9em;
		max-width: 100%;
  }
}

/* Smartphones im Hochformat (~480px und kleiner) */
@media screen and (max-width: 480px) {
	.slide p { 
/*		margin 0; */
	}
  .text {
/*		margin: 0 1em 1em 0;*/
/*    padding: 6px 8px;*/
		max-width: 100%;
  }
	.text .number {
/*		    font-size: 0.8em;*/
	}
}

/*Bildunterschriften */
.slide p.bu {
	position: relative;
	bottom: 0;
	z-index: 5;
}
.bu {
	position: relative;
	font-size: 1em;
	top: 0.6em;
/*	left:0.6em;	*/
}