.topbar { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 0px; padding: 0px 0; background-color: #004b8d; /* adjust as needed */ } .topbar ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; gap: 25px; } .topbar li { text-align: center; } .topbar a { text-decoration: none; color: white; font-weight: 500; font-size: 16px; transition: color 0.2s ease; } .topbar a:hover { color: #ffd966; /* accent color */ } /* Responsive stacking */ @media (max-width: 768px) { .topbar ul { flex-direction: column; gap: 10px; } .topbar a { font-size: 15px; } }