/* ==========================================================================
   FRONTPAGE VIEW IMAGE FEATHER
   Loaded only when BOTH the "Enable front page sections Javascript" AND
   "Card shadows" settings are on (attached in TiemposHooks::preprocessPage).
   Feathers all four edges of the frontpage view's images (3px) so they
   dissolve into the card background, matching the sections/slideshow.
   ========================================================================== */

.view-id-frontpage .image-container img {
    -webkit-mask-image:
        linear-gradient(to right, transparent 0, #000 3px, #000 calc(100% - 3px), transparent 100%),
        linear-gradient(to bottom, transparent 0, #000 3px, #000 calc(100% - 3px), transparent 100%);
    -webkit-mask-composite: source-in;
    mask-image:
        linear-gradient(to right, transparent 0, #000 3px, #000 calc(100% - 3px), transparent 100%),
        linear-gradient(to bottom, transparent 0, #000 3px, #000 calc(100% - 3px), transparent 100%);
    mask-composite: intersect;
}