How do I make the rest of the text in this navigation bar appear inline with the logo

So I have been trying to get the text for my navigation bar to line up with my image logo. Any ideas how I can fix my code? Any help would be greatly appreciated!

ul {  list-style-type: none;  margin: 0;  padding: 0;  overflow: hidden;  }    li {  float: left;  }    li a {  display: block;  color: white;  text-align: center;  padding: 25px 16px;  text-decoration: none;  font-family: Arial, Helvetica, sans-serif;  font-weight: 400;  font-style: normal;  opacity: .5;  }    li a:hover {  color: white;  opacity: 1;  font-weight: 500;  transition: all .7s;  text-shadow: 0px 0px 15px black;  }    .logo-image{  width: 40px;  height: 40px;  border-radius: 50%;  margin-top: 6px;  image-rendering: -moz-crisp-edges; /* Firefox */  image-rendering: -o-crisp-edges; /* Ope[enter image description here][1]ra */  image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */  image-rendering: crisp-edges;     }  

https://stackoverflow.com/questions/67293208/how-do-i-make-the-rest-of-the-text-in-this-navigation-bar-appear-inline-with-the April 28, 2021 at 11:08AM