Mil gracias por la ayuda....
He cambiado todo el código y ahora tengo esto... mucho mejor, ¿verdad?
Código HTML:
<body>
<header>
<h1>XXXXXX</br>XXXXX</h1>
<address>XXXXX</br><a href="XXXXX" class="link1">XXXXX/a></address>
<nav>
<ul class="info">
<li><a href="hXXXXX" target="_blank" class="link1">XXXXX/a></li>
<li><a href="XXXXX" class="link1">XXXXX</a></li>
</ul>
</nav>
</header>
<section>
<nav>
<ul class="next">
<li><a href="XXXXX" class="link1">XXXXX</a> <span class="bar">|</span> <a href="XXXXX" title="Siguiente" class="link1">sig</a><li>
</ul>
</nav>
<article>
<h2 class="proyect">XXXXX</h2>
<h3>XXXXX</h3>
<h4>XXXXX/h4>
<h5>XXXXX</h5>
<p class="text">XXXXX</p>
<h5>Idea</h5>
<p class="text">XXXXX</p>
<h5>Vídeo web</h5>
<iframe src="XXXXXn></iframe>
<h5>Mecánica</h5>
<figure class="photo">
<img src="../images/p1.png" width="600" height="150"/>
</figure>
<h5>Pantallazos web</h5>
<figure class="photo">
<img src="../images/p2.png" width="600" height="940"/>
</figure>
<figure class="photo">
<img src="../images/p3.png" width="600" height="291"/>
</figure>
<figure class="photo">
<img src="../images/p4.png" width="600" height="639 "/>
</figure>
<h5>Pantallazos mail</h5>
<figure class="photo">
<img src="../images/p5.png" width="600" height="302"/>
</figure>
<h5></h5>
<figure class="photo">
<img src="../images/p6.png" width="600" height="196"/>
</figure>
<h5><a href="javascript:void(0)" id="signo1" onClick="showhide('colors1','signo0')" class="link3">Ver ficha</a> <span class="arrow">↓</span></h5>
<p class="text"><span id="colors1" style="display:none"><br/>
<b>Link proyecto</b><br/>
<a href="XXXXX" target="_blank" class="link2">XXXXX</a><br/>
<br/>
<b>XXXXX</b> XXXXX<br/>
<b>XXXXX</b> <a href="XXXXX" target="_blank" class="link2">XXXXX</a><br/>
<b>XXXXX</b> XXXXX<br/>
<b>XXXXX</b>XXXXX<br/>
<b>XXXXX</b> XXXXX<br/>
<b>XXXXX</b> XXXXX<br/>
<b>XXXXX</b> XXXXX<br/>
<br/>
<b>XXXXX</b><br/>
XXXXX<br/>
<br/>
<b>XXXXX</b><br/>
XXXXX<br/>
XXXXX</span></p>
</article>
<nav>
<ul class="top">
<li><a href="#top" class="link1">arriba</a><li>
</ul>
</nav>
<figure class="line">
<img src="../images_design/s1.png" width="600" height="6"/>
</figure>
</section>
<nav>
<div class="t1">
<div class="tt1off">
<img src="../thumbnail/tt1.png"/>
</div>
</div>
<div class="t2">
<div class="tt2">
<a href="trees.html"><img src="../thumbnail/tt2.png"/></a>
</div>
</div>
<div class="t3">
<div class="tt3">
<a href="gallos.html"><img src="../thumbnail/tt3.png"/></a>
</div>
</div>
<div class="t4">
<div class="tt4">
<a href="grillo.html"><img src="../thumbnail/tt4.png"/></a>
</div>
</div>
<div class="t5">
<div class="tt5">
<a href="cerveza.html"><img src="../thumbnail/tt5.png"/></a>
</div>
</div>
<div class="t6">
<div class="tt6">
<a href="deshielo.html"><img src="../thumbnail/tt6.png"/></a>
</div>
</div>
<div class="t7">
<div class="tt7">
<a href="latas.html"><img src="../thumbnail/tt7.png"/></a>
</div>
</div>
<div class="t8">
<div class="tt8">
<a href="monstruos.html"><img src="../thumbnail/tt8.png"/></a>
</div>
</div>
</nav>
<footer>©XXXXX</footer>
</body>
</html>