.navbar {
    display:grid;
    align-items: center;
    grid-template-columns: 1fr auto 1fr;
    background-color: var(--grey-tint);
    padding: 0.5rem 0.1rem;
}
.nav-logo {
    grid-column:1;
    fill:var(--primary);
    height: 50px;
    border-radius:10px;
}
.nav-menu {
    /* display edits */
    display:flex;
    flex-wrap:wrap;
    grid-column:2;
    background-color: var(--grey);
    /* text edits */
    list-style:none;
    /* box model edits */
    border:1px;
    border-radius:18px;

    box-shadow: 0px 2px 5px var(--grey-shade);
}

.nav-item {
    display:flex;
    justify-content:center;
    padding:0.3rem;
    border-radius:18px;
    margin:3px 0.2rem;
    min-width:89px;
}
.nav-item:hover,
.nav-item.active{
    background-color: var(--grey-shade);
}
.nav-item:hover .nav-link,
.nav-item.active .nav-link{
    color: var(--grey-tint);
}

.nav-link{
    color:black;
}