/* General styling */
body {
    font-family: Arial, sans-serif;
}

.hero {
    background-color: #f8f9fa;
    color: #333;
}

.hero-image {
    filter: contrast(1.1) brightness(1.05);
    transition: transform 0.3s ease, filter 0.3s ease;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

.hero-image:hover {
    transform: scale(1.05);
    filter: contrast(1.2) brightness(1.1);
}

.about, .news, .gallery, .contact {
    padding: 2rem;
}

.footer {
    background-color: #333;
    color: white;
}

.board-member-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
    top: -50px;
    border: 5px solid #ffffff;
}

.card-cover {
    position: relative;
    border: none;
}

.overlay {
    background: rgba(0, 0, 0, 0.5); /* Semi-transparent overlay */
    color: white;
    text-shadow: none;
    padding: 20px;
}

.shadow {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Soft shadow for cards */
}

h6 {
    font-size: 1.25rem;
}



.btn-primary:hover {
    background-color: #0056b3; /* Darker shade on hover */
}

/* General fade-in and slide-up animation */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInScale {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Animation classes */
.fade-in-up {
    animation: fadeInUp 1s ease forwards;
    opacity: 0; /* Initial state for animation */
}

.fade-in-scale {
    animation: fadeInScale 1s ease forwards;
    opacity: 0;
}

.chairperson-message {
    font-style: italic;
    color: #555;
    margin-top: 10px;
    font-size: 1.1rem; /* Slightly larger font size */
    padding: 10px; 
    border-left: 3px solid #007bff; /* Add a colored border for emphasis */
    background-color: #f9f9f9; /* Light background */
  }

      /* Navbar container adjustments */
      .container-fluid {
        max-width: 100%;
        padding: 0 1rem;
      }
    
      /* Navbar alignment and spacing */
      .navbar {
        align-items: center;
      }
    
      .navbar-brand {
        display: flex;
        align-items: center;
        font-weight: 600;
      }
    
      /* Navbar links styling */
      .nav-link {
        font-size: 1rem;
        font-weight: 500;
        color: #333;
        padding: 0.5rem 1rem;
      }
    
      .nav-link:hover {
        color: #007bff;
      }
    
      /* Button for Home */
      .btn-outline-info {
        font-size: 1rem;
        padding: 0.4rem 1rem;
      }
    
      /* Navbar customization for small screens */
      @media (max-width: 992px) {
          /* Ensure navbar opens from the left */
          #navbarNav {
              text-align: right;
          }
      }

      /* Partners Section */
#partners {
    background-color: #f9f9f9;
  }
  
  #partners img {
    max-height: 80px;
    margin-bottom: 1rem;
  }
  
  #partners p {
    font-size: 0.9rem;
    color: #555;
  }
  
  

/* Mobile-specific styling */
@media (max-width: 768px) {
    .hero-text {
        animation-delay: 0.5s;
    }

    .hero-image {
        animation-delay: 1s;
    }
}

/* Desktop-specific styling */
@media (min-width: 769px) {
    .hero-image {
        animation-delay: 0.5s;
    }
}
