css - 最小/最大基礎 CSS UI の問題

Question

Foundation を 1024 で動作するように変更しようとしていますが、動作していません..

    <nav class="top-bar">

    <ul>
    <li class="name"><a href="#homepage"><img src="images/logo-new.png" alt="Logo"></a></li>
    </ul>

    <section class="hide-for-medium-up topnav">
    <ul class="right">
    <li><a href="#homepage">Home</a></li>
    <li><a href="#our-team">Our Team</a></li>
    <li><a href="#about-us">About Us</a></li>
    <li><a href="#services">Projects</a></li>
    <li><a href="#news">News</a></li>
    <!-- <li><a href="#portfolio">Portfolio</a></li> -->

    <li><a href="#contact">Contact</a></li>
    </ul>
    </section>

    <select class="responsive-nav show-for-small" onChange="moveTo(this.value)" onFocus="moveTo(this.value)">
    <option value="" selected="">Main Navigation</option>
    <option value="#homepage">Home</option>
    <option value="#about-us">About Us</option>
    <option value="#our-team">Our Team</option>
    <option value="#news">News</option>
    <!-- <li><a href="#portfolio">Portfolio</a></li> -->
    <option value="#services">Projects</option>
    <option value="#contact">Contact</option>
    <option value="#" >Facebook</option>
    <option value="#">Twitter</option>
    </select>
    </nav>

そしてCSS

    .top-bar ul > li a:not(.button) {
        color: #FFFFFF;
        display: block;
        font-family: 'Raleway', sans-serif;
        font-size: 14px;
        font-weight: 400;
        height: 85px;
        line-height: 85px;
        padding: 0 15px;
        text-decoration: none;
        text-transform: none;
        transition: all 0.3s ease-in-out 0s;
    }

    .top-bar ul > li:not(.name):hover, .top-bar ul > li:not(.name).active, .top-bar ul > li:not(.name):focus {
        background: #012f48;
        transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out; /* Firefox 4 */
        -webkit-transition: all 0.3s ease-in-out; /* Safari and Chrome */
        -o-transition: all 0.3s ease-in-out; /* Opera */
    }
    .top-bar ul > li:not(.name):hover a, .top-bar ul > li:not(.name).active a, .top-bar ul > li:not(.name):focus a {
        color: #fff;
        transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out; /* Firefox 4 */
        -webkit-transition: all 0.3s ease-in-out; /* Safari and Chrome */
        -o-transition: all 0.3s ease-in-out; /* Opera */
    }

私のサイトは大画面で正常に動作しますが、1024 で NAV を表示したいのです。