<div class="row">
        <div class="large-12 column">
            <div class="contain-to-grid sticky">
                <nav class="top-bar" data-topbar role="navigation">
                    <ul class="title-area">
                        <li class="name">
                          <h1><a href="#" style="float:left">TTTB</a></h1>
                        </li>
                         <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
                        <li class="toggle-topbar menu-icon"><a href="#"><span></span></a></li>
                    </ul>

                    <section class="top-bar-section">
                    <!-- Right Nav Section -->
                    <ul class="right">
                        <li class="active"><a href="index.html">Home</a></li>
                        <li class="divider"></li>
                        <li class="has-dropdown">
        <a href="blank.html">Tests</a>
        <ul class="dropdown">
          <li><a href="#">Why Take Our Tests?</a></li>
          <li><a href="#">Test Dificulties Explained</a></li>
        </ul>
      </li>

                        <li class="divider"></li>
                    <li><a href="#">News</a></li>
                        <li class="divider"></li>
                    <li><a href="#">Contact</a></li>
                        <li class="divider"></li>
                    <li class="has-form"><a href=# data-reveal-id="signInModal" class="small success button">Log In</a></li>

                    <li class="has-form"><a href=# data-reveal-id="signUpModal" class="small alert button">Sign Up</a></li>
                    </ul>

                    <!-- Left Nav Section -->
                    <ul class="left">
                      <li><a href="#"></a></li>
                    </ul>
                    </section>
                </nav>
            </div>
        </div>
    </div>