Menu - Horizontal

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<title>Menu - Horizontal</title>

<meta name="created" content="Mon, 22 Feb 2010 10:08:24 GMT">
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<meta name="description" content="">
<meta name="keywords" content="">
<style type="text/css">
* { margin: 0; padding: 0; border: 0; }

body {
background: #fff;
}

div#header01 {
width: 950px;
height: 272px;
margin: 0 auto;
/* background: url(header_image.png) no-repeat center scroll; */
}

div#menu_wrap {
width: 56%;
height: 48px;
margin: 0 auto;
border: 0 solid #f00; /* layout only */
}

#menu {
position: relative;
list-style: none;
line-height: 45px;
display: inline-block;
z-index: 1000;
text-align: center;
color: #fff;
}

#menu a {
color: #fff;
text-decoration: none;
}

#menu > li {
position: relative;
float: left;
padding: 0 10px;
background: #172322;
cursor: pointer;
}

#menu > li a:hover { color: #b0d730; }

#menu .logo {
background: transparent;
}

/* sub-menus*/
#menu ul {
display: block;
display: inline;
}

#menu li ul {
position: absolute;
left: -30px;
top: 0;
margin-top: 45px;
width: 150px;
line-height: 16px;
background: #172322;
color: #0395CC;
/* for IE */ display: none;
}

#menu li:hover ul { display: block; }

#menu li ul li {
display: block;
margin: 5px 15px;
padding: 5px 0;
border-top: 1px dotted #606060;
list-style-type: none;
}

#menu li ul li:first-child { border-top: none; }

#menu li ul li a { display: block; color: #0395cc; }

#menu li ul li a:hover { color:#7fcdfe; }

/* main submenu */
#menu #main {
left: 8px;
top: -8px;
background: #7cb7e3;
color: #fff;
z-index: 999;
}
</style>

<!--[if IE]>
<style type="text/css">
body {
font-size: 8pt;
}
</style>
<![endif]-->
</head>
<body>
<!--[if IE]>
<p style="color: #f00; font-size: 12pt; margin: 1%; text-align: center;">Caution! You are using Internet Explorer. Internet Explorer is not compatible with our website. Please use another browser.</p>
<![endif]-->

<div id="header01"></div>

<div id="menu_wrap">
<!-- Site navigation menu -->
<ul id="menu">
<li class="logo"><img style="width: 157px; height: 46px;" src="http://PayneLessDesigns.com/imgs/lorem.gif" alt="Logo">

    <ul id="main">
    <li>Welcome to <b>PayneLess Designs</b> website!</li>
    </ul>

</li>

<li><a href="index.html" title="Home">Home</a></li>

<li><a href="#nogo" title="Main One">Main One</a>

    <ul id="main_one">
    <li><a href="*.html" title="Sub One">Sub One</a></li>
    <li><a href="*.html" title="Sub Two">Sub Two</a></li>
    <li><a href="*.html" title="Sub Three">Sub Three</a></li>
    <li><a href="*.html" title="Sub Four">Sub Four</a></li>
    <li><a href="*.html" title="Sub Five">Sub Five</a></li>
    <li><a href="*.html" title="Sub Six">Sub Six</a></li>
    <li><a href="*.html" title="Sub Seven">Sub Seven</a></li>
    </ul>

</li>

<li><a href="#nogo" title="Product Lines">Main Two</a>

    <ul id="main_two">
    <li><a href="*.html" title="Sub One">Sub One</a></li>
    <li><a href="*.html" title="Sub Two">Sub Two</a></li>
    <li><a href="*.html" title="Sub Three">Sub Three</a></li>
    <li><a href="*.html" title="Sub Four">Sub Four</a></li>
    <li><a href="*.html" title="Sub Five">Sub Five</a></li>
    <li><a href="*.html" title="Sub Six">Sub Six</a></li>
    <li><a href="*.html" title="Sub Seven">Sub Seven</a></li>
    </ul>

</li>

<li><a href="*.html" title="About Us">Main Three</a></li>

<li><a href="gallery.html" title="Photo Galleries">Photo Galleries</a></li>

<li><a href="site-map.html" title="Site Map">Site Map</a></li>

<li><a href="contact.html" title="Contact Us">Contact Us</a></li>
</ul>
</div>
</body></html>