#thumbnail-slider {
  display: flex;
  gap: 10px;
}
@media screen and (max-width: 1280px) {
  #thumbnail-slider {
    gap: 5px;
  }
}
@media screen and (max-width: 768px) {
  #thumbnail-slider {
    flex-direction: column;
  }
}
#thumbnail-slider .swiper-container-thumbnails {
  overflow: hidden;
}

#thumbnail-slider .gallery-top {
  position: relative;
  width: 100%;
  flex: 1;
  margin: 0;
  order: 1;
}

@media screen and (max-width: 1280px) {
  #thumbnail-slider .gallery-top {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  #thumbnail-slider .gallery-top {
    width: 100%;
    margin: 0 auto;
  }
}


#thumbnail-slider .gallery-top .swiper-slide {
  text-align: center;
  background-size: cover;
  background-position: center;
  background-color: #fff;
  /* Center slide text vertically */
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
 
}


@media screen and (max-width: 768px) {
  #thumbnail-slider .gallery-top  .swiper-slide {
    width: 100%;
  }
}
#thumbnail-slider .gallery-top  .swiper-slide > img {
  width: 100%;
  object-fit: cover;
}


#thumbnail-slider .gallery-thumbs {
  width: 99px;
  padding: 0;
}

@media screen and (max-width: 1280px) {
  #thumbnail-slider .gallery-thumbs {
      width: 50px;
    }
  
}
@media screen and (max-width: 768px) {
  #thumbnail-slider .gallery-thumbs {
    order: 2;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
  }
}
#thumbnail-slider .gallery-thumbs .swiper-wrapper {
  flex-direction: column;

}

#thumbnail-slider .gallery-thumbs .swiper-slide {
  flex-flow: column nowrap;
  width: 99px;
  height: 99px;
  opacity: 0.75;
  cursor: pointer;
  background-size: cover;
}
@media screen and (max-width: 1280px) {
  
  #thumbnail-slider .gallery-thumbs .swiper-slide {
      width: 50px;
      height: 50px;
    }
}

@media screen and (max-width: 768px) {
  
  #thumbnail-slider .gallery-thumbs .swiper-slide {
      width: 99px;
      height: 99px;
    }
}

@media screen and (max-width: 568px) {
  
  #thumbnail-slider .gallery-thumbs .swiper-slide {
      width: 60px;
      height: 60px;
    }
}
#thumbnail-slider .gallery-thumbs .swiper-slide-thumb-active {
  opacity: 1;
}
@media screen and (max-width: 768px) {
  #thumbnail-slider .gallery-thumbs .swiper-wrapper {
    flex-direction: row;
    justify-content: center;
    display: flex;
  }
}