@media only screen and (min-width: 48em) {

    #mobile {display: none;}
    #medium {display: inline-flex;}

    header {
        padding-bottom: 1.5rem;
    }

    header , #form {
        padding-left: 2.25rem;
        padding-right: 2.25rem;
    }

    #title {font-size: 2.5em;}
    #subtitle {font-size: 1.25em;}

    form {
        align-self: center;
        width: 31.25rem;
    }

    footer {
        flex-direction: row;
        justify-content: space-between;
    }
}

@media only screen and (min-width: 64em) {

    #medium {padding: 2% 4%;}
    
    #mb-row {flex-direction: row;}

    header {justify-content: center;}

    #form {top: 6rem;}

    form {height: 21.875rem;}

    footer {padding: 2.5rem 3.375rem;}

}