help with: Active menu item overrules other elements

[Mark]

Hi there

This is my menu (well part of it; it is generated dynamicaly).

<ul>
<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a></li>
<li><a href="#">Item 3</a>
<ul>
<li><a href="#">Item 3a</a></li>
<li><a href="#">Item 3b</a></li>
</ul>
</li>
<li><a href="#">Item 4</a></li>
</ul>

You can this here: http://www.keyone.nl/temp.htm

I want the third item to stay active like this:

<li id="actief"><a href="#">Item 3</a>

See: http://www.keyone.nl/temp2.htm

But the active <li> element overrules all the underlying CSS and i am
not able to get it working as i whish. I only want that element to show
active and the other elements must be like the first version.

Hope someone can help me? I think my CSS is not okay but am not sure
what to do next.

Mark