@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}

@keyframes slideDownHard{
  from {
    transform: translateY(-500%);
  }
  to {
    transform: translateY(0);
  }
}

@keyframes slideUp {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-300%);
  }
}

@keyframes slideUpG {
  from {
    transform: translateY(200%);
  }
  to {
    transform: translateY(0);
  }
}

@keyframes slideRight {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0);
  }
}

@keyframes slideLeft {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-300%);
  }
}

@keyframes fadeIn{
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideLeftIn {
  from {
    transform: translateX(300%);
  }
  to {
    transform: translateX(0);
  }
}

@keyframes slideLeftIn2 {
  from {
    transform: translateX(300%);
  }
  to {
    transform: translateX(0);
  }
}

.gallery div:nth-child(2).activado, .gallery div:nth-child(1).activado, .gallery div:nth-child(5).activado{
  animation: slideRight 0.6s ease, fadeIn 0.8s ease;
}
.gallery div:nth-child(6).activado, .gallery div:nth-child(7).activado, .gallery div:nth-child(4).activado{
  animation: slideUpG 0.6s ease, fadeIn 0.8s ease;
}
.gallery div:nth-child(8).activado, .gallery div:nth-child(3).activado{
  animation: slideLeftIn2 0.6s ease, fadeIn 0.8s ease;
}