Hallo
Dein Quelltext hat mit korrektem HTML wenig und mit einer Navigation überhaupt nichts zu tun. Deshalb ist er zum Erklären und Ausprobieren vollkommen ungeeignet.
Deshalb nur soviel:
Bei Flexbox (display: flex;) gibt es keine Inline, Inline-Block oder Block-Elemente, sondern Flex-Items.
Um Flex-Items untereinander zu bekommen ist im CSS
flex-direction: column;
beim umgebenden Container (Flex-Container) vorgesehen.
Für Responsive Layouts haben sich im CSS Media Queries bewährt.
Gruss
MrMurphy