.rkit-gallery-masonry-container {
width: 100%;
display: block;
margin: 0 auto;
}
.rkit-gallery-masonry {
column-count: 3;
column-gap: 5px;
@media (min-width: 768px) {
column-count: 3;
}
@media (min-width: 992px) {
column-count: 4;
}
@media (min-width: 1199px) {
column-count: 5;
}
}
.rkit-gallery-masonry.grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 5px;
background-color: transparent;
justify-content: center;
}
.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;
}  .gallery_image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition-duration: 900ms;
transition: transform 0.8s ease;
left: 0;
} .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;
} @keyframes loading {
from {
background-position: 200% 0;
}
to {
background-position: -200% 0;
}
} .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); opacity: 0.6;
transition: opacity 0.6s ease;
}