.img-inicio img{
    width: 100%;
}

.nuestros-procesos{
    width: 100%;
    position: relative;
    padding-bottom: 20px;
}

.titulo-nuestros-procesos{
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--naranja--);
    height: 60px;
}

.titulo-nuestros-procesos p {
    font-family: Quicksand;
    font-weight: bold;
    font-size: 40px;
    color: var(--blanco--);
}

.imagenes-nuestros-procesos{
    width: 100%;
    display: flex;
    justify-content: center;
    
}

.imagenes-nuestros-procesos img {
    width: 20%;
    margin: 20px;
    object-fit: cover;
}

/*------------------*/

.caja-fondo{
    position: absolute;
    width: 80%;
    height: 360px;
    background: var(--azul--);
    top: 10%;
    left: 10%;
    z-index: -1;
}

/*--------------------Formulario contacto----------------------------*/

.form-contacto{
    width: 100%;
    background: var(--naranja--);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.form-contacto p {
    font-family: Hind Madurai;
    font-size: 36px;
    color: var(--blanco--);
    text-align: center;
    margin-bottom: 25px;
    margin-top: 20px;
}

form{
    font-family: Hind Madurai;
    width: 700px;
    display: flex;
    flex-direction: column;
    color: var(--blanco--);
    margin-bottom: 20px;
}

form label {
    font-size: 25px;
}

form input{
    font-size: 12px;
    border-radius: 21px;
    border: none;
    padding: 5px 15px 5px 15px;
    margin-bottom: 20px;
    opacity: 0.6;
}

.campo-formulario{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 35px;
}

.boton{
    width: 200px;
    align-self: center;
    font-size: 20px;
    color: var(--azul--);
    border: 1px solid var(--azul--);
    border-radius: 20px;
    padding: 5px;
}

.boton a {
    text-decoration: none;
}

/*---------------------------------------------------*/

/*-------------------------------------------------------*/

@media (max-width: 866px) {

    .titulo-nuestros-procesos{
        width: 100%;
    }

    form{
        width: 100%;
    }

    .titulo-nuestros-procesos p {
        font-size: 20px;
    }

    .caja-fondo{
        display: none;
    }

    .imagenes-nuestros-procesos{
        display: grid;
        grid-template-columns: 40% 40%;
        grid-template-rows: 40% 40%;
        column-gap: 10px;
        row-gap: 20px;
    }

    .imagenes-nuestros-procesos img {
        margin: 15px 0 0 0;
        width: 100%;
        object-fit: cover;
    }

    footer{
        flex-direction: column;
        height: auto;
        padding-top: 15px
    }

    .nuestros-procesos{
        padding: 0;
    }
}