Pure CSS Menu

HTML:
---------
<ul class="drop_menu">
 <li><a href='/'>Home</a></li>
 <li><a href='#'>Location</a>
  <ul class="drop_menu_level_1">
   <li>
    <a href='#'>Sub Link 1</a>
    <ul class="subsubmenu">
     <li><a href='#'>Sub sub Link 1</a></li>
     <li><a href='#'>Sub sub Link 2</a></li>
    </ul>
   </li>
   <li><a href='#'>Sub Link 2</a></li>
   <li>
    <a href='#'>Sub Link 3</a>
    <ul class="subsubmenu">
     <li><a href='#'>Sub sub Link 1</a></li>
     <li><a href='#'>Sub sub Link 2</a></li>
    </ul>
   </li>
  </ul>
 </li>
 <li><a href=''>Page 1</a></li>
 <li><a href=''>Page 2</a></li>
 <li><a href=''>Page 3</a></li>
</ul>
******************************************************************
css:
-----
/*ashique_menu*/
.drop_menu {
 background:#006699;
 padding:0;
 margin:0;
 list-style-type:none;
 height:auto;
 float: left;
 width: 100%;
}
.drop_menu li { float:left; }
.drop_menu li a {
 padding:9px 20px;
 display:block;
 color:#fff;
 text-decoration:none;
 font:12px arial, verdana, sans-serif;
}


/* Submenu */
.drop_menu ul.drop_menu_level_1 {
 position:absolute;
 left:-9999px;
 top:-9999px;
 list-style-type:none;
}
.drop_menu li:hover { position:relative; background:#aa1d05; }
.drop_menu li:hover ul.drop_menu_level_1 {
 left:0px;
 top:30px;
 background:#aa1d05;
 padding:0px;
}


.drop_menu li:hover ul.drop_menu_level_1 li a {
 padding:5px;
 display:block;
 width:168px;
 text-indent:15px;
 background-color:#aa1d05;
}
.drop_menu li:hover ul.drop_menu_level_1 li a:hover { background:#005555; }
/*sub sub menu*/
.drop_menu li ul.drop_menu_level_1 li ul.subsubmenu {
 position:absolute;
 left:-9999px;
 top:-9999px;
 list-style-type:none;
 display: none;
}
.drop_menu li ul.drop_menu_level_1 li:hover { position:relative; background:#aa1d05; }
.drop_menu li ul.drop_menu_level_1 li:hover ul.subsubmenu {
 left: 168px;
 top:0px;
 background:#aa1d05;
 padding:0px;
 display:block;
}