Повторил код, все работает.
Не работает только выравнивание, или свойства прозрачности и черного фона тоже? В таком случае, неправильно прописан путь к main.css
1. Уберите половину оберток.
2. Для navbar-list бесполезно задавать inline-block, у него родитель flex.
3. Сделайте песочницу с неработающим кодом. Возможно, есть еще какие-то стили, которые вы нам не показываете.
Потому что все работает: https://jsfiddle.net/0gt6ba1j/
flex задается родительскому тегу, который в свою очередь действует на все теги первого уровня вложенности в него. флекс тебе нужен для li, их родительский элемент(тэг в который вложены li) это ul. Соответственно флекс надо давать ul.