form button, form input, form textarea {
    background: var(--base);
    color: var(--contraste);
    border: none; 
    border-bottom: 1px solid var(--contraste);
    font-weight: bold;
    padding: 8px 0;
}

form textarea {
    border: 1px solid var(--contraste);
    padding: 8px;
}

form label{
    display: block;
    margin: 1em 0 .5em 0;
}

form input[type=submit]{
    background: var(--base);
    color: var(--contraste);
    border: 0;
    text-transform: uppercase;
    margin-top: 1em;
}

form input[type=submit]:hover, form input[type=submit]:focus{
    background: var(--contraste);
    color: var(--base);
    outline: 0;
}


/* CONTACT FORM */

.contactInfoBox{
    background: var(--base);
    color: var(--contraste);
    padding: 1em 1em 0 1em;
}
.contactInfoBox ul{
    margin: 1em;
    list-style: none;
}


.contactFormBox{
    background: var(--base);
    color: var(--contraste);
    padding: 1em;
}

.contactFormBox form{
    padding: 0;
}

.contactFormBox form .full{
    grid-column: 1 / 3;
}

.contactFormBox form button, .contactFormBox form input, .contactFormBox form textarea {
    width: 100%;
}

/* LOGIN FORM */

#loginForm input[type=submit]{
    background: var(--color);
    color: var(--contraste);
    border: 0;
    text-transform: uppercase;
    padding: 6px 12px;
    margin-top: 24px;
}

#loginForm input[type=submit]:hover, form input[type=submit]:focus{
    background: var(--contraste);
    color: var(--base);
    outline: 0;
}

@media only screen and (min-width : 600px){

    .contactFormBox form{
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 1em;
    }

    form input[type=submit]{
        margin: 0;
    }

    form p, form label{
        margin: 0 0 .5em 0;
    }
}

@media only screen and (min-width: 1135px) {

    .contactFormBox form{
        grid-gap: 1em 2em;
    }

    .contactInfoBox{
        padding: 2em 2em 0 2em;
    }

    .contactFormBox{
         padding: 2em;
    }
}