title: Second level nav get stalked for couple seconds on mouse out
body: <p>I'm using Foundation 6 for my website. I have a problem with top-bar. On mouse hover second level nav appears. However, it takes couple second for it to disappear on mouse out. It looks like it gets stalked. </p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;nav class="top-bar main-nav" id="top-bar-menu"&gt;
    &lt;div class="row main-nav"&gt;
      &lt;div class="top-bar-left"&gt;
        &lt;ul class="vertical medium-horizontal menu menu-items" data-responsive-menu="accordion medium-dropdown"&gt;
          &lt;li&gt;&lt;a href="#"&gt;Item 1&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Item 2&lt;/a&gt;
            &lt;ul class="menu vertical nested"&gt;
              &lt;li&gt;&lt;a href="#"&gt;Item 2A&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;Item 2B&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Item 3&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Item 4&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;  
    &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>.top-bar, .top-bar ul {background-color: #8d3895; padding-top: 0; padding-bottom: 0;}
  
  nav.main-nav .dropdown.menu .is-dropdown-submenu-parent.is-right-arrow &gt; a::after {border-style: none;}
  
  nav.main-nav .dropdown.menu .is-dropdown-submenu-parent a::after { 
    margin-left: 0;}
  
  nav.main-nav .dropdown.menu .is-dropdown-submenu-parent ul {margin-left:0;
    border-top:0; margin-top: 0; padding-left: 0; padding-right: 0; background: #fce2d1;}
  
  .dropdown.menu .submenu {min-width: 100%;}
  
  nav.main-nav .is-submenu-item.is-dropdown-submenu-item {padding-right: 0;}
  
  nav.main-nav.top-bar {padding:0; background-color: #8d3895;}
  
  nav div.top-bar-left {width: 95%;}
  
  nav.main-nav.top-bar ul li {
    text-align: center;} 
  
  .menu &gt; li:not(.menu-text) &gt; a {
    display: block;
    line-height: 1;
    padding: 0.7rem 0;}
  
  nav.main-nav.top-bar ul li a {
    font-family: Source Sans Pro;
    font-size: 1.35em;
    color: #ffffff;
    padding-right: 0.75em;}
  
  nav.main-nav.top-bar ul li a:hover {
    font-size: 1.35em;
    color: #4a8ac9;
    background-color: #ffffff;
    width: inherit;} 
  
  nav.main-nav.top-bar ul li ul li a:hover {
    font-size: 1.35em;
    color: #333333;
    background: #f68b1f;
    width: inherit;}
  
  /*Submenu items*/
  nav.main-nav.top-bar .is-active a {
    background-color: #ffffff;
    color: #4a8ac9;}
  
  div.search-bar {padding: 1em 0;}
  
  .top-bar input {width: auto!important;}
  </code></pre>