/* gplanr: tablets. Every @media rule for tablets lives here (phones: main_gsm.css, loaded after this file, so it can
   refine what is set here). Tablet = up to 900px wide: too narrow for the sign-up form to sit on top of the picture. */

/* Tablets and smaller */
@media (max-width: 900px) {
    /* Room under the content for the fixed footer. */
    .divbody { padding-bottom: 4.5rem; }
    .page-landing .divbody { padding-bottom: 4.5rem; }

    /* Landing page: put the real form under the picture instead of on top of it. */
    .status { position: static; margin: .8rem 1rem .4rem; }
    .privacy, .privacy2 { position: static; margin: 0 1rem .6rem; }
    .privacy { margin-bottom: 1.5rem; }
    .signup { position: static; width: auto; height: auto; margin: 1rem 1rem 0; flex-wrap: wrap; gap: .6rem; }
    .signup input[type=email], .signup button { height: 3rem; font-size: 1rem; border-radius: 6px; box-shadow: none; }
    .signup input[type=email] { flex: 1 1 14rem; padding: 0 1rem; }
    .signup button { flex: 1 1 8rem; }
}

/* Tablet range only: a little more room for the cards and the headings. */
@media (min-width: 641px) and (max-width: 900px) {
    .card { width: min(460px, 100%); padding: 2rem; }
    .page-title { font-size: 2rem; }
    .brand { width: min(460px, 70vw); }
    .org-image { max-width: min(460px, 70vw); }
}
