body {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1;
}

h2 {
    border: none;
    font-weight: 500;
    font-size: 32px;
}

.pure-button {
    border-radius: 4px;
}

.pure-button-red {
    background-color: #5876de;
}

.mt-16 {
    margin-top: 16px;
}
#foot {
    background: none;
    color: #1c1c1c;
    text-align: center;
}

/* Stock #header is a fixed-height 6rem strip sized for the SSP wordmark;
   it doesn't grow to fit our full-width logo banner, so subsequent content
   overlaps the bottom of the image unless we let it size to content. */
#header {
    height: auto;
    background: none;
    padding: 0;
}

.kinin-header-logo {
    display: block;
    /* Match .wrap's sizing (stylesheet.css) exactly, so the banner is never
       wider than the content column below it. */
    width: 80%;
    max-width: 300px;
    height: auto;
    margin: 0 auto 24px;
    margin-top: 24px;
}

/* core:loginuserpass (body id "core:loginuserpass"): hide the stock heading
   and boilerplate copy via CSS instead of overriding the template, so we
   don't have to track upstream changes to that file. Scoped to #content so
   this can't ever hit the org-name <h1> in _header.twig. */
body#core\:loginuserpass #content h1,
body#core\:loginuserpass #content p:first-of-type,
body#core\:loginuserpass .pure-form-message {
    display: none;
}