/* Generic section animation setup */
.animate-section {
  overflow: hidden;
}
.animate-section .element-left,
.animate-section .element-right {
  opacity: 0;
  transition: all 0.8s ease-in-out;
}
.animate-section .element-left {
  transform: translateX(-100px);
}
.animate-section .element-right {
  transform: translateX(100px);
}
/* Applied whenever a section becomes active */
.animate-section.active .element-left,
.animate-section.active .element-right {
  opacity: 1;
  transform: translateX(0);
}
.animate-section.active .element-right {
  transition-delay: 0.2s;
}

/* Generic section animation setup */
.animate-section {
  overflow: hidden;
}
.animate-section .element-top,
.animate-section .element-bottom {
  opacity: 0;
  transition: all 1.3s ease-in-out;
}
.animate-section .element-top {
  transform: translateY(-100px);
}
.animate-section .element-bottom {
  transform: translateY(80px);
}
.animate-section.active .element-top,
.animate-section.active .element-bottom {
  opacity: 1;
  transform: translateY(0);
}
.animate-section.active .element-bottom {
  transition-delay: 0.2s;
}