Cacher is the code snippet organizer for pro developers

ul {
  list-style: none;
  padding: 0;
  margin: 0;
  background: #1bc2a2;
  li {
    position: relative;
    float: left;
    background: #1bc2a2;
    a {
      display: block;
      padding: 1em;
      text-decoration: none;
      white-space: nowrap;
      color: #fff;
      &:hover {
        background: #2c3e50;
      }
    }
  }
}

li ul {
  display: none;
  position: absolute;
}

li:hover > ul {
  display: block;
}

li:hover li {
  float: none;
}

li:hover a {
  background: #1bc2a2;
}

li:hover li a:hover {
  background: #2c3e50;
}

ul ul ul {
  left: 100%;
  top: 0;
}

ul:before,
ul:after {
  content: " ";
  display: table;
}

ul:after { clear: both; }

html
  body
    ul
      li
        a(href='#') Home
      li
        a(href='#') Front End Design
        ul
          li
            a(href='#') HTML
          li
            a(href='#') CSS
            ul
              li
                a(href='#') Resets
              li
                a(href='#') Grids
              li
                a(href='#') Frameworks
          li
            a(href='#') JavaScript
            ul
              li
                a(href='#') Ajax
              li
                a(href='#') jQuery
      li
        a(href='#') WordPress Development
        ul
          li
            a(href='#') Themes
          li
            a(href='#') Plugins
          li
            a(href='#') Custom Post Types
            ul
              li
                a(href='#') Portfolios
              li
                a(href='#') Testimonials
          li
            a(href='#') Options
      li
        a(href='#') About Us