/*Formular-Style*/

*:focus {
    outline: none;
}

* {
    margin: 0;
    padding: 0;
}

fieldset.form,
legend {
    border: 1px solid black;
    background-color: lightgrey;
    max-width: 500px;
}

fieldset p {
    margin: 22px;
}

.form legend{
    font-size: 18px;
    font-weight: 700;
    margin-left: 20px;
    padding: 8px 20px;
    background-color: red;
    color: white;
}


label,
legend.label {
    display:block;
    width:90%;
    margin: 3px auto;
    text-align:left;
}

input,
textarea {
    display: block;
    width:90%;
    margin: 3px auto 12px auto;
    background-color: #fff;
    border: 1px solid transparent;
    font-size: 14px;
}

input:focus,
input:hover,
textarea:focus,
textarea:hover {
    background-color: darkgrey;
    outline: none;
}

input[type="submit"],
input[type="reset"] {
    width: auto;
    margin: 24px auto;
    padding: 4px;
}

label.error,
legend.error,
p.error {
    color: red;
}



form div:nth-child(5) {
    position:absolute;
    left: -2000px;
}
@media only screen and (min-width: 750px) {
    

    fieldset {
        margin-bottom: 20px;
        padding: 0 24px;
    }

    form div:not(:last-child) {
        display:flex;
        margin-bottom: 12px;
    }

    form div:last-child {
        text-align: left;
    }

    div label {
        margin: 0;
        flex: 0 0 30%;
    }
    div input,
    div textarea {
        margin: 0;
        flex: 0 0 70%;
    }

    div input[type="submit"],
    div input[type="reset"] {
        width: auto;
        display: inline-block;
        text-align:left;
    }
    /* nach Eingabe folgt diese Meldung */
    /*
    .error,
    .submit {
        margin: 10px 15%;
    }
*/
}
