/*------------- cajas de contacto ------------*/

.contacto .icono i {
    font-size: 2em;
    line-height: 2em;
}

.contacto .titulo_dato {
    font-size: clamp(1.2rem, 1.146rem + 0.27vw, 1.5rem);
    color: #000;
}

.contacto .datos_cont {
    margin-top: 7%;
    text-align: center;
    line-height: 100%;
}

.contacto .icono {
    display: inline-block;
    text-align: center;
    width: 4em;
    height: 4em;
    border-radius: 50%;
    margin-right: 5px;
  
    color: #fff;
}

.contacto .datos_cont a {
    
    font-size: clamp(1.2rem, 2.5vw, 1.4rem);   
    transition: color 1s linear;
}

.contacto .datos_cont a:hover {
    color: #000;
}




/*----------------- formulario y mapa ----------------*/
.mapa_form{background-color:#b5884520 ;  }
.contacto .formulario {   padding: 10%;}

.contacto .formulario .politica {
    font-size: 0.8em;
    color: #333;
}

.contacto h2 {
    font-size: clamp(2rem, 2.5vw, 5rem);
    line-height: 100%;
    text-transform: uppercase;
    
    font-weight: 400;
}



.contacto .form-group {
    margin-bottom: 1.2rem;
}

.contacto .form-group label {
    text-transform: uppercase;
    font-size: 0.9em;
    color: #333;
    padding-left: 5px;
    letter-spacing: 1px;
}

.contacto *::placeholder {
    visibility: hidden;
}

.contacto .sobre_titulo::after {
    display: none;
}

.contacto .bajo_raya {
    border: none;
}

.contacto .mapa {
    /*background-color: #E6E4E0;*/
    padding-left: 0;
    padding-right: 0;
}


.altura_mapa {
    height: 1087px;
}
.mapboxgl-canvas {
    height: 100% !important;
    width: 100% !important;
}
.mapboxgl-popup-content { padding: 25px!important; border:transparent!important; color:#000;}
.mapboxgl-popup-content a {color:#000;}
.mapboxgl-popup-content a:focus-visible {    outline: none!important;}




/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {
    .relleno_bloques {
        padding: 30px 10px;
    }
    .altura_mapa {
        height: 400px;
    }

}

/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) {
    .altura_mapa {
        height: 450px;
    }
}

/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {
    .formulario {
        padding: 40px 20px;
    }
}

/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) {

}

@media (min-width: 1200px) and (max-width: 1900px) {
    .formulario {
        padding: 10%;
    }


}

/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1901px) {
    .formulario {
        padding: 10%;
    }


}