Help with flyout submenu

Hi first of all I’m a newbie with websites. A few years ago I created a website for our club from a template. I made a lot of changes to the template for the final result. What I now want to do is to create submenus for some of the items. I want to create 1level with 3 submenus for the senior and 1 level with 3 for junior cricket. It must be vertical flyout menus. I have searched hundreds of sites and tried to follow the instructions but I cannot get it right. I would really appreciate if somebody could advise me how to change the css and html to make the submenu.

The website http://www.heidelbergcc.co.za

Once again thank you !

The structure of the submenus is just nested lists.

So, you would need something along the lines of:

<ul>
<li>Item 1</li>
[COLOR="Red"]<li>[/COLOR]Item 2
    <ul>
    <li>Item 2.1</li>
    <li>Item 2.2</li>
    <li>Item 2.3</li>
</ul>[COLOR="Red"]</li>[/COLOR]
[COLOR="Blue"]<li>[/COLOR]Item 3
    <ul>
    <li>Item 3.1</li>
    <li>Item 3.2</li>
</ul>[COLOR="blue"]</li>[/COLOR]
</ul>

Notice how the sub-list is inside the <li>…</li>, colour-coded to make it more obvious!