.hover-gif-nuestra-gestion::after {
  content: "";
  position: absolute;
  top: -8rem;
  left: 50%;
  transform: translateX(-50%) scale(0.95);
  width: 7.5rem;
  height: 7.5rem;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
  border-radius: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  z-index: 10;
}

.hover-gif-nuestra-gestion:hover::after {
  background-image: url("/SiteAssets/Images/gif/3. Transparencia.gif");
  opacity: 1;
  transform: translateX(-50%) scale(1);
}

.hover-gif-atencion::after {
  content: "";
  position: absolute;
  top: -8rem;
  left: 50%;
  transform: translateX(-50%) scale(0.95);
  width: 7.5rem;
  height: 7.5rem;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
  border-radius: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  z-index: 10;
}

.hover-gif-atencion:hover::after {
  background-image: url("/SiteAssets/Images/gif/4. Atención al Ciudadano.gif");
  opacity: 1;
  transform: translateX(-50%) scale(1);
}

.hover-gif-participa::after {
  content: "";
  position: absolute;
  top: -8rem;
  left: 50%;
  transform: translateX(-50%) scale(0.95);
  width: 7.5rem;
  height: 7.5rem;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
  border-radius: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  z-index: 10;
}

.hover-gif-participa:hover::after {
  background-image: url("/SiteAssets/Images/gif/4. Participa.gif");
  opacity: 1;
  transform: translateX(-50%) scale(1);
}

.hover-gif-casanare::after {
  content: "";
  position: absolute;
  top: -8rem;
  left: 50%;
  transform: translateX(-50%) scale(0.95);
  width: 7.5rem;
  height: 7.5rem;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
  border-radius: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  z-index: 10;
}

.hover-gif-casanare:hover::after {
  background-image: url("/SiteAssets/Images/gif/1. El Casanare.gif");
  opacity: 1;
  transform: translateX(-50%) scale(1);
}

.hover-gif-gobernacion::after {
  content: "";
  position: absolute;
  top: -8rem;
  left: 50%;
  transform: translateX(-50%) scale(0.95);
  width: 7.5rem;
  height: 7.5rem;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
  border-radius: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  z-index: 10;
}

.hover-gif-gobernacion:hover::after {
  background-image: url("/SiteAssets/Images/gif/2. La Gobernación.gif");
  opacity: 1;
  transform: translateX(-50%) scale(1);
}

.hover-gif-nuestra-gestion-menu::after {
  content: "";
  position: absolute;
  top: -8rem;
  left: 50%;
  transform: translateX(-50%) scale(0.95);
  width: 7.5rem;
  height: 7.5rem;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
  border-radius: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  z-index: 10;
}

.hover-gif-nuestra-gestion-menu:hover::after {
  background-image: url("/SiteAssets/Images/gif/5.NuestraGestión.gif");
  opacity: 1;
  transform: translateX(-50%) scale(1);
}

.hover-gif-proyectos::after {
  content: "";
  position: absolute;
  top: -8rem;
  left: 50%;
  transform: translateX(-50%) scale(0.95);
  width: 7.5rem;
  height: 7.5rem;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
  border-radius: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  z-index: 10;
}

.hover-gif-proyectos:hover::after {
  background-image: url("/SiteAssets/Images/gif/6. Proyectos.gif");
  opacity: 1;
  transform: translateX(-50%) scale(1);
}