I am trying to align the telephone and fax number so its on the same level as the group image on the left hand side. As you can see the image is on the same level as the navigation.

Also does anyone know how i can add any CSS so i can code the same look and feel as the PDF navigation?

Many Thanks for your help.

[CODE]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Home - MBI Pharma</title>
</head>


<style type="text/css">
body {
padding: 0;
margin: 0;
background: #ffffff url(img/unlicensed1.gif) no-repeat center top ;
color: #333333;

}

.headertitle
{
font-size:12px;
font:Arial, Helvetica, sans-serif;
}


.mid {
width: 960px;
margin:0 auto 0 auto;
}

#content {
width: 960px;
margin: 178px auto 0;
background: #fff;
/*border: solid 1px #ccc;*/
padding: 6px;

opacity:0.8;
filter:alpha(opacity=80); /* For IE8 and earlier */
}

h1 {
margin: 0;
padding: 0;
}

#logo
{
width:170px;
height:255px;
margin: 4px 20px 4px 0px;
}


#nav {
width: 960px;
background-color: #00AEEF;
}

#navigation
{
width: 910px;
height: 20px;
padding: 0 0 8px 0;
margin: 0;
}

#navigation ul
{
font-family: Arial, Verdana;
font-size: 14px;
margin: 0;
padding: 0;
list-style: none;
width: 100%;
}

ul li
{
display: block;
position:relative;
float: left;
width: 120px;
border-left: 3px solid #ffffff;
}

li ul
{
display: none;
}

ul li a, ul li .LinkButton
{
display: block;
text-decoration: none;
color: #ffffff;
padding: 5px 15px 5px 10px;
background: #00AEEF;
white-space: nowrap;
width: 100%;
}

ul li a:hover, ul li .LinkButton:hover
{
background: #00338D;
}

li:hover ul
{
display:block;
position: absolute;
}

li:hover li
{
float: none;
font-size: 11px;
width: 100%;
}

li:hover a, li:hover .LinkButton
{
background: #00ADD0;
width: 100%;

}

li:hover li a:hover, li:hover li .LinkButton:hover
{
background: #00338D;
}

.content
{
font-size:12px;
font-family:Verdana, Arial, Helvetica, sans-serif; color:#000000;

}

#contact

{
float:right;
width:210px;
height:50px;
font-size: 12px;
}



</style>



<body>


<div class="mid">

<div id="logo"><img src="img/logo.gif" /></div>
<div id="contact"><font color="#00ADD0" face="Verdana, Arial, Helvetica, sans-serif">Tel:</font>972-9-7719003 <br />
<font color="#00ADD0" face="Verdana, Arial, Helvetica, sans-serif">Fax:</font>972-9-7719990 <br />
<font color="#00ADD0" face="Verdana, Arial, Helvetica, sans-serif">Email:</font>info@mbipharma.il

</div>

<div id="nav">
<ul id="navigation">
<li><a href="home.html">Home</a></li>
<li><a href="profile.html">Profile</a></li>
<li><a href="partners.html">Partners</a></li>
<li><a href="products.html">Products</a></li>
<li><a href="contactus.html">Contact Us</a></li>
</ul>
</div>
</div>


<div id="content">
<font face="Geneva, Arial, Helvetica, sans-serif" size="2" color="00AEEF">
<b>About Us</b></font> <br /><br />

<div class="content">
Text goes here
<br /> <br />

Text goes here <br/> <br />

Text goes here
<ul class="content">
o Text goes here<br />
o Text goes here<br />
o Text goes here<br />
o Text goes here
</ul>



</div>


<p style="padding-bottom: 200px"> </p>
</div>


</body>

</html>

[CODE]


Thank you.