.row > .columnb {
  padding: 0 8px;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Spaltem */
.columnb { 
}

.abstandhalter {margin: 0 0 15px 0;}

/* The Modal (background) */
.modalb {
  display: none;
  position: fixed;
  z-index: 10001;
  /*  padding: 100px 50px 20px 50px;  -->media-query */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
}

/* Modal Content */
.modal-contentb {
  position: relative;
  background-color:black;
  margin: auto;
  padding: 0;
  width: 100%;
  max-width: 1000px;
  display: flex; 
    justify-content: center; 
    align-items: center;
}

/* The Close Button */
.closeb {
  color: white;
  position: absolute;  z-index: 10002;
  top: 25px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.closeb:hover,
.closeb:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

/* Hide the slides by default */
.mySlidesb { 
  display: none;
}
.mySlidesb0 { 
  display: none;
}
.mySlidesb1 {  
  display: none;
}
.mySlidesb2 { 
  display: none;
}
.mySlidesb3 {  
  display: none;
}
.mySlidesb4 { 
  display: none;
}
.mySlidesb5 { 
  display: none;
}

.lightbox-quer,
.lightbox-hoch { 
  display:block; 
  width:100%; 
  overflow:hidden;
}

.lightbox-quer,
.lightbox-hoch img { 
  overflow:hidden;
}


/* Next & previous buttons */
.prevb,
.nextb {
  cursor: pointer; 
  position: absolute;  z-index: 10002;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 34px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}
.prevb { left:0; }
/* Position the "next button" to the right */
.nextb {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prevb:hover,
.nextb:hover { text-decoration:none;
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext { display:block;
  color: white;
  font-size: 18px;
  padding: 1px 12px;
  position: fixed;  z-index: 10002;
  top: 33px; left: 8px; width:80%;
}

/* Caption text */
.caption-containerb { display:block;
  clear:both;
  text-align: left;
  background-color: red;
  padding: 2px 16px;
  color: white;
}


.miniaturleiste {
  width:100%;  border-top:2px solid black; 
  padding:10px;
  display: flex; margin-top: 25px;
  align-items: center;
  justify-content: center; overflow:hidden;
}
.columnc { border:0px solid white;
  float: left;
  /* width: 10%; */
  margin-left: auto;
  margin-right: auto;
}
.demob {   
  /* width:90px; height:45px; */
  border:1px solid black;
  overflow:hidden;
}
img.demob {
  opacity: 0.6; 
}
.active,
.demob:hover {
  opacity: 1;
}
img.hover-shadow {
  transition: 0.3s;
}
.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
img.hover-opacity {
  transition: 0.3s;
}
.hover-shadow:opacity {
    opacity: 0;
}
.aaa { display:none; }

@media (max-width:767px) { 
.modalb { padding: 105px 30px 20px 30px; }
.lightbox-quer   { 
  width:500px; 
  height:300px; 
  }
.lightbox-hoch   { 
  width:320px; 
  height:400px;
  }
  
.lightbox-quer img  { 
  width:500px; 
  height:300px; 
  }
.lightbox-hoch img {  
  height:400px; 
  }
}

@media (min-width:768px) { 
.modalb { padding: 105px 40px 20px 40px; }
.prevb,
.nextb {
  font-size: 40px;
}
.lightbox-quer   { 
  width:600px; 
  height:400px; 
  }
.lightbox-hoch   { 
  width:350px; 
  height:500px;
  }
  
.lightbox-quer img {  
  width:600px; 
  height:400px; 
  }
.lightbox-hoch img { 
  height:500px; 
  }
}

@media (min-width:992px) { 
.modalb { padding: 105px 90px 20px 90px; }
.prevb,
.nextb {
  font-size: 48px;
}
.lightbox-quer   { 
  width:700px; 
  height:500px; 
  }
.lightbox-hoch   { 
  width:460px;
  height:600px; 
 }
 
.lightbox-quer img {  
  width:700px; 
  height:500px; 
  }
.lightbox-hoch img {  
  height:600px; 
  }
}

@media (min-width:1200px) { 
.modalb { padding: 105px 150px 20px 150px; }
.prevb,
.nextb {
  font-size: 52px;
}
.lightbox-quer { 
  width:800px;
  height:600px; 
  }
.lightbox-hoch  { 
  width:580px;
  height:700px; 
  }
  
.lightbox-quer img {  
  width:800px;
  height:600px; 
  }
.lightbox-hoch img {  
  height:700px; 
  }
}