/* responsive.css */

/* Mobile styles */
@media (max-width: 768px) {
    nav {
        position: relative;
    }

    nav ul {
        display: none;
        flex-direction: column;
        justify-content: center;
        position: absolute;
        top: 60px; /* Adjusted to ensure it appears below the header */
        left: 0;
        width: 100%;
        background-color: #003135;
    }

    nav .hamburger {
        display: flex;
        position: absolute;
        /* top: 20px; Adjusted for better positioning */
        right: 20px; /* Adjusted for better positioning */
    }

    nav ul.show {
        display: flex;
    }
}

.hamburger {
    display: none;
    flex-direction: column;
    cursor: pointer;
}

.hamburger div {
    width: 25px;
    height: 3px;
    background-color: white;
    margin: 4px;
}