/*Estilos generales del footer*/

#footer{
  padding: 40px 0 0 0;
}

#footer p{
  font-size: .9rem;
}

#footer a:hover {
  color: white;
}

#footer a {
  color: white;
}

#footer .list-inline .list-inline-item {
  padding: 10px 0px;
}

#footer .list-inline-item:not(:last-child) {
    margin-right: .8rem;
}

#footer li a i{
  border-radius: 50%;
}

#footer li a i#facebook {
  font-size: 22px;
  color: white;
  border: 2px solid #3a5795;
  padding: 10px;
}

#footer li a i#facebook:hover {
  color: white;
  background-color: #3a5795;
}

#footer li a i#twitter {
  font-size: 22px;
  color: white;
  border: 2px solid #5ea9dd;
  padding: 10px;
}

#footer li a i#twitter:hover {
  color: white;
  background-color: #5ea9dd;
}

#footer li a i#instagram {
  font-size: 22px;
  color: white;
  border: 2px solid #2a5b83;
  padding: 10px;
}

#footer li a i#instagram:hover {
  color: white;
  background-color: #2a5b83;
}

#footer li a i#whatsapp {
  font-size: 22px;
  color: white;
  border: 2px solid green;
  padding: 10px;
}

#footer li a i#whatsapp:hover {
  color: white;
  background-color: green;
}

#footer .footer-copyright{
  overflow: hidden;
  background-color: rgba(0,0,0,.2);
  color: rgba(255,255,255,.6);

}

#footer .centrar{
  text-align: center;
}

/*Color de fondo para el footer*/

.text-dark {
  color: black;
  font-size: 15px;
}

.darken-3{
  background: var(--color-terciario-background);
}

/*Mediaquerys para ajustar elementos al responsive*/

@media (max-width: 575.98px) {

  #footer .footer-menu {
    display: block !important;
    padding: 20px 0;
    font-size: 20px;
  }

  #footer li a i#twitter {
    font-size: 15px;
  }

  #footer li a i#facebook {
    font-size: 15px;
  }

  #footer li a i#instagram {
    font-size: 15px;
  }

  #footer li a i#whatsapp {
    font-size: 15px;
  }

  #footer .centrar{
    text-align: left;
  } 

}

@media (min-width: 576px) and (max-width: 767.98px) {

#footer .centrar{
  text-align: left;
}

}