Can a:hover over-ride a:visited?

programming web dev
1

I’ve made this little menu bar where a small image appears on rollover. When the link has been clicked, I want a different image to display via the a:visited property (which it does). However, when the user re-hovers over the same link on the original screen, i want the standard image to still over-ride the visted image…does that make sense to you?

Here’s a link to the site, so you can see what I mean:
http://www.conso-mail.com/SiteRender.aspx?SiteID=4&themeid=4

Here’s relevant code:

#FooterNav li a:hover {
    color: #999;
    background-image: url('http://images.acxiomonline.com/images/rrahma/FR/Sub-page-box-triangle.gif');
   }
   #FooterNav li a:visited {
    color: #ccc;
    background-image: url('http://images.acxiomonline.com/images/rrahma/FR/Sub-page-box-tick.gif');
   }

Any ideas guys?