רשימה ניסתרת

אני צריכה כאשר אני עומדת על קישור שתיפתח לי רשימת קישורים נוספת.

עשיתי דף CSS עם קישור ל HTML וזה לא עובד-

דף ה HTML

<div id="menu">
        <ul class="first">    
            <li><a href="#">דף הבית</a></li>        
            <li class="submenu"><a href="#">שרות</a>        
                <ul class="second">            
                    <li><a href="#">טלויזיות</a></li>        
                    <li><a href="#">מוצרים לבנים</a></li>
                    <li><a href="#">מוצרים קטנים</a></li>
                </ul>
            </li>
            <li><a href="#">אודות</a></li>
                </ul>
            </li>
        </ul>
    </div>


דף CSS-


<style>

        div#menu ul ul {
            position: absolute;
            display: none;
                    }

        div#menu ul.first li.submenu:hover ul.second,
        div#menu ul.second li.submenu:hover ul.third
        {
            display: block;
        }


</style>

תודה מראש