[CSS]Menu vertical html/css/javascript..help!

Bonjour,

J'ai copier un super script javascript, avec un petit code html et css...
Par la suite je l'ai modifier selon mes besoins, mais je buche sur un détail depuis 2 soirs !!!

Le menu ressemble a ca:
Menu
Test
Par ici
Forum

Lors du survol, la couleur change et lors d'un clic, le menu se déroule, comme ca:
Menu
Test
test 1
test 2
test 3
Par ici
Forum

Mon but est que le 1er niveaux soit d'une taille et le sous-menus d'une police plus petite...
J'ai reussi a modifier la police lors du survol, ou de tout le menu, mais pas du sous menu !!

Please need help !!!
Voila le code:

HTML (version un peu raccourcies, mais y'a l'essentiel !):
------------------------------------------------------------------------------------------------------------------------
<ul id="menu">
<li>Accueil</li>
<li>Forum
<ol>
<li>Blabla</li>
<li>Chatter</li>
<li>Parler</li>
</ol>
</li>
<li>Les test ici
<ol>
<li class="test">test1</li>
<li class="test">test2</li>
<li class="test">test3</li>
<li class="test">test4</li>
</ol>
</li>
</ul>
--------------------------------------------------------------------------------------------------------------------------
CSS:
--------------------------------------------------------------------------------------------------------------------------
ul#menu {
width: 165px;
list-style-type: none;
margin-left: 15px;
padding: 0;
}
ul#menu ol {
display: none;
text-align: left;
list-style-type: none;
margin-top: 0;
padding: 20px;
}
ul#menu li,
ul#menu a {
font-family: verdana, sans-serif;
font-size: 20px;
color: #88B326;
}
ul#menu li {
line-height: 25px;
}
ul#menu ol li {
border-bottom: none;
line-height: 15px;
}
ul#menu ol li:before {
content: "- ";
}
ul#menu a {
text-decoration: none;
outline: none;
}
ul#menu a:hover {
color: #093;
}
ul#menu a.active {
color: #88B326;
}
ul#menu .test {
font-size: 5px;
}
--------------------------------------------------------------------------------------------------------------------------

Merci beaucoup beaucoup beaucoup :)