sub menu is messed up
 

hi there, i recently decided to transfer all my old dreamweaver html website to a more fast and flexible and automated wordpress plus atahualpa theme , everything is working really fine, the only thing that is giving me trouble is the menu ! i already saw on the forum that menu is quite an issue for many users. Im already a bit experienced with css but still it seems you guys coded the php working with css menu together in a way that it sort of changes automatically in more than one class. anyway , my website is nosham.com and what i want to achieve is to set a unique background for the whole set of buttons of the sub menu , kind of a div that wraps all the children and only keep the names and the hovering with color-text only (like my old menu here http://www.nosham.com/travels/travels.html and also change the sub menu font size in small ... the size of the sub menu is the same as the main nav bar now...
last thing , i would need to make all the background images transparent

here is my css insert so far , but i really got confused now, can you please give me some tips ?

i already removed the white arrow , but it seems that there is still that padding on the right , like a ghost of the arrow

div#menu1 ul.rMenu { background: url(/images/menu/nav-bg6alt.png); }

div#menu1 ul.rMenu li a:hover { background: url(/images/menu/nav-bg2.png); }

div#menu1 ul.rMenu li { background: none;}

div#menu1 ul.rMenu li.current_page_item > a:link,
div#menu1 ul.rMenu li.current_page_item > a:active,
div#menu1 ul.rMenu li.current_page_item > a:hover,
div#menu1 ul.rMenu li.current_page_item > a:visited { background: url(/images/menu/nav-bg2.png); }

div#menu1 ul.rMenu li:hover { background: none; }

div#menu1 ul.rMenu li li { background: url(/images/menu/nav-bg-sec.png); }

div#menu1 ul.rMenu li li a:hover { color: green; }


thanks a lot in advance if you can help : ) : )