const observer = new IntersectionObserver(entries => {
    // Loop over the entries
    entries.forEach(entry => {
      // If the element is visible
      if (entry.isIntersecting) {
        // Add the animation class
        entry.target.classList.add('slide-animation');
      }
    });
  });
  
  observer.observe(document.querySelector('#event-main-box'));
  observer.observe(document.querySelector('#timeline'));
  observer.observe(document.querySelector('#signup-article'));
  observer.observe(document.querySelector('#rules-description'));
  observer.observe(document.querySelector('#guidelines'));
  observer.observe(document.querySelector('#code-of-conduct'));
  observer.observe(document.querySelector('#photo-release-container'));
  observer.observe(document.querySelector('#prizes-container'));
  observer.observe(document.querySelector('#team-container'));