/* REDES SOCIALES */

.RRSS {
  margin-top: 5%;
  margin-bottom: 5%;
  padding-left: 8%;
  padding-bottom: 3%;
  backdrop-filter: blur(6px) saturate(180%);
  -webkit-backdrop-filter: blur(6px) saturate(180%);
  background-color: rgba(234, 241, 245, 0.13);
  border-radius: 12px;
  border: 1px solid rgba(209, 213, 219, 0.3);
}

.rrss-info{
    padding-top: 10%;
}

.img-rrss {
  width: 100%;
}

.btn-fcb {
  font-size: 1.5rem;
  padding-left: 3.5%;
  padding-right: 3.5%;
  color: #3b5998;
  border: 0.5px solid #3b5998;
}

.btn-fcb:hover{
    color: white;
    background-color: #3b5998;
}

.btn-ins {
  font-size: 1.5rem;
  color: #ac2bac;
  border: 0.5px solid #ac2bac;
}

.btn-ins:hover{
    color: white;
    background-color: #ac2bac;
}

@media only screen and (max-width: 1200px) {

  .btn-fcb{
    padding-left: 4%;
    padding-right: 4%;
  }

}

@media only screen and (max-width: 992px) {

  .btn-fcb{
    padding-left: 5.5%;
    padding-right: 5.5%;
  }

}

@media only screen and (max-width: 770px) {

  .btn-fcb{
    font-size: 1rem;
    padding-left: 7%;
    padding-right: 7%;
  }

  .btn-ins{
    font-size: 1rem;
  }

  .img-rrss{
    max-width: 100%;
  }

  .rrss-info{
    font-size: 0.7rem;
  }

}

@media only screen and (max-width: 515px) {

  .btn-fcb{
    padding-left: 8%;
    padding-right: 8%;
  }

  .img-rrss {
    max-width: 100%;
  }

}

@media only screen and (max-width: 450px) {

  .btn-fcb{
    padding-left: 9%;
    padding-right: 9%;
  }

}

@media only screen and (max-width: 390px) {

  .btn-fcb{
    padding-left: 10%;
    padding-right: 10%;
  }

}

/* CONTACTO */

.CONTAC {
    margin-top: 5%;
    margin-bottom: 5%;
    padding-left: 8%;
    padding-top: 3%;
    padding-bottom: 3%;
    backdrop-filter: blur(6px) saturate(180%);
    -webkit-backdrop-filter: blur(6px) saturate(180%);
    background-color: rgba(234, 241, 245, 0.13);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
  }
  
  .tlf-info{
      padding-top: 10%;
  }
  
  .img-tlf {
    width: 80%;
  }
  
  .btn-wha {
    font-size: 1.5rem;
    color: #25D366;
    border: 0.5px solid #25D366;
  }
  
  .btn-wha:hover{
      color: white;
      background-color: #25D366;
  }
  
  .btn-cor {
    font-size: 1.5rem;
    color: #dd4b39;
    border: 0.5px solid #dd4b39;
  }
  
  .btn-cor:hover{
      color: white;
      background-color: #dd4b39;
  }

  
  @media only screen and (max-width: 770px) {
  
    .btn-wha{
      font-size: 1rem;
    }

    .btn-cor{
      font-size: 1rem;
    }
  
    .img-tlf{
      max-width: 100%;
    }
  
    .tlf-info{
      font-size: 0.7rem;
    }
  
  }
  
  @media only screen and (max-width: 515px) {
  
    .img-rrss {
      max-width: 100%;
    }
  
  }
  
  @media only screen and (max-width: 450px) {
  
    .btn-fcb{
      padding-left: 9%;
      padding-right: 9%;
    }
  
  }
  
  @media only screen and (max-width: 390px) {
  
    .btn-fcb{
      padding-left: 10%;
      padding-right: 10%;
    }
  
  }

/* DIRECCIÓN */

.DIREC {
    margin-top: 5%;
    margin-bottom: 5%;
    padding-left: 8%;
    padding-top: 3%;
    padding-bottom: 3%;
    backdrop-filter: blur(6px) saturate(180%);
    -webkit-backdrop-filter: blur(6px) saturate(180%);
    background-color: rgba(234, 241, 245, 0.13);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
  }
  
  .mapa-info{
      padding-top: 10%;
  }

  iframe{
      width: 400px;
      height: 300px;
      border: 0.3rem solid #e78335;
  }

@media only screen and (max-width: 992px) {
  .mapa iframe{
    width: 250px;
    height: 250px;
  }
}

@media only screen and (max-width: 770px) {
  .mapa iframe{
    margin-top: 20%;
    width: 200px;
    height: 200px;
  }
}

@media only screen and (max-width: 600px) {
  .rrss {
    padding-top: 10%;
    width: 40%;
  }

  .titulo-contacto {
    font-size: 20px;
  }

  .texto-contacto {
    font-size: 15px;
  }

  .contacto {
    width: 50%;
  }

  .mapa iframe {
    width: 150px;
    height: 150px;
  }

  .contacto-mapa {
    margin-left: 30px;
  }
}
