To adjust the Tone of a Color

what am i doing wrong?

<style>
header {
  background-color: hsl(180, 90%, 35%);
  color: #FFFFFF;
}

nav {
background-color: hsl (180, 80%, 25%);
}

h1 {
  text-indent: 10px;
  padding-top: 10px;
}

nav ul {
  margin: 0px;
  padding: 5px 0px 5px 30px;
}

nav li {
  display: inline;
  margin-right: 20px;
}

a {
  text-decoration: none;
  color: inherit;
}
</style>

<header>
<h1>Cooking with FCC!</h1>
<nav>
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Classes</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
</nav>
</header>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.61 Safari/537.36.

Challenge: Adjust the Tone of a Color

Link to the challenge:
https://www.freecodecamp.org/learn/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-colorPreformatted text

the syntax is hsl(...), you have an extra space