/* Ensure the body fills the viewport */
body, html {
    height: 100%;
    margin: 0;
}

/* Ensure the container doesn't overflow */
.container-fluid {
    min-height: 100vh;  /* Ensure content takes up full height */
    display: flex;
    flex-direction: column;
}

/* Make the ul take 75% of the viewport height */
.full-height-nav {
    height: 80vh; /* 75% of viewport height */
    display: flex;
    flex-direction: column; /* Stack items vertically */
    justify-content: space-between; /* Distribute space evenly */
    padding: 10px; /* Optional: Add some padding around the list */
}

/* Add borders to individual list items */
.full-height-nav li.nav-item {
    border: 1px solid #ccc; /* Add a border to each list item */
    margin: 25px 0; /* Space between the items */
    padding: 10px; /* Padding inside each item */
}

/* Optional: Style the links */
.full-height-nav .nav-link {
    text-decoration: none; /* Remove underline */

    font-weight: bold; /* Make text bold */
}

.full-height-nav .nav-link:hover {

}

/* Footer spacing adjustment */
.container.mt-5.mb-5 {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 10px;
    padding-bottom: 10px;
}