body {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
    scroll-behavior: smooth; /* Enable smooth scrolling */
}

section {
    padding: 60px 20px;
    text-align: center;
    min-height: 800px; /* Set minimum height for each section */
    box-sizing: border-box;
}


.sky-background {
    background: linear-gradient(to bottom, #87ceeb 0%, #ffffff 100%);
    height: 100vh; /* Adjust the height as needed */
    width: 100%; /* Adjust the width as needed */
  }
  
.fade {
    transition: opacity 0.5s ease-in-out;
    opacity: 1;
  }
  
  .fade.out {
    opacity: 0;
  }
  
  
  .slide {
    transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
    opacity: 1;
    transform: translateY(0);
  }
  
  .slide.out {
    opacity: 0;
    transform: translateY(-20px);
  }
  
  
  .rotate {
    transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
    opacity: 1;
    transform: rotate(0deg);
  }
  
  .rotate.out {
    opacity: 0;
    transform: rotate(90deg);
  }