[SOLVED] Page Menu - text and background area have different sizes

Hi. I'm a total WP newbie who is trying to get a website up and working for a local non-profit by Thursday for a big event (gulp). I am having two main problems. My website address is: http://aahuganda.org/

1) On the Menu bar, I used the css:

ul.rMenu li {
margin-right: 30px;
}
/*reset for submenus*/
ul.rMenu li ul li {
margin-right: 0;
}

to space out the the top level items. I got this from http://forum.bytesforall.com/showthread.php?t=3338. Now there is a difference in size between the parts with text and the red background of the menu bar - the parts of the menu bar without text looks like it is a couple pixels smaller than the parts with text. This existed before I put in the CSS, as well (so I do not think they are linked). Any suggestions on how can I fix this?

2) I would like to put in a different color background (#999999 -grey) to show up on the sides of the main content areas (the filler areas). Do you know how I can set this up within wordpress?

And thanks to the designers and people who have been answering questions on the threads - I really like the template and the reading the past forums have been a big help when I have problems.