CSS menus déroulants avec flyouts

<style>
#nav {
    position:absolute;
    top:127px;
    left:3px;
    margin:0;
    padding:0;
    list-style:none;
    font-size:13px;
    height:23px;
    visibility: visible;
}
#nav li {
    float:left;
    background:url(../images/bullet.gif) no-repeat 0 4px;
    padding:0 0 0 13px;
    margin:0 0 0 41px;
    display:inline;
    position:relative;
    height:23px;
}
#nav a {
    color:#0169a3;
    text-decoration:none;
}
#nav li ul a {
    display:block;
    width:200px;
}
#nav li ul {
    margin:0;
    padding:0;
    list-style:none;
    width:205px;
    position:absolute;
    top:22px;
    left:0;
    display:none;
    background:#e2e2e2;
    text-align:left;
    padding:0;
    /* border: 2px #fff solid; */
  visibility: visible;
}
#nav ul li {
    background:none;
    margin:0;
    padding:4px 8px 4px 8px;
    float:left;
    width:189px;
    line-height:20px;
}
#nav ul li:hover, #nav ul li.hover {
    background:#027cc5;
    border: 0px #fff solid;
}
#nav ul li:hover a, #nav ul li.hover a {
    color:#f2f2f2;
}
#nav li:hover ul, #nav li.hover ul {
    display:block;
}
#nav ul li ul li {
    margin:0;
    padding:0;
    list-style:none;
    width:205px;
    position:absolute;
    border:none;
    left: 205px;
    background:#e2e2e2;
}
</style>

<ul id="nav">
 <li><a href="about-lanequinn.html">About Lane Quinn</a>
  <ul>
   <li><a href="corporate-profile.html">Corporate Profile</a></li>
   <li><a href="why-lane-quinn.html">Why Lane Quinn?</a></li>
   <li><a href="Presidents-message.html">President's Message</a></li>
   <li><a href="management-team.html">Management Team</a></li>
  </ul>
 </li>
 <li><a href="employee-benefit-services.html">Corporate Services</a>
  <ul>
   <li><a href="employee-benefits.html">Employee Benefits</a>
    <ul>
     <li><a href="health-care-spending-account.html">Health Care Spending Account</a></li>
     <li><a href="group-critical-illness-lnsurance.html">Group Critical Illness Insurance</a></li>
     <li><a href="best-doctors-elite-diagnostic-imaging-service.html">Best Doctors Elite Diagnostic Imaging Service</a></li>
     <li><a href="employee-and-family-assistance-program.html">Employee and Family Assistance Program</a></li>
     <li><a href="group-retirement-programs.html">Group Retirement Programs (IPP, Group RSPS, DPSP, RPP, DC, DB)</a></li>
    </ul>
   </li>
   <li><a href="#">Executive Top-up Programs</a>
    <ul>
     <li><a href="critical-illness-insurance.html">Critical Illness Insurance</a> </li>
     <li><a href="disability-top-up.html">Disability Top-up</a> </li>
     <li><a href="private-health-services.html">Private Health Services (HCSA)</a> </li>
    </ul>
   </li>
   <li><a href="#">Individual Products</a>
    <ul>
     <li><a href="critical-illness-insurance.html">Critical Illness Insurance</a></li>
     <li><a href="life-insurance.html">Life Insurance</a> </li>
     <li><a href="key-man-insurance">Key-Man Insurance</a> </li>
     <li><a href="disability-insurance.html">Disability Insurance</a> </li>
     <li><a href="health-and-dental-insurance">Health and Dental Insurance</a></li>
     <li><a href="travel-insurance.html">Travel Insurance</a> </li>
     <li><a href="long-term-care-insurance.html">Long Term Care Insurance</a> </li>
     <li><a href="medical-access.html">Medical Access</a> </li>
     <li><a href="buy-sell-Insurance.html">Buy-Sell Insurance</a> </li>
    </ul>
   </li>
   <li><a href="#">International Coverage</a>
    <ul>
     <li><a href="individualtravel.html">Individual Travel</a> </li>
     <li><a href="group-travel.html">Group Travel</a> </li>
     <li><a href="inpatriate-coverage.html">Inpatriate Coverage (New Canadian)</a> </li>
     <li><a href="expatriate-coverage.html">Expatriate Coverage</a> </li>
     <li><a href="family-coverage.html">Family Coverage</a> </li>
    </ul>
   </li>
   <li><a href="retirement-programs.html">Retirement Programs</a></li>
  </ul>
 </li>
 <li> <a href="#">Affiliated Services</a>
  <ul>
   <li><a href="our-affiliates">Our Affiliates</a></li>
   <li><a href="estate-planning.html">Estate Planning</a></li>
   <li><a href="executive-compensation.html">Executive Compensation</a></li>
   <li><a href="wealth-strategy.html">Wealth Strategy</a></li>
  </ul>
 </li>
 <li><a href="employee-benefit-solutions.html">Innovative Solutions</a>
  <ul>
   <li><a href="critical-illness-insurance.html">Critical Illness Insurance</a></li>
   <li><a href="travel-insurance.html">Travel Insurance</a></li>
   <li><a href="best-doctor-diagnostic.html">Best Doctor Diagnostic</a></li>
   <li><a href="employee-assistance-programs.html">Employee Assistance Programs</a></li>
   <li><a href="exective-disability-programs.html">Executive Disability Programs</a></li>
   <li><a href="health-care-spending-accounts.html">Health Care Spending Accounts</a></li>
  </ul>
 </li>
 <li><a href="benefit-resources.html">Resources</a>
  <ul>
   <li><a href="request-travel-insurance.html">Request Travel Insurance</a></li>
   <li><a href="individual-health-dental-insurance-plans.html">Health &amp; Dental Inurance Plans</a></li>
   <li><a href="helpful-links.html">Helpful Links</a></li>
  </ul>
 </li>
 <li><a href="contact-lanequinn.html">Contact Us</a></li>
</ul>