.rkit-gallery-masonry-container {
    width: 100%;
    display: block;
    margin: 0 auto;
  }

  .rkit-gallery-masonry {
    
    column-count: 2;
    column-gap: 5px; 

    @media (min-width: 768px) {
      column-count: 3;
    }
    @media (min-width: 992px) {
      column-count: 4;
    }
    @media (min-width: 1199px) {
      column-count: 5;
    }

  }
  .brick {
    box-sizing: border-box;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
    counter-increment: brick-counter;
    overflow: hidden;
    position: relative; 
}



/* Placeholder Skeleton */
/* Gambar Lazy Load */
.gallery_image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
 transition-duration: 900ms; 
  transition: transform 0.8s ease;  
  left: 0;
}

/* Skeleton Placeholder */
.skeleton {
  display: block;
  width: 100%;
  height: 100%; 
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: loading 1.5s infinite;
  opacity: 1;
  position: relative;
}


/* Keyframe Animasi Placeholder */
@keyframes loading {
  from {
      background-position: 200% 0;
  }
  to {
      background-position: -200% 0;
  }
}


/* .gallery_image  {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
 transition-duration: 900ms; 
  transition: transform 0.8s ease;  
} */

.gallery_image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition-duration: 900ms; 
    transition: transform 0.6s ease; 
}

.zoom:hover img {
    transform: scale(1.1);
    transition-duration: 900ms; 
}



  .overlay:hover { 
    background-color: rgba(0, 0, 0, 0.5); /* semi-transparent black */
    opacity: 0.6;
    transition: opacity 0.6s ease; 
}