Square - navigation issue?

[Smokey]

I can't seem to properly add a new link to my navigation on the Square theme.....this is the link to my forum:

https://www.nucleusboards.net


my header template looks like this:

<div class="scrolltotop"><i class="fa fa-caret-up fa-2x"></i></div>

<div id="container">

    <div id="header">
        <div class="wrapper">
              <div class="logo"><div class="logo2"><i class="fa fa-cube fa-fw"></i></div> Nucleus</div>
              <div class="menu">
                  <ul>
                      <li><a href="{$mybb->settings['bburl']}/index.php"><i class="fa fa-comments fa-2x"></i><br />Index</a></li>
                      <li><a href="{$mybb->settings['bburl']}/search.php"><i class="fa fa-search fa-2x"></i><br />Search</a></li>
                      <li><a href="{$mybb->settings['bburl']}/memberlist.php"><i class="fa fa-users fa-2x"></i><br />Members</a></li>
                      <li><a href="{$mybb->settings['bburl']}/calendar.php"><i class="fa fa-calendar-o fa-2x"></i><br />Calendar</a></li>
                    <li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><i class="fa fa-question-circle fa-2x"></i><br />Help</a></li>
                    <li><a href="{$mybb->settings['bburl']}/arcade.php"><i class="fa fa-gamepad fa-2x"></i><br />Arcade</a></li>
                    <li><a href="{$mybb->settings['bburl']}/donate.php"><i class="fas fa-dollar-sign fa-2x"></i><br />Donate</a></li>
                  </ul>
              </div>
        </div>
    </div>
  
    <div id="panel">
          <div class="wrapper">
            <div class="news">
                <div class="announcements"><i class="fa fa-microphone fa-2x"></i></div>
                    <div class="automsj">
                        <ul>
                              <li class="quotes">Welcome to Nucleus</li>
                            <li class="quotes">We are a friendly community</li>
                              <li class="quotes">Why not join us to gain awesome member only benefits.</li>
                        </ul>
                    </div>
            </div>
            <div class="usersection">
                {$welcomeblock}
            </div>
        </div>
    </div>
      
        <div id="content">
            <div class="wrapper">
                  <br />
                  <navigation>
                {$pm_notice}{$naoardonate_notice}{$naoardonate_bar}
                {$remote_avatar_notice}
                {$remote_profile_picture_notice}{$bannedwarning}
                {$bbclosedwarning}
                {$unreadreports}{$myprofile_alertbar}
                {$pending_joinrequests}
                {$awaitingusers} <!-- BAM -->{$bam_announcements}<!-- /BAM -->
                <br />

However, as you can see I added a donate link but it appears on the next line... instead of next to the Arcade link.