nav bar css 2

    <div class="w3-top">
        <div class="w3-bar w3-red w3-card w3-left-align w3-large">
            <a class="w3-bar-item w3-button w3-hide-medium w3-hide-large w3-right w3-padding-large w3-hover-white w3-large w3-red"
                href="javascript:void(0);" onclick="toggleNav()" title="Toggle Navigation Menu"><i
                    class="fa fa-bars"></i></a> <a href="#"
                class="w3-bar-item w3-button w3-padding-large w3-white">Home</a>
            <a href="/math-quiz" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white">Math
                Quiz</a>
            <a href="/games/dice-slots" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white">Dice
                Slots</a>
<a href="/reddit-compose" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white">Reddit Composer</a>
        </div>
        <!-- Navbar on small screens -->
        <div id="navDemo" class="w3-bar-block w3-white w3-hide w3-hide-large w3-hide-medium w3-large">
            <a href="/math-quiz" class="w3-bar-item w3-button w3-padding-large">Math Quiz</a>
            <a href="/games/dice-slots" class="w3-bar-item w3-button w3-padding-large">Dice Slots</a>
            <a href="/games/duck-game" class="w3-bar-item w3-button w3-padding-large">Duck Game</a>         
             <a href="/reddit-compose" class="w3-bar-item w3-button w3-padding-large">Reddit Composer</a>
        </div>
    </div>
    <!-- Header -->
    <header class="w3-container w3-light-grey w3-center" style="padding:64px 16px">
        <img src=/images/logo.png alt="" />
        <h1 class=upper>Welcome to my website</h1>
        <h4>Find me on <a target="_blank" href="https://facebook.com/mcjoe21com"><i
                class="fa fa-facebook-official w3-hover-opacity"></i></a> and on <a target="_blank"
            href="https://github.com/mcjoe21"><i class="fa fa-github w3-hover-opacity"></i></a></h4>
    </header>