I have some images that need to change, based not only on hover, but also on active state.

If you look at the page here: http://site427.mysite4now.net/tazthedog/site1/ There are some tabs with Screen Printing Quick Links, etc. The tab image is associated with the link and displays properly. The icon in tabs defaults to the gray and turns blue on mouse over, however, I also need it to be blue on the "active" state.

Here is the css:

.quick-links em:hover { background: transparent 
                                     url(../images/quick-links.png) 
                                    10px 9px 
                                    no-repeat
                       ; display: block
                       ; float: left; 
                      }

Here is the html:

 <ul class="tabs">
    <li class="quick-links">
      <a href="#quickLinks" id="">
         <em>
            <span>Screen Printing Quick Links</span>
         </em>
      </a>
    </li>
    <li class="distributor-ql">
       <a href="#distributorQL" id="">
          <em>
             <span>Dealer &amp; Distributor Quick Links</span>
          </em>
       </a>
     </li>
 </ul>

I tried adding a .quick-links em:active... but that doesn't maintain it. I know there is a way to keep the icon blue while in the active state, I just need a little help to understand what that is.

Thanks!