Actually I could not let it go. This works and you can see a sample of it here -

http://temp.idano.net/

Here is the modified CSS -

#navigation{
background:url(images/nav.jpg);
}

#navigation ul
{
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

#navigation ul li {
display: inline;
line-height:44px;
}

#navigation ul li a
{
text-decoration: none;
padding: 15px 1em;
color: #fff;
/*text-transform:uppercase;*/
font-size:12px;
letter-spacing:1px;
font-weight:bold;
}

#navigation ul li a:hover
{
color: #fee202;
background:url(images/nav_hover.jpg) bottom center;
}

It wraps to the second line and is centered.

Dan