/*
 * The Django templates had no <!DOCTYPE>, so browsers rendered them in quirks mode.
 * Next.js always renders in standards mode; these rules reproduce the quirks-mode results.
 */

/* Quirks mode resolves percentage heights against the viewport. */
.main {
    min-height: 70vh;
}

/* Quirks mode matches ids case-insensitively; style.css writes #mobilehomeImg for #mobileHomeImg. */
@media only screen and (min-width: 768px) {
    #mobileHomeImg {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    #mobileHomeImg img {
        margin-top: 50vh;
    }
}

/*
 * Quirks mode gives a line that holds only images no extra text line height (no gap under
 * the image). line-height: 0 on the containers that only hold images does the same.
 */
#logo,
#logo-text,
#footerLogo,
.footerImg,
#homeImg,
#mobileHomeImg,
#faqImg,
#postMainImg,
.detailPhoto,
#archiveImg,
.gallery > a,
.seasonstitle + div {
    line-height: 0;
}

/*
 * Links keep focus after a client-side navigation (the old site reloaded the whole page), so
 * Bootstrap 3's a:focus outline would stay on the clicked link. Keep it for keyboard focus only.
 */
a:focus:not(:focus-visible) {
    outline: none;
}