<div class="grid header">
  <!-- <div class="logo col-1-3">


  </div>
  <ul class="nav navbar-nav navbar-right">
     {% if user %}
       <li class="dropdown">
         <a href="#" data-toggle="dropdown" class="navbar-avatar dropdown-toggle">
           {% if user.picture %}
             <img src="{{ user.picture }}" width="30px" style="border-radius: 100%;">
           {% else %}
             <img src="{{ user.gravatar }}"  width="30px" style="border-radius: 100%;">
           {% endif %}
           {% if user.name %}
             {{ user.name }}
           {% elif user.email %}
             {{ user.email }}
           {% else %}
             {{ user.id }}
           {% endif %}
           <i class="caret"></i>
         </a>
         <ul class="dropdown-menu">
           <li><a href="/account">Minha Conta</a></li>
           <li class="divider"></li>
           <li><a href="/logout">Sair</a></li>
         </ul>
       </li>
     {% else %}
       <li class="{% if title == 'Entrar' %}active{% endif %}"><a href="/login">Entrar</a></li>
       <li class="{% if title == 'Criar Conta' %}active{% endif %}"><a href="/signup">Criar Conta</a></li>
     {% endif %}
     </ul>
</div> -->

<nav class="navbar navbar-default ">
    <div class="navbar-header">
      <button type="button" data-toggle="collapse" data-target="#navbar" class="navbar-toggle collapsed">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>

        <a href="{{ site.baseurl }}/" style="border-bottom: 0px solid;"><img src="/libreflix_pride.png" width="150px" style="border-bottom: 0px solid; opacity:0; -moz-transition: opacity 2s; -webkit-transition: opacity 2s; -o-transition: opacity 2s; transition: opacity 2s; margin-right: 30px;" onload="this.style.opacity='1';"></a>

    </div>
    <div id="navbar" class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <!-- <li><a href="/">Home</a></li> -->
        <li><a href="/t/docs">Docs</a></li>
        <li><a href="/t/filmes">Filmes</a></li>
        <li><a href="/t/curtas">Curtas</a></li>
        <li><a href="/t/series">Séries</a></li>
        <li><a href="/t/classicos">Clássicos</a></li>
        <li><a href="/t/nacionais">Nacionais</a></li>
        <li><a href="/t/kids">Kids</a></li>

      </ul>
    <ul class="nav navbar-nav navbar-right">
    {% if user %}
      <li><a href="/novo">Nova Produção</a></li>
      <li class="dropdown">
        <a href="#" data-toggle="dropdown" class="navbar-avatar dropdown-toggle">
          {% if user.picture %}
            <img src="{{ user.picture }}"  width="20px" style="border-radius: 100%;">
          {% else %}
            <img src="{{ user.gravatar }}"  width="20px" style="border-radius: 100%;">
          {% endif %}
          <!-- {% if user.name %}
            {{ user.name }}
          {% elif user.email %}
            {{ user.email }}
          {% else %}
            {{ user.id }}
          {% endif %} -->
          <i class="caret"></i>
        </a>
        <ul class="dropdown-menu">
          <li><a href="/account">Minha Conta</a></li>
          <li class="divider"></li>
          <!-- <li><a href="#">Minhas Produções</a></li>
          <li class="divider"></li> -->
          <li><a href="/logout">Sair</a></li>
        </ul>
      </li>
    {% else %}
      <li class="{% if title == 'Entrar' %}active{% endif %}"><a href="/login">Entrar</a></li>
      <!-- <li class="{% if title == 'Criar Conta' %}active{% endif %}"><a href="/signup">Criar Conta</a></li> -->
    {% endif %}
    </ul>
    </div>
</nav>
</div>
