.loader {
    margin: auto;
    border: 3px solid #f3f3f3;
    border-top: 3px solid goldenrod;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.gallery img[data-loaded="true"] {
    animation-name: showLazyImg;
    animation-duration: 0.5s;
    animation-fill-mode: both;
}
@keyframes showLazyImg {
    0% { transform: scale(0); }
    100% { transform: scale(1) }
}



section.gallery {
    width: 100%;
}

div.gallery-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;

}

div.gallery-content > figure {
    display: block !important;
    margin: 0 !important;

    /*max-width: 20% !important;
    min-width: 4% !important;*/
    width: unset !important;

    height: 20vw !important;
    min-height: 100px !important;
}

figure.image > img {
    aspect-ratio: unset !important;
    height: 100% !important;
    width: unset !important;
    /*max-width: 20% !important;
    min-width: unset !important;
    margin: 0 !important;*/
}