<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark" style="z-index: 10;">
    <a class="navbar-brand" href="#"></a>

    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar"
      aria-controls="navbar" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>

    <div class="collapse navbar-collapse" id="navbar">
      <!-- left side -->
      <ul class="navbar-nav mr-auto">
        <li class="nav-item">
          <a class="nav-link" href="/">Top 100</a>
        </li>
        <li class="nav-item">
          <a id="button-backward" class="nav-link" href="/?page={{ prevPageNumber }}">Backward</a>
        </li>
        <li class="nav-item">
            <a id="button-forward" class="nav-link" href="/?page={{ nextPageNumber }}">Forward</a>
        </li>
        <li class="nav-item">
            <a id="button-forward" class="nav-link" href="/balance-tool">Balance Tool</a>
        </li>
      </ul>
      <ul class="navbar-nav">
<!--
        <li class="nav-item">
            <a class="navbar-brand hover-to-75 patreon" style="position: unset !important;" href="https://www.patreon.com/erlangen_sheppy">Support me</a>
	    </li>
-->
        <li class="nav-item right mr-2">
            <a class="nav-link" href="/rounds">Rounds</a>
        </li>  
        <li class="nav-item right">
            <input id="getPlayer" type="text" aria-label="search for player" class="mt-1"
                placeholder="search player...">
        </li>
        {{ findPlayer }}
        <!-- <li class="nav-item right">
            <input id="gotoRank"  type="number" aria-label="goto rank"
                placeholder="goto rank...">
        </li> -->
      </ul>
    </div>
</nav>

<nav class="navbar" style="visibility: hidden;">
    <li class="nav-item">
        <a class="nav-link">placeholder</a>
    </li>
</nav>
