Menu icon Foundation
Long drop down truncated

I need to offer a few ways to search for the same thing. To do that I need to test a new menu structure.
I was hoping for something like a mega menu but that's currently not possible.
I would prefer to keep the Dance Classes as one item vs. multiple drop down buttons.
I created a drop down with a lot of options for testing to determine which is used more.
Unfortunately the menu is truncated on small screens and you can't scroll to see the rest. See pic.
Live here: http://jerseycitydanceacademy.com/New/Boys.html

Suggestions?

Drop down

<nav class="top-bar" data-topbar>
  <section class="top-bar-section">
    <!-- Right Nav Section -->
      <ul class="right">
        <li class="divider"></li>
        <li class="has-dropdown">
          <a href="#">Classes</a>
          <ul class="dropdown">
            <li><label>By Dance Style</label></li>
            <li class="has-dropdown">
              <a href="#" class="">Early Childhood</a>
              <ul class="dropdown">
                <li><a href="#">Terrific Twos</a></li>
                <li><a href="#">Tiny Tots</a></li>
                <li><a href="#">Creative Movement</a></li>
    			<li><a href="#">Creative Stars</a></li>
                <li><a href="#">Rising Stars</a></li>
              </ul>
            </li>
            <li><a href="#">Ballet</a></li>
			<li><a href="#">Boys</a></li>	
			<li><a href="#">Contemporary</a></li>	
			<li><a href="#">Gymnastics</a></li>		
			<li><a href="#">Hip Hop</a></li>			
            <li><a href="#">Jazz</a></li>		
			<li><a href="#">Lyrical</a></li>
			<li><a href="#">Musical Theater</a></li>			
			<li><a href="#">Tap</a></li>
			<li><a href="#">Zumba</a></li>
            <li class="divider"></li>
            <li><label>By Age</label></li>
            <li><a href="#">2 Year Olds</a></li>
            <li><a href="#">3 Year Olds</a></li>
            <li><a href="#">4 Year Olds</a></li>
			<li><a href="#">5 Year Olds</a></li>
            <li><a href="#">6-7 Year Olds</a></li>
            <li><a href="#">8-10 Year Olds</a></li>
			<li><a href="#">11+ Year Olds</a></li>
            <li><a href="#">Adults</a></li>
            <li class="divider"></li>
			  <li><label>By Season</label></li>
            <li><a href="#">Fall</a></li>
            <li><a href="#">Winter</a></li>
            <li><a href="#">Spring</a></li>
			<li><a href="#">Summer</a></li>
            <li class="divider"></li>
            <li><a href="#">See all ?</a></li>
          </ul>
        </li>
        <li class="divider"></li>
        <li><a href="#">Main Item 2</a></li>
        <li class="divider"></li>
        <li class="has-dropdown">
          <a href="#">Main Item 3</a>
          <ul class="dropdown">
            <li><a href="#">Dropdown Option</a></li>
            <li><a href="#">Dropdown Option</a></li>
            <li><a href="#">Dropdown Option</a></li>
            <li class="divider"></li>
            <li><a href="#">See all ?</a></li>
          </ul>
        </li>
      </ul>
    </section>
  </nav>
</div>
            

         

Drop Down Menumega menu

I need to offer a few ways to search for the same thing. To do that I need to test a new menu structure.
I was hoping for something like a mega menu but that's currently not possible.
I would prefer to keep the Dance Classes as one item vs. multiple drop down buttons.
I created a drop down with a lot of options for testing to determine which is used more.
Unfortunately the menu is truncated on small screens and you can't scroll to see the rest. See pic.
Live here: http://jerseycitydanceacademy.com/New/Boys.html

Suggestions?

Drop down

<nav class="top-bar" data-topbar>
  <section class="top-bar-section">
    <!-- Right Nav Section -->
      <ul class="right">
        <li class="divider"></li>
        <li class="has-dropdown">
          <a href="#">Classes</a>
          <ul class="dropdown">
            <li><label>By Dance Style</label></li>
            <li class="has-dropdown">
              <a href="#" class="">Early Childhood</a>
              <ul class="dropdown">
                <li><a href="#">Terrific Twos</a></li>
                <li><a href="#">Tiny Tots</a></li>
                <li><a href="#">Creative Movement</a></li>
    			<li><a href="#">Creative Stars</a></li>
                <li><a href="#">Rising Stars</a></li>
              </ul>
            </li>
            <li><a href="#">Ballet</a></li>
			<li><a href="#">Boys</a></li>	
			<li><a href="#">Contemporary</a></li>	
			<li><a href="#">Gymnastics</a></li>		
			<li><a href="#">Hip Hop</a></li>			
            <li><a href="#">Jazz</a></li>		
			<li><a href="#">Lyrical</a></li>
			<li><a href="#">Musical Theater</a></li>			
			<li><a href="#">Tap</a></li>
			<li><a href="#">Zumba</a></li>
            <li class="divider"></li>
            <li><label>By Age</label></li>
            <li><a href="#">2 Year Olds</a></li>
            <li><a href="#">3 Year Olds</a></li>
            <li><a href="#">4 Year Olds</a></li>
			<li><a href="#">5 Year Olds</a></li>
            <li><a href="#">6-7 Year Olds</a></li>
            <li><a href="#">8-10 Year Olds</a></li>
			<li><a href="#">11+ Year Olds</a></li>
            <li><a href="#">Adults</a></li>
            <li class="divider"></li>
			  <li><label>By Season</label></li>
            <li><a href="#">Fall</a></li>
            <li><a href="#">Winter</a></li>
            <li><a href="#">Spring</a></li>
			<li><a href="#">Summer</a></li>
            <li class="divider"></li>
            <li><a href="#">See all ?</a></li>
          </ul>
        </li>
        <li class="divider"></li>
        <li><a href="#">Main Item 2</a></li>
        <li class="divider"></li>
        <li class="has-dropdown">
          <a href="#">Main Item 3</a>
          <ul class="dropdown">
            <li><a href="#">Dropdown Option</a></li>
            <li><a href="#">Dropdown Option</a></li>
            <li><a href="#">Dropdown Option</a></li>
            <li class="divider"></li>
            <li><a href="#">See all ?</a></li>
          </ul>
        </li>
      </ul>
    </section>
  </nav>
</div>