.imagen-background{
    background-image: url(../img/contacto.jpg);
    height: 30rem;
    background-size: cover;
    background-repeat: no-repeat;
    
}

/*el formulario esta centrado dentro del contenedor, esta encimado en la imagen*/
.formulario{
    background-color: var(--blanco);
    margin: -2rem auto 0 auto;
    width: 90%;
    padding: 4rem;
}

.formulario-campo{
    display: flex; /*este se agrega para tener acceso a las propiedades de flex*/
    margin-bottom: 2rem;
}

.formulario-campo__label{
    flex: 0 0 12rem;/*se le da al ancho que ocuparan los labels. como la palabra comentarios es
                    muy larga, es por eso que se le asignan 12rem*/
    text-align: right;
    padding-right: 2rem;
}

.formulario-campo__input{
    flex: 1; /*con esto todos los campos "inputs" se van alargar o a crecer todo el espacio disponible
            Dice el profe que es una tecnica para darle un estilo chido a los inputs */
    border: 1px solid var(--gris);
}

.formulario-campo__input--textArea{
    height: 20rem;
}