#body-media .div-showcase-container { gap: 1.5vw; align-items: stretch; }
#body-media .div-showcase { position: relative; width: calc((100% - 3vw) / 3); }
#body-media .media-images { background-image: url('../images/media/images.jpg'); }
#body-media .media-audio { background-image: url('../images/media/audio.jpg'); }
#body-media .media-video { background-image: url('../images/media/video.jpg'); }
#body-media .div-showcase > a { position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 0; background: transparent; }
#body-media .media-title { display: block; padding: clamp(.75rem, 1.5vw, 1.5rem); font-size: clamp(1.8rem, 3vw, 3rem); font-weight: 600; line-height: 1.1; text-shadow: 0 2px 6px rgba(0, 0, 0, .9), 0 0 14px rgba(0, 0, 0, .7); }
#body-media .media-new-tab { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#body-media a:focus-visible { outline: 2px solid var(--mark-color); outline-offset: 5px; }
#body-media #div-content { padding-bottom: 7rem; }
#body-media nav > div { display: flex; overflow-x: auto; white-space: nowrap; max-width: 100%; padding-block: .3rem; }
@media (max-width: 700px) {
    #body-media #div-content { padding-left: 6vw; padding-right: 6vw; }
}
@media (max-width: 450px) {
    #body-media .div-showcase-container { gap: 4vw; }
    #body-media .div-showcase { width: 100%; margin-bottom: 0; }
}
