How to override global link styles

Hello all,
I have a problem that is really starting to bug me.
I have just installed an article based script, and in the CSS, it has a style for all links:

a {
font-family:lucida,verdana,sans-serif;
font-size:12px;
font-weight:normal;
text-decoration:none;
color: #000000;
}

a.link {
color:#0033CC;
background-color:transparent;
}

a:hover {
color:#ff0000;
background-color:transparent;
}

Code (markup):

However, I would like a different style for the menu links. So, I created a separate style for the links:

links A:visited {
	COLOR: #0000ff; TEXT-DECORATION: none
}
links A:active {
	COLOR: #0000ff; TEXT-DECORATION: none
}
links A:link {
	COLOR: #0000ff; TEXT-DECORATION: none
}
links A:hover {
	COLOR: #0000ff; TEXT-DECORATION: none
}

Code (markup):

So, I set the menu div ID as "links", however, the style is still appearing as the global link style, not the custom defined style.

Any ideas why this could be?

Thanks in advance!

 

Add a '# infront of the links. So it should look like #links vs just links.

# refers to an id, the period '.' refers to a class.

 

Excellent. Thank you that man =]