CSS Navigation

    Hallo, ich habe folgendes Problem, und zwar habe ich eine Seite basierend auf HTML in die ich jetzt CSS einbauen soll, und zwar so das die Inline-Style Anweisungen in der HTML Datei nicht mehr verwendet werden, nun scheiter ich aber an der Navigation, kann mir da jemand helfen oder ist das garkeine Inline-Style Anweisungen?

    HTML File:


    <link rel="stylesheet" href="style.css" type="text/css">
    </head>

    <body bgcolor="#98B9CD">

    <table align="center" width="752" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td align="center" width="752" background="images/banner.jpg" height="83"><h1>Mein Logo </h1></td>
    </tr>
    </table>
    <!--Navigation-->
    <table height="25" align="center" width="752" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td><img src="images/navilinks.jpg" width="5" height="25" border="0" alt=""></td>
    <td height="25" background="images/button1.jpg" width="102"><div align="center" class="navi">&raquo;Startseite</div></td>
    <td><img src="images/zwischen1.jpg" width="25" height="25" border="0" alt=""></td>
    <td background="images/button2.jpg" width="103"><div align="center" class="navi"><a style="color:#FFFFFF" href="seite2.html">Link Nr. 2</a></div></td>
    <td><img src="images/zwischen2.jpg" width="25" height="25" border="0" alt=""></td>
    <td background="images/button3.jpg" width="102"><div align="center" class="navi"><a style="color:#FFFFFF" href="seite3.html">Link Nr. 3</a></div></td>
    <td><img src="images/zwischen3.jpg" width="25" height="25" border="0" alt=""></td>
    <td background="images/button4.jpg" width="103"><div align="center" class="navi"><a style="color:#FFFFFF" href="seite4.html">Link Nr. 4</a></div></td>
    <td><img src="images/zwischen4.jpg" width="25" height="25" border="0" alt=""></td>
    <td background="images/button5.jpg" width="103"><div align="center" class="navi"><a style="color:#FFFFFF" href="seite5.html">Link Nr. 5</a></div></td>
    <td><img src="images/zwischen5.jpg" width="25" height="25" border="0" alt=""></td>
    <td background="images/button6.jpg" width="103"><div align="center" class="navi"><a style="color:#FFFFFF" href="seite6.html">Link Nr. 6</a></div></td>
    <td><img src="images/navirechts.jpg" width="6" height="25" border="0" alt=""></td>
    </tr>
    </table>

    CSS File:

    body,td,div { color:#000000; font-family:verdana,arial,helvetica; font-size:10pt; }

    h1 { color:#FFFFFF; font-family:verdana,arial,helvetica; font-size:18pt; font-weight:bold; }
    h2 { color:#446D8C; font-family:verdana,arial,helvetica; font-size:14pt; font-weight:bold; }
    h3 { color:#909090; font-family:verdana,arial,helvetica; font-size:12pt; font-weight:bold; font-style:italic; }
    h4 { color:#98B9CD; font-family:verdana,arial,helvetica; font-size:11pt; font-weight:bold; font-style:italic; }
    h5 { color:#000000; font-family:verdana,arial,helvetica; font-size:10pt; font-weight:bold; }

    .navi { color:#ffffff; font-family:verdana,arial,helvetica; font-size:10pt; font-weight:bold;}

    a:link { color:#446D8C; text-decoration:none; }
    a:visited { color:#98B9CD; text-decoration:none; }
    a:active { color:#0068A0; text-decoration:none; }
    a:hover { color:#446D8C; text-decoration:underline; }

    BODY{
    scrollbar-face-color:#446D8C;
    scrollbar-arrow-color:#FFFFFF;
    scrollbar-track-color:#EAEAEA;
    scrollbar-shadow-color:#000000;
    scrollbar-highlight-color:#FFFFFF;
    scrollbar-3dlight-color:#A0A0A0;
    scrollbar-darkshadow-Color:#606060;
    }

    Danke im Vorraus