Trying to center my menu items

I’m trying to center the menu items on this website: https://www.panchogonzalez.com.

For some reason it won’t center. You can view the html source to see how I have my DIVs setup, and here is the CSS:

.nav{
margin:0 auto;
text-align:center;
width:941px; height:auto;
}

#category-list, #category-list ul {
margin:0; padding:0;
text-align: center;
list-style: none;
width: 900px;
}

I’ve tried everything I can think of, and searched the forums pretty good. Other people seem to have this issue but the same solution doesn’t work for me. If I remove the float:left in the “li” then I can see that the list is centered, but stacked. I want it to me a horizontal menu like it is now but centered on the page.

Any help I can get this would be really appreciated. Thanks.