/*===
    328lect08-2-flex.css - built (mostly) during class on 2026-03-11
    by: Sharon Tuttle
    last modified: 2026-03-12
===*/

/*===
    give the body a small left and right margin
===*/

body
{
    margin-left: 1em;
    margin-right: 1em;
}

/*===                                                                                    
    set footer element's font size to be 0.5 em (0.5 times the                           
    size of an uppercase M in the current font...)                                       
===*/                                                                                    

footer                                                                                   
{
    font-size: 0.5em;
}

/*===
    styling form elements to have a tasteful border, width,
    margin, and padding, and then using flexbox layout
    to layout its content elements nicely
===*/

form
{
    border: thin solid black;
    width: 25em;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0.5em;

    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap: 1em;
}

/*===
    intention: that a container element with class="submit-div"
    is intended to be one including just a submit button

    style this using flexbox layout to tastefully center
    that submit button,
    and also give this container a tasteful bottom margin
===*/

.submit-div
{
    display: flex;
    justify-content: center;

    margin-bottom: 0.5em;
}