body {
    display: block;
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin: 0;
    font-size: 20px;

    --border-radius: 4px;
    --input-placeholder-font-size: 15px;
}

contentHead {
    font-size: 1.8em;
    color: rgba(0,89,158,1);
}

form {
    min-width: 300px;
    max-width: 800px;
    margin: 0 20px;
    padding: 10px 20px 20px;
    text-align: center;
    align-items: center;

    background: whitesmoke;
    border-radius: var(--border-radius);
}
.form > *:first-child {
    margin-top: 0px;
}
.form > *:last-child {
    margin-bottom: 0px;
}

.form-wrap {
    
    margin-top: 20px;
    margin-bottom: 5px;
    
    text-align: center;
}
.form-input {
    height: 40px;
    width: 75%;
}
.form-login-button {
    height: 30px;
    width: 75%;
    font-size: 18px;
}


h1 {
    color: rgba(0,89,158,1);
}

input[type="text"] {
    font-size: var(--input-placeholder-font-size);
}
input[type="password"] {
    font-size: var(--input-placeholder-font-size)
}
/*input[type="text"]:valid { border: 2px solid green }
input[type="text"]:focus:invalid { border: 2px solid red }*/