JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="nav">
  <li><a href="">Divisions & Services</a></li>
  <li><a href="">Projects</a></li>
  <li><a href="">About</a></li>
  <li><a href="">Careers</a></li>
  <li>C<a href="">ontact Us</a></li>
</ul>

CSS

.nav {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  text-align: center;
  padding: 2rem 1rem;
  list-style: none;
}
li a{
  text-decoration: none;
  color: black;
}
li a:hover {
  font-weight: 900;
}