.advanced-image-gallery {
  display: grid;
}

/* test */

.advanced-image-gallery.huge-masonry {
  display: flex;
  flex-wrap: wrap;
  height: 100%;
}

.advanced-image-gallery.huge-masonry {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.advanced-image-gallery.huge-masonry .huge-gallery-item img {
  width: 100%;
  height: auto;
  display: block;
  min-height: 100px;
}

.advanced-image-gallery.huge-masonry .huge-gallery-item {
  width: 100%;
  min-height: 100px;
}

/* Adjust for tablets */
@media (max-width: 1024px) {
  .advanced-image-gallery.huge-masonry .huge-gallery-item {
    width: calc(100% / 3 - 10px) !important; /* 3 columns */
  }
}

/* Adjust for mobile */
@media (max-width: 768px) {
  .advanced-image-gallery.huge-masonry .huge-gallery-item {
    width: calc(100% / 2 - 10px) !important; /* 2 columns */
  }
}

/* Adjust for small mobile screens */
@media (max-width: 480px) {
  .advanced-image-gallery.huge-masonry .huge-gallery-item {
    width: 100% !important; /* 1 column */
  }
}

/* test */

.advanced-image-gallery .huge-gallery-item img {
  width: 100%;
  display: block;
  height: auto;
}

.advanced-image-gallery .gallery-image-wrapper {
  position: relative;
  overflow: hidden;
  height: 100%;
}

.advanced-image-gallery .image-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background: rgba(0, 0, 0, 0.5); */
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
  z-index: 2;
}

.advanced-image-gallery .gallery-image-wrapper:hover .image-overlay {
  opacity: 1;
  pointer-events: auto;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.advanced-image-gallery .overlay-icon {
  z-index: 3;
  color: #ffffff;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.overlay-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.image-caption {
  text-align: center;
  font-size: 14px;
  color: #fff;
}

/* .advanced-image-gallery .fade {
  transition: opacity 0.3s ease;
}

.advanced-image-gallery .zoom-in {
  transform: scale(0);
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .zoom-in {
  transform: scale(1);
  opacity: 1;
}

.advanced-image-gallery .slide-up {
  transform: translateY(100%);
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .slide-up {
  transform: translateY(0);
  opacity: 1;
} */

/* Fade In */
.advanced-image-gallery .fade-in {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-in {
  opacity: 1;
}

/* Fade Out */
.advanced-image-gallery .fade-out {
  opacity: 1;
  transition: opacity 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-out {
  opacity: 0;
}

/* Fade In Up */
.advanced-image-gallery .fade-in-up {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-in-up {
  opacity: 1;
  transform: translateY(0);
}

/* Fade In Down */
.advanced-image-gallery .fade-in-down {
  opacity: 0;
  transform: translateY(-20px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-in-down {
  opacity: 1;
  transform: translateY(0);
}

/* Fade In Left */
.advanced-image-gallery .fade-in-left {
  opacity: 0;
  transform: translateX(20px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-in-left {
  opacity: 1;
  transform: translateX(0);
}

/* Fade In Right */
.advanced-image-gallery .fade-in-right {
  opacity: 0;
  transform: translateX(-20px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-in-right {
  opacity: 1;
  transform: translateX(0);
}

/* Fade Out Up */
.advanced-image-gallery .fade-out-up {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-out-up {
  opacity: 0;
  transform: translateY(-20px);
}

/* Fade Out Down */
.advanced-image-gallery .fade-out-down {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-out-down {
  opacity: 0;
  transform: translateY(20px);
}

/* Fade Out Left */
.advanced-image-gallery .fade-out-left {
  opacity: 1;
  transform: translateX(0);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-out-left {
  opacity: 0;
  transform: translateX(-20px);
}

/* Fade Out Right */
.advanced-image-gallery .fade-out-right {
  opacity: 1;
  transform: translateX(0);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .fade-out-right {
  opacity: 0;
  transform: translateX(20px);
}

/* Slide Up */
.advanced-image-gallery .slide-up {
  transform: translateY(100%);
  transition: transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .slide-up {
  transform: translateY(0);
}

/* Slide Down */
.advanced-image-gallery .slide-down {
  transform: translateY(-100%);
  transition: transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .slide-down {
  transform: translateY(0);
}

/* Slide Left */
.advanced-image-gallery .slide-left {
  transform: translateX(100%);
  transition: transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .slide-left {
  transform: translateX(0);
}

/* Slide Right */
.advanced-image-gallery .slide-right {
  transform: translateX(-100%);
  transition: transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .slide-right {
  transform: translateX(0);
}

/* Zoom In */
.advanced-image-gallery .zoom-in {
  transform: scale(0);
  transition: transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .zoom-in {
  transform: scale(1);
}

/* Zoom Out */
.advanced-image-gallery .zoom-out {
  transform: scale(1);
  transition: transform 0.7s ease, opacity 0.7s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .zoom-out {
  transform: scale(0);
}

/* Rotate */
.advanced-image-gallery .rotate {
  transform: rotate(0deg);
  transition: transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .rotate {
  transform: rotate(360deg);
}

/* Flip Animation */
.advanced-image-gallery .flip {
  transform-style: preserve-3d;
  transition: transform 0.6s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .flip {
  transform: perspective(600px) rotateY(180deg);
}

/* Prevent Text from Flipping */
.advanced-image-gallery .flip .image-caption,
.advanced-image-gallery .flip .overlay-icon {
  transform: rotateY(180deg) translateZ(1px);
  backface-visibility: hidden;
}

/* Scale */
.advanced-image-gallery .scale {
  transform: scale(1);
  transition: transform 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .scale {
  transform: scale(1.2);
}

/* Wipe */
.advanced-image-gallery .wipe {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.3s ease;
}

.advanced-image-gallery .gallery-image-wrapper:hover .wipe {
  clip-path: inset(0 0 0 0);
}

/* Pulse */
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}

.advanced-image-gallery .pulse {
  animation: pulse 1.5s infinite;
}