/* ==========================================================================
   REDES SOCIALES
   Íconos de redes en encabezado, menú lateral y clima.
   ========================================================================== */

.clima ul {
  color: var(--vz-texto);
  padding: 0px 17px;
  background-color: var(--vz-borde);
  margin: 0;
}
.clima li {
  font-family: var(--vz-fuente-titulo);
  display: inline-block;
}
.social-networks li {
  margin: 0 2px;
  display: inline-block;
  vertical-align: middle;
}
.social-header {
  
  margin-bottom: 0;
  text-align: right;
}
.social-header li:first-child img {
  max-width: 50px;
}
.social-header li:first-child a {
  width: initial;
  height: initial;
}
.social-header li:first-child a:hover {
  opacity: 0.7;
  background-color: transparent;
  border-radius: 0;
}
.social-header li:last-child img {
  max-width: 32px;
}
.social-header li:last-child a {
  border-radius: 8px;
  padding: 0;
}
.social-header li:last-child a i {
  font-size: 32px;
}
.social-header a {
  text-align: center;
  display: block;
  width: 36px;
  height: 36px;
  font-size: 22px;
  color: var(--vz-guinda);
  border-radius: 20px;
  padding: 2px;
}
.social-header a:hover {
  color: var(--vz-guinda);
  background-color: var(--vz-borde);
}
.social-modal {
  margin: 0;
}
.social-modal a {
  background-color: var(--vz-gris-200);
  text-align: center;
  display: block;
  width: 36px;
  height: 36px;
  font-size: 22px;
  color: var(--vz-guinda);
  border-radius: 20px;
  padding: 2px;
}
.social-modal a:hover {
  color: var(--vz-guinda);
  background-color: var(--vz-gris-700);
}