[Nour]

thankssssssss
it works very well

I need to add a drop down menu to the header it's html css java script
http://www.prestigedentalproducts.com/dropdown/dropdown.html

here is the code

<style type="text/css" media="screen"><!--#sddm
{ margin: 0;
padding: 0;
z-index: 30}

#sddm li
{ margin: 0;
padding: 0;
list-style: none;
float: left;
font: bold 11px arial}

#sddm li a
{ display: block;
margin: 0 1px 0 0;
padding: 4px 10px;
width: 110px;
background: #476076;
color: #fff;
text-align: center;
text-decoration: none}

#sddm li a:hover
{ background: #c2c2c2}

#sddm div
{ position: absolute;
visibility: hidden;
margin: 0;
padding: 0;
background: #eaebd8;
border: solid 1px #476076}

#sddm div a
{ position: relative;
display: block;
margin: 0;
padding: 5px 10px;
width: auto;
white-space: nowrap;
text-align: left;
text-decoration: none;
background: #eaebd8;
color: #476076;
font: 11px arial}

#sddm div a:hover
{ background: #476076;
color: #fff}
--></style>
<script type="text/javascript"><!--
var timeout = 500;
var closetimer = 0;
var ddmenuitem = 0;

// open hidden layer
function mopen(id)
{
// cancel close timer
mcancelclosetime();

// close old layer
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';

// get new layer and show it
ddmenuitem = document.getElementById(id);
ddmenuitem.style.visibility = 'visible';

}
// close showed layer
function mclose()
{
if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
}

// go close timer
function mclosetime()
{
closetimer = window.setTimeout(mclose, timeout);
}

// cancel close timer
function mcancelclosetime()
{
if(closetimer)
{
window.clearTimeout(closetimer);
closetimer = null;
}
}

// close layer when click-out
document.onclick = mclose;

//-->
</script>







<div align="center">
<ul id="sddm">
<li><a href="#" onmouseover="mopen('')" onmouseout="mclosetime()">home</a>
<li><a href="#" onmouseover="mopen('m2')" onmouseout="mclosetime()">Supplies</a>
<div id="m2" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
<a href="#">Browse Catalog</a> <a href="#">Search</a> <a href="#">New Products</a></div>
<li><a href="#" onmouseover="mopen('m3')" onmouseout="mclosetime()">Specials</a>
<div id="m3" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
<a href="#">Our Specials</a> <a href="#">Manufacturer's Promotions</a> <a href="#">Equipment Specials</a></div>
<li><a href="#" onmouseover="mopen('m4')" onmouseout="mclosetime()">Equipment</a>
<div id="m4" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
<a href="#">Large Equipment</a> <a href="#">Small Equipment</a> <a href="#">Handpieces</a> <a href="#">Hi-Tech Dentistry</a> <a href="#">Equipment Specials</a></div>
<li><a href="#" onmouseover="mopen('m5')" onmouseout="mclosetime()">Services</a>
<div id="m5" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
<a href="#">Financial Services</a></div>
<li><a href="#" onmouseover="mopen('m6')" onmouseout="mclosetime()">Customers</a>
<div id="m6" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
<a href="#">Your Account</a> <a href="#">Customers Info</a> <a href="#">Online Bill Payment</a> <a href="#">New Customers</a></div>
<li><a href="#" onmouseover="mopen('m7')" onmouseout="mclosetime()">Company</a>
<div id="m7" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
<a href="#">About Us</a> <a href="#">Contact Us</a> <a href="#">Return Policy</a></div>

</ul>
</div>
<div style="clear:both" align="center">
</div>

when I add this to any template it will not read the css and the java script

thank you for the help