form:not(.noform) {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

form:not(.noform) > * {
    width: 50%;
    font-size: 1.25em;
}

form label {
    text-transform: capitalize;
}

form label input,
form label select {
    width: 100%;
}

@media only screen and (max-width: 480px) {
    form:not(.noform) > * {
        width: 100%;
    }
}

@media only screen and (min-width: 481px) and (max-width: 800px) {
    form:not(.noform) > * {
        width: 75%;
    }
}

input ~ .validationMessage {
    display: none;
}
input:invalid ~ .validationMessage {
    display: block;
}