[CSS] une erreur dans un script...

Bonsoir tout le monde, j'ai écris un script pour mon site, mais l'apparence de rend pas comme je le voudrais. J'ai donc fait une erreur, mais étant nouveau dans le domaine, je n'arrive vraiment a trouver la solution, ni même ou chercher...

voila le soucis, dans une balise "'<header>, j'ai 1 image, 1 titre en <h1> et un autre en <h1>, est ça j'ai une liste de puce en <ul>... ce qui devrait donner ça :


image
titre en h1
tire en h2 puce puce puce puce
________________________________________________________________________

mais au lieu de ça, je me retrouve avec ça


image
titre en h1
tire en h2
puce puce puce puce
________________________________________________________________________

C'est a dire que la ligne de puce se retrouve un niveau en dessous du titre h2, c'est ça que je n'arrive pas a modifier. je met les code a la suite.

html :
<div id="bloc_page">
<header>
<div id="titre_principal">
<img src="cours/zozor_logo.png" alt="Logo de Zozor" id="logo" />
<h1>Zozor</h1>
<h2>Carnets de voyage</h2>
</div>

<nav>
<ul>
<li><a href="#">Accueil</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">CV</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</header>

css:
/* Header */
header
{
background: url('cours/separateur.png') repeat-x bottom;
}

#titre_principal
{
display: inline-block;
}

header h1
{
font-family: BallparkWeiner, serif;
font-size: 2.5em;
font-weight: normal;
}

#logo, header h1 /* logo= le nom de l'image appelé, il faut toujours utiliser un # pour un appeler une image ! */
{
display: inline-block; /* permet de transformer un block en un in-line*/
margin-bottom: 5px; /* determine la marge du block en bas de ce memme block */
}

header h2 /* h2 dans la section header */
{
font-family: Dayrom, serif;
font-size: 1.1em;
margin-top: 5px;
font-weight: normal;
}

/* Navigation */

nav
{
display: inline-block;
width: 740px; /* modifie la largeur du bloc */
text-align: right;
}

nav ul
{
list-style-type: none; /* permet de retirer l'image ronde des puce */
}

nav li
{
display: inline-block; /* permet de placer les blocks cote a cote */
padding-top : 1px;
margin-right: 15px; /* modifie la marge droite de l'attribut "li" */
}

nav a
{
font-size: 1.3em;
color: #181818;
text-decoration: none;
}


merci d'avance de m'aider...

Hianni