la hoja de estilos.css no hace caso en google chrome Tema 6

Muy buenas , antes de nada felicitaros por la web y lo instructiva que es, muchas gracias por crear webs de este tipo.

En la lección sexta del curso paso a paso en la Seccion "Corregir Fallos" nos enseñáis a que en firex y en internet explore se corrigan los desplazamientos del menu horizontal poniendo en la hoja css en navegacion ul 60px. Eso es cierto. Pero desde que llegue al apartado Enlaces de Menu mi hoja de css no responde a las ordenes en Google Chrome y mi web se ve igual de mal q se veia en el firex antes de poner el 60px.¿Que puedo hacer?
Os dejo direcion de web y copia de css y de html.
Gracias de antemano.

http://duendeeuropa.onlinewebshop.net/index.2.html

* {text-indent:0px ; margin:0px ; padding:0px ; border: 0px}
p {text-align: justify}
h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
body {text-align: center}
#global {width:800px ; margin: 4px auto }
#curva-superior { background-image: url(cosas/curva-superiord.gif) ; background-repeat: no-repeat ; width: 800px ; height: 12px ; overflow: hidden}
#cabecera {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid ; height:85px}
#logotipo {width:280px ; float:left}
#publicidad {width:518px ; float:right ; margin-top:25px}
#navegacion {background-color: gray ; border:black 1px solid ; height:20px}
#navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px}
#navegacion ul {margin-left: 60px}
#contenido {background-color: orange ; border-left: black 1px solid ; border-right: black 1px solid}
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
#menu {width: 150px ; float:left ; text-align:left ; margin-right:10px ; margin:3px 10px 3px 3px ; background-image: url(cosas/menu-parte-inferior1.gif) ;background-position: bottom ; padding-bottom:5px}
#menu li {list-style:none ; margin: 4px 8px 4px 6px}
#menu h1 {text-decoration:none ; font-size:12px ; background-image: url(cosas/menu-parte-superior1.gif) ; padding-top:12px}
#pie {border-left: black 1px solid ; border-right: black 1px solid ; border-top: black 1px solid ; height:65px}
#pie li {list-style:none ; font-size:12px}
#pieuno {float:left ; width:150px}
#piedos {float:left ; width:498px}
#pietres {float:left ; width:150px}
#curva-inferior { background-image: url(cosas/curva-inferiord.gif) ; background-repeat: no-repeat ; width: 800px ; height: 12px ; overflow: hidden}
a {color: brown ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color:red ; text-decoration:underline ; background-color: silver}
a:active {}
#pie a {color: blue ; text-decoration:none ; display: block}
#pie a:link {}
#pie a:visited {}
#pie a:hover {color: black ; text-decoration:underline ; background-color: white}
#pie a:active {color:black}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color:white}
#logotipo a:active {}

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>Duende Europa</title>
<link rel="stylesheet" href="estilos-2.css" type="text/css" media="all">
</head>
<body>
<div id="global">

<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo">[contenido no disponible]</div>
<div id="publicidad">Bienvenidos a mi Web</div>
</div>
<div id="navegacion"><ul>
  • Portada
  • Duende
  • Europa
  • Constitucion
  • Tratados
  • Foro
  • Descargas</div>

    <div id="contenido"><div id="menu"><ul><h1>Titulo de Sección 1</h1>
  • Enlace 1
  • Enlace 2
  • Enlace 3
  • Enlace 4</div><h1>Saludos y Bienvenido/a a Duende Europa</h1>

    XXXX XXXXX xxxxxx xxxx,xxxx.xxxxx.XXXXX....XXXXX XXXxxxxx.xxx xxx xxxxx xx xxxxxx.XXXX ccc cccc ccccc cccc ccc ccc ccc c c c cccccccccc cccc</p><h2>XXXXXXXXXXXXXXXXXX</h2>

    XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</p>

    XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</p> </div>

    <div id="pie"><div id="pieuno"><ul>
  • Foro Ejemplo
  • ContactosNos Enlazan</div><div id="piedos">pie dos</div><div id="pietres"><ul>
  • Directorio
  • TopSite
  • Mapa de la Web</div>
    </div>

    <div id="curva-inferior"></div>
    </div>





    </body>
    </html>
  • Quisiera agradecer lo mucho que he aprendido en el curso paso a paso a los creadores de esta web.

    Ya terminé el Curso aun que mi web está aun en construcción y poco a poco la iré mejorando. Antes en Google Chrome no se veia bien pero me e dado cuenta que era por que los cambios q hice en html tardaban mas en ponerse en ese buscador que en los otros. Os dejo lo que tengo echo hasta ahora para que la echeis un vistazo y tener en cuenta todas vuestras opiniones.
    Vuestro enlace ya está puesto como pagina amiga en primer lugar y ahi permanecerá siempre.

    http://duendeeuropa.onlinewebshop.net/

    Os animo a que continuéis con el curso paso a paso. A los q no nos podemos permitir una carera como diseñadores de webs esta pagina vuestra nos biene de maravilla .Yo al menos e disfrutado mucho con el curso y en breves echaré un vistazo al resto de los apartados q teneis.
    Muchas gracias a todo vuestro equipo.

    Jose Angel Garcia Garcia