/* Custom CSS for the Image Animation */
        .slide-in-right {
            animation: slideIn 1s ease-out forwards;
            /* Start slightly invisible and to the right */
            opacity: 0; 
            transform: translateX(50px);
        }

        @keyframes slideIn {
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        /* Section Spacing */
        section {
            padding: 60px 0;
            border-bottom: 1px solid #e9ecef; /* Just to visualize sections */
        }

        /* Card Icon Styling */
        .card-icon {
            font-size: 3rem;
            color: #0d6efd;
            margin-bottom: 15px;
        }
        
        /* Ensure images fit their containers */
        img.img-fluid {
            max-width: 100%;
            height: auto;
            border-radius: 8px;
        }
	nav {
	    background-color: white;
	}
	.navbar-brand img {
	    max-height: 50px;
	}
	.navbar-brand {
	    font-size: 24px;
	    text-transform: uppercase;
	    font-weight: 900;
	    color: #683aa4;
	}
	nav ul li a {
	    color: #a9a9a9;
	    font-size: 22px;
	    margin: auto 10px;
	}
	nav ul li a:hover {
	    color: #683aa4;
	}
    
@media (max-width: 767px) {
   .w-mobile-100 {
    width: 100%;
    max-width: 300px; /* Prevent them from getting too wide */
    }
}