.gallery-preview-container,.gallery-preview-container2,
.gallery-btn,
.thumbnails-slider {
  position: relative;
  z-index: 1;
}



.gallery-btn {
/*   width: 64px;
  height: 64px;
  background: rgb(0, 0, 0, 0.5); */  
  border-radius: 0;
  border: none;
  padding: 0;
  cursor: pointer;
  position: absolute;
  top: 50%;
  z-index: 2;
}

	.gallery-btn, .gallery-btn img{
		width: 30px;
		height: 30px;
	}


.gallery-btn:active {
  transform: translateY(-50%) scale(0.9);
}

.prev-btn,.prev-btn2 {
	left: 10px;
	transform: translateY(-50%);
	background:url(../themes/dark/arrows_dark.png) 0 0 no-repeat;
}
.next-btn, .next-btn2 {
	right: 10px;
	transform: translateY(-50%);
	background:url(../themes/dark/arrows_dark.png) -30px 0 no-repeat;
}

.gallery-preview-container,.gallery-preview-container2{
  max-width: 100%;
  height: 49vh;
  text-align: center;
  margin-bottom: 0;
  overflow: hidden;
/* 			opacity:0; */
			-webkit-transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			transition: all 0.5s ease-in-out;
}

.gallery-preview-image, .gallery-preview-image2 {
  position: absolute;
  transform: translateX(-50%);
  max-height: 100%;
  transition: 0.3s linear;
}

.thumbnails-slider,.thumbnails-slider2 {
  position: relative;
  width: 100%;
  bottom:0px;
  background: rgb(255, 255, 255, 0.05);
  height: 20vh;
  bottom: 5vh;
}

.thumbnails-slider,.thumbnails-slider2 {
  display: flex;
  overflow-x: auto;
  scroll-behavior: smooth;
  gap: 10px;
  padding: 10px;
  align-items: center;
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
  scrollbar-color: #858585 #f0f0f0;
  --scrollbar-color-track: #f0f0f0;
  --scrollbar-color-thumb: #858585;
}

@media screen and (min-width: 1280px) {
  .thumbnails-slider,.thumbnails-slider2 {
    justify-content: center;
    align-items: center;
  }
}

.thumbnail, .thumbnail2 {
  flex: 0 0 auto;
  width: 180px;
  height: 120px;
  cursor: pointer;
  transition: transform 0.2s, border 0.2s;
  border: 2px solid transparent;
}

.thumbnail3 {
  flex: 0 0 auto;
  width: 120px;
  height: 180px;
  cursor: pointer;
  transition: transform 0.2s, border 0.2s;
  border: 2px solid transparent;
}


.thumbnail:hover,.thumbnail2:hover,.thumbnail3:hover {
  transform: scale(1.05);
}

.thumbnail.active, .thumbnail2.active, .thumbnail3.active {
  border-color: #4f2411;
}

.thumbnail img, .thumbnail2 img, .thumbnail3 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Scrollbar für Thumbnails stylen */
.thumbnails-slider::-webkit-scrollbar {
  height: 8px;
}

.thumbnails-slider::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.1);
}

.thumbnails-slider::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.3);
  border-radius: 4px;
}

.thumbnails-slider::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.5);
}
