Wordpress custom nav issue, my eyes are tired

1

Hey, so I have been running into this issue incorporating a custom nav I built in photoshop. It’s super simple background image rollovers using CSS, but I am having trouble implementing into wordpress. This is a project I am doing for free, so no biggie on cross browser stuff etc. I just need a another set of eyes to check it and maybe point me in the right direction cause my brain is fried.

The site is:
http://seattlebikepolo.com

and here is my HTML/CSS, which the nav is located in the header.php file…
HTML -


<div id="wrapper">
    
    <div id="header">

        <div id="htitle">

            <h1 class="head-tag"><a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>
        </div>

        <div id="navmenu">
            
            <a href="" class="weekly-btn"></a>
            <a href="" class="tourneys-btn"></a>
            <a href="" class="gallery-btn"></a>
            <a href="" class="about-btn"></a>

        </div>
    </div>

CSS -



#navmenu{
    width: 550px;
    margin: 140px 10px 0;
    clear: left;
    height: 25px;
    /*border: 1px solid #7db407;*/
}


.weekly-btn    {
    
    background: url('http://seattlebikepolo.com/wp-content/themes/black-n-white/images/weekly-btn.gif') top left no-repeat;
    height: 21px;
    width: 86px;
    margin: 0 4px;
}

.weekly-btn:hover    {

    background: url('http://seattlebikepolo.com/wp-content/themes/black-n-white/images/weekly-btn.gif') bottom right no-repeat;

}

Any help or direction on how to get this looking right would be sweet. It’s not doing anything I want at the moment.

thanks.