body>header {
    /* Display, Position, Margin and Padding */
    padding: 72px 72px 144px 72px !important;

    /* Background and border */
    background: url("../../images/hero-background.jpg") center / cover no-repeat;

    /* Font */
    text-shadow: -2px 2px 4px rgb(0, 0, 0, 0.4);

    #menu-button {
        filter: brightness(10) !important;
    }

    * {
        color: var(--SecondaryTextColor);
    }

    @media (prefers-color-scheme: dark) {
        * {
            color: var(--MainTextColor) !important;
        }
    }

    div.title {
        /* Display, Position, Margin and Padding */
        display: flex;
        flex-direction: column;
        gap: 16px;

        h1 {
            /* Font */
            font-size: var(--Title);
            line-height: 1.3;
        }
    }

    li.soumission,
    li.facebook {
        /* Background and border */
        border: 4px solid var(--SecondaryTextColor) !important;

        @media (prefers-color-scheme: dark) {
            border: 4px solid var(--MainTextColor) !important;
        }
    }

    @media (max-width: 900px) {
        /* Display, Position, Margin and Padding */
        padding: 144px 32px 32px 32px !important;
        gap: 144px;
    }
}