/* Set the default color of nav items */
.navbar-nav .nav-link {
    /* color: green; Change the text color to green */
    position: relative; /* Needed for the underline effect */
    text-decoration: none; /* Remove the default underline */
    transition: color 0.3s ease; /* Smooth color transition */
}

/* Underline effect on hover */
.navbar-nav .nav-link::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px; /* Thickness of the underline */
    background: green; /* Color of the underline */
    left: 0; /* Position underline to left */
    bottom: -5px; /* Adjust vertical position of underline */
    transform: scaleX(0); /* Start with scale 0 (invisible) */
    transition: transform 0.3s ease; /* Smooth scaling effect */
}

/* Underline effect on dropdown item hover */
.dropdown-toggle::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px; /* Thickness of the underline */
    background: green; /* Color of the underline */
    left: 0; /* Position underline to left */
    bottom: -5px; /* Adjust vertical position of underline */
    transform: scaleX(0); /* Start with scale 0 (invisible) */
    transition: transform 0.3s ease; /* Smooth scaling effect */
}

/* Show underline when hovering over the nav item */
.navbar-nav .nav-link:hover::after {
    transform: scaleX(1); /* Scale to full width */
}

/* Show dropdown on hover */
.nav-item.dropdown:hover .dropdown-menu {
    display: block; /* Show dropdown on hover */
    background: white;
}

/* Initially hide the dropdown */
.dropdown-menu {
    display: none;
}



/* Background color effect on dropdown item hover */
.dropdown-item:hover {
    background-color: green; /* Set background color to green on hover */
    color: white; /* Optional: change text color to white on hover */
}

/* Underline effect on dropdown item hover */
.dropdown-item::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px; /* Thickness of the underline */
    background: white; /* Set underline color, white for contrast */
    left: 0; /* Position underline to left */
    bottom: -5px; /* Adjust vertical position of underline */
    transform: scaleX(0); /* Start with scale 0 (invisible) */
    transition: transform 0.3s ease; /* Smooth scaling effect */
}

/* Show underline when hovering over the dropdown item */
.dropdown-item:hover::after {
    transform: scaleX(1); /* Scale to full width */
}

/* Styling for the top bar */
.topbar {
    background-color: white; /* Light background color */
    padding: 10px 20px; /* Padding for the top bar */
}
.topbar .social-links a {
    margin-left: 10px; /* Space between social links */
    color: #343a40; /* Default link color */
}
.topbar .social-links a:hover {
    color: green; /* Change color on hover */
}



.header-bottom {
    color: black;
    font-size: small;
}