.product-gallery-container {
  width: 50%;
  min-height: 24vw;
  position: relative;
  transform: translateX(0.75vw);
}

.image-gallery-icon.image-gallery-left-nav svg,
.image-gallery-icon.image-gallery-right-nav svg {
  width: 3vw !important;
  height: 3vw !important;
  color: var(--light-bg);
  background-color: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: all 0.25s;
  border-radius: 50%;
}

.image-gallery-icon.image-gallery-left-nav:hover svg,
.image-gallery-icon.image-gallery-right-nav:hover svg {
  color: var(--red);
}

.image-gallery-thumbnail {
  margin: 0.5vw;
  width: 6vw !important;
  cursor: pointer;
  border-radius: 1vw;
  overflow: hidden;
}

.image-gallery-thumbnail:hover {
  border: 0.15vw solid rgba(7, 112, 48, 0.5) !important;
  box-shadow: 0 0 0.3vw rgba(7, 112, 48, 0.5) !important;
}

.image-gallery-thumbnail.active {
  border: 0.15vw solid var(--green) !important;
  box-shadow: 0 0 0.3vw var(--green);
}

@media (max-width: 450px) {
  .image-gallery-thumbnail {
    margin: 0.5vw;
    width: 12vw !important;
    cursor: pointer;
    border-radius: 1.8vw;
    overflow: hidden;
  }
  .image-gallery-icon.image-gallery-left-nav svg,
  .image-gallery-icon.image-gallery-right-nav svg {
    width: 9vw !important;
    height: 9vw !important;
    color: var(--light-bg);
    background-color: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    transition: all 0.25s;
    border-radius: 50%;
  }
  .image-gallery-fullscreen-button {
    right: 4vw !important;
  }
  
}

