/* Navbar Styles */
.navbar {
    background-color: #343a40; /* Dark background for navbar */
    border-bottom: 1px solid #ddd; /* Light border for separation */
}

.navbar-brand {
    font-size: 1.75rem; /* Larger font size for brand */
}

.nav-link {
    color: #fff !important; /* White text for navbar links */
    font-size: 1.1rem; /* Slightly larger font size */
}

.nav-link:hover {
    color: #dcdcdc !important; /* Light grey text on hover */
}

/* Hero Section Styles */
.header-box {
    background-color: #2c2c2c; /* Darker grey for contrast */
    padding: 40px 20px; /* Extra padding for header box */
    border-radius: 8px;
}

.header-box h1 {
    font-size: 3rem; /* Large font size for main heading */
}

.header-box p {
    font-size: 1.25rem; /* Larger font size for subtext */
}

/* Service Boxes */
.service-box {
    background-color: #9a9696; /* White background for service boxes */
    border: 1px solid #ccc; /* Light grey border */
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); /* Soft shadow for depth */
}

.service-box h4 {
    font-size: 1.5rem; /* Larger font size for headings */
}

.service-box p {
    font-size: 1rem; /* Standard font size for paragraphs */
}

/* Button Styles */
.btn-primary {
    background-color: #007bff; /* Primary button background */
    border-color: #007bff; /* Button border color */
    font-size: 1rem; /* Standard font size */
    padding: 10px 20px; /* Adequate padding */
}

.btn-primary:hover {
    background-color: #0056b3; /* Darker blue on hover */
    border-color: #004b99; /* Darker border on hover */
}

/* Footer Styles */
footer {
    background-color: #343a40; /* Dark footer background */
    color: #fff; /* White text color */
    padding: 20px; /* Padding for footer content */
}

footer p {
    margin: 0; /* Remove margin from footer text */
}

/* Responsive Adjustments */
@media (max-width: 767px) {
    .navbar-nav {
        text-align: center;
    }

    .navbar-nav .nav-item {
        margin-bottom: 10px;
    }
}

/* Additional Styling for Screensaver Effect */
.screensaver {
    animation: fadeInOut 10s infinite; /* Smooth transition for screensaver */
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 0;
    }
}
body
{
    background-color: #e9ebee;
    color: #333;

}