/* ==============================
 * 5. Lazy load images
 * ============================== */
.box-thumbnail {
    width: 100%;
    position: relative;
    overflow: hidden;
    display: block;
    z-index: 0;
}

.box-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.box-thumbnail .placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 1;
}

.box-thumbnail .placeholder:has(> .show) {
    cursor: inherit !important;
    background: transparent !important;
    animation: none !important;
    opacity: 1 !important;
}

.lozad.fade {
    animation-name: fade;
    animation-duration: 2s;
}

.lozad {
    visibility: hidden;
}

.lozad.show {
    visibility: visible;
}
