sub-menu

style-v3.css

/* B:Secondary Navigation ---------------------------------------*/
.secondary-nav, .secondary-nav ul.dropdown  {
  background-color:#d2315d;
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.82, #d2315d), color-stop(0.96, #a7274a));
  background-image: -webkit-linear-gradient(bottom, #d2315d 82%, #a7274a 96%);
  background-image: -moz-linear-gradient(bottom, #d2315d 82%, #a7274a 96%);
  background-image: -ms-linear-gradient(bottom, #d2315d 82%, #a7274a 96%);
  background-image: -o-linear-gradient(bottom, #d2315d 82%, #a7274a 96%);
  background-image: linear-gradient(bottom, #d2315d 82%, #a7274a 96%);
  min-height:26px;
  font: 16px/1.2 'Share', Sans-serif;
  letter-spacing:-0.1px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
  }
.no-cssgradients .secondary-nav{ /* For Browsers with No CSS Gradient Support */
  background:url('../_images/back-secondary-nav.png') repeat-x; }

.secondary-nav ul {
  margin:0; padding:0; float:left; margin-top:10px; height:26px; list-style:none; }
.secondary-nav ul li {
  margin:0; padding:0; list-style:none; float:left; }
.secondary-nav ul li a {
  padding:9px 10px; color:#ffffff; text-decoration:none; text-transform:uppercase; }
.secondary-nav ul li a:hover {
  background-color:#595c5f;
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.82, #595c5f), color-stop(0.96, #3d3f42));
  background-image: -webkit-linear-gradient(bottom, #595c5f 82%, #3d3f42 96%);
  background-image: -moz-linear-gradient(bottom, #595c5f 82%, #3d3f42 96%);
  background-image: -ms-linear-gradient(bottom, #595c5f 82%, #3d3f42 96%);
  background-image: -o-linear-gradient(bottom, #595c5f 82%, #3d3f42 96%);
  background-image: linear-gradient(bottom, #595c5f 82%, #3d3f42 96%);
  color:#f0f0f0;
  position: relative; left:0;
}

  /* Dropdown for sub-menu within secondary sub-nav */

.secondary-nav ul.dropdown { position:absolute; left:-9999px; height: auto; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none;transition: none;}
.secondary-nav .dropdown li { float: none; width:150px; padding-top: 10px; padding-bottom: 10px; }
.secondary-nav ul li:hover > ul.dropdown { left:800px;  }
.secondary-nav .dropdown li:hover { background: #8E2844; }
.secondary-nav .dropdown li a:hover { background: none; }

sub-menu html

<div class="span19">
  <ul id="secondary-nav">
    <li><a href="/about-us.html">Company</a></li>
    <li><a href="/data-center-facilities/">Facilities</a></li>
    <li><a href="/operations-overview">Operations &amp; Support</a></li>
    <li><a href="/partners/">Partners</a></li>
    <li><a href="/news/">News</a></li>
    <li><a href="/blog/">Blog</a></li>
    <li>
      <a href="/knowledge-center">Knowledge Center</a>
        <ul class="dropdown">
          <li><a href="/resources/case-studies">Case Studies</a></li>
          <li><a href="/resources/whitepapers">Whitepapers</a></li>
          <li><a href="/video">Videos</a></li>
          <li><a href="/resources/articles">Articles</a></li>
          <li><a href="/webinar">Webinars</a></li>
          <li><a href="/resources/testimonials">Testimonials</a></li>
        </ul>
    </li>
    <li><a href="/careers/">Careers</a></li>
  </ul>
</div><!--e:span19-->