body{
    background-image: url('../content/wallpapers/contacto-img.jpeg');
    background-size: cover;
    background-position:center top;
}
header{
    background-color:#373787;
}
h1{
    color:#373787;
    font-weight: bold;
    font-size: 30px;
}
h3{
    color:rgba(0,0,0,0.7);
    font-size: 25px;
    margin-right: 20px;
}
.capa-fondo{
    padding:200px 0;
    width:100%;
    background-color: rgba(255,255,255,0.5);
}
/*Formulario de contacto*/
#formulario .container{
    display:flex;
    align-items: center;
}
#formulario .container .form{
    flex-basis:55%;
}
#formulario .container .imagen{
    flex-basis:45%;
}
#formulario .container .imagen img{
    width:100%;
}
#formulario .container form{
    margin-top:20px;
    width:100%;
    padding:20px;
}
#formulario .container .form-group{
    margin-top:20px;
}
#formulario label{
    display:block;
    color:#373787;
    font-weight: bold;
}
#formulario input{
    width:70%;
    padding:10px;
    border-radius: 7px;
    border:none;
    box-shadow: 0px 0px 11px 1px #838383
}
#formulario textarea{
    width:70%;
    padding:10px;
    border-radius: 7px;
    border:none;
    box-shadow: 0px 0px 11px 1px #838383;
}
#formulario form button{
    border:none;
    width:70%;
}


/*Mapa*/
#mapa{
    margin-top:100px;
}
#mapa .container{
    background-color:rgba(255,255,255,0.5);
    padding:10px;
    border-radius: 7px;
    box-shadow: 0px 0px 11px 1px #838383;
}



/*RESPONSIVE*/
@media (max-width:768px){
    .capa-fondo{
        padding:150px 0;
    }
    h3{
        margin-right: 0;
    }
    #formulario .container{
        flex-direction: column;
    }
    #formulario .container .form{
        flex-basis:100%;
    }
    #formulario .container .imagen{
        flex-basis:100%;
    }
    #formulario input{
        width:100%;
    }
    #formulario textarea{
        width:100%;
    }
    #formulario form button{
    width:100%;
}
    #mapa{
        padding:0 20px;
    }
    
}