/* CSS Document */
 body {
            background-color: #f8f9fa;
            color: #333;
        }
        .header, .footer {
            background-color: #ffc107;
            color: #000;
        }
        .header .contact-info {
            font-size: 14px;
        }
        .header .social-icons a {
            color: #fff;
            margin-left: 10px;
        }
		
		
/* Mobile-specific styling */
@media screen and (max-width: 768px) {
    .header .social-icons {
        display: flex;
        justify-content: center; /* Center the icons */
        margin-top: 10px; /* Add some space above the icons */
    }}
	
	
	
        .navbar-light .navbar-nav .nav-link {
            color: #000;
            font-weight: bold;
        }

        .banner .carousel-item {
            height: 400px;
            background-color: #ffc107;
            color: #000;
            text-align: center;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .about, .services, .contact {
            padding: 60px 0;
        }
        .services .service-item {
            text-align: center;
            padding: 20px;
            background-color: #ffc107;
            border-radius: 8px;
            margin-bottom: 30px;
        }
        .services .service-item img {
            max-width: 100px;
            margin-bottom: 15px;
        }
        .footer {
            padding: 20px 0;
            text-align: center;
        }
		
	/* Dropdown on hover */
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; /* Optional: Adjust the margin-top for better alignment */
}

/* Ensure the dropdown-toggle remains styled correctly */
.nav-item.dropdown:hover .dropdown-toggle::after {
    display: inline-block;
    transform: rotate(180deg); /* Optional: rotate caret on hover */
}