This may be a dumb question, but I'm new to this so don't be cruel! (ha) Okay, I'm in a web design class and we are working on an assignment. I have three navigation bars on my web page and they all have an id name. topnav, mainnav, and footernav. They all have to look different. How do I target them individually? I've tried #topnav {whatever rules I add;} but that does nothing. I've tried .topnav {whatever rules;} and that also does nothing. I can't figure it out and I'm about to flip out! Please help me out. Thanks!! 
This is what it looks like:

```
<ul id="topnav"> 
  <li><a href="#">Home</a></li>
  <li><a href="#">Sitemap</a></li>
  <li><a href="#">Contact</a></li>
</ul>

```

That produces a little mini nav bar in my webpage that I have to center the text inside the button backgrounds, take out the underline, make the text bold, 12px, and green, and it has to have a red hover. I've almost got it... it's green, red hover, I cant figure out how to center it though or target that one particular nav bar with css. Everything I try either does nothing or targets them all (all navbars) 
When I put the rules in css this is what I've got:

```
a:link {
  text-align: center;
  text-decoration: none;
  font-size: 12px;
  font-weight: bold;
  color: #4B5125;
  display: inline-block;
}

```

I know a:link targets them all but I'm wanting to tell css that it needs to modify these links but ONLY these links, not all the navigation bars on the page. Also this doesn't center the text... This stuff is hard!