body {
    font-family: Arial, sans-serif;
    background-color: #000000; /* Dark background */
    color: #0d6efd; /* Light text for readability */
}

.hero {
    background-image: url('https://communitywaste.com/images/heroback.jpg'); /* Replace with actual image URL */
    background-size: 100%;
    background-position: top;
    background-repeat: no-repeat; /* Ensure no repeat */
    background-color: #0d6efd; /* Fallback Bootstrap primary blue */
}

.card {
    background-color: #000000; /* Darker card background */
    color: #0d6efd; /* Light text on cards */
    border: 1px solid #444; /* Subtle border for contrast */
    transition: transform 0.3s;
}

.card:hover {
    transform: translateY(-5px);
}

.navbar {
    background-color: #000000; /* Dark navbar background */
}

.navbar-brand {
    font-weight: bold;
    font-size: 1.5rem;
    color: #0d6efd; /* Light text for navbar brand */
}

.navbar-nav .nav-link {
    color: #0d6efd; /* Light text for nav links */
}

.navbar-nav .nav-link:hover {
    color: #0d6efd; /* Blue on hover for nav links */
}

footer {
    background-color: #000000; /* Dark footer background */
    color: #0d6efd; /* Light text for footer */
    margin-top: 20px;
}

.btn-primary {
    background-color: #0d6efd; /* Retain original Bootstrap blue */
    border-color: #0d6efd;
}

.btn-primary:hover {
    background-color: #0c0c0c; /* Slightly darker blue for hover */
    border-color: #0a58ca;
}