nav { display: flex; justify-content: space-between; background-color: var(--clr-Melon); padding: 1rem var(--container-size); .nav-right, .nav-left { display: flex; align-items: center; gap: 2rem; } .nav-right > a { display: flex; } .nav-btn { display: none; } a { text-decoration: none; font-size: 1.5rem; font-weight: 700; font-size: normal; color: var(--clr-Murrey); } img { height: 2rem; } .nav-left img { height: 4rem; } } @media only screen and (max-width: 768px) { nav { flex-wrap: wrap; } .nav-right { display: none !important; } .mobile-visible { display: flex !important; flex-direction: column; justify-content: center; width: 100%; margin-top: 2rem; } .nav-btn { display: flex !important; align-items: center; img { height: 3rem; cursor: pointer; } } }