.menu{width: 300px;}

@media screen and (max-width: 500px){
    .menu{justify-content: center; margin:0; width: auto;}
    figure > a {flex-direction: column; gap: 15px;}
    .project-list figcaption { 
        position: relative;
        background-color: var(--bkg-col);
        width: fit-content;
        padding: 10px 20px;
        padding-top: 15px;
        border: 5px var(--highlight) ridge;
    }
}

@media screen and (max-height: 500px) and (orientation: landscape) {
    .menu{
        justify-content: space-around; 
        align-items: center; 
        width: 100%;
        height: 35vh;
    }
    .gallery{width: calc(100vw - 20px); margin: 0 10px; overflow-x: clip;}
}