Navbar - Link outside the Local Boostrap

Question

I made a Jsfiddle to show my problem. The following happens: Navbar has an icon of a house, that when I click on it does not execute the link, but if you click a little more to the left the link runs.

NOTE: if Navbar is responsive it works normal, but if it is in normal mode it does not.

(Responsive - It works)

(Normal - Does not work)

/*Menu*/
#menu {
    border-radius: 0em 0em 1em 1em;
    background-color: black;
    border-bottom: solid;
    border-bottom-color: white;
    border-left-color: white;
    border-right-color: white;
    z-index: 1061;
    position: absolute fixed;
}

.menuImage {
    width: 1.56em;
    height: 1.56em;
}

.menuTitulo {
    font-size: 2em;
    text-align: center;
    color: red;
    padding-bottom: 0.1em;
    padding-top: 0.1em;
    line-height: 1;
}

hr.menuSup {
    border-color: black;
    padding: 0em;
}

.menuAlt {
    height: 2em;
}

.menuContato {
    color: red;
    text-align: center;
    padding-top: 1em;
}
/*Popover*/
.popover-title {
    background-color: #73AD21;
    color: #FFFFFF;
    text-align: center;
}

.popover-content {
    background-color: #000000;
    color: #FFFFFF;
    text-align: center;
}

a:hover:not(.ignoreCss) {
    text-decoration: none; /*Tira o sublinhado do link*/
    color: #ffffff;
}

a:not(.ignoreCss) {
    text-decoration: none;
    color: #ffffff;
}


@media (max-width: 990px) {
    .navbar-header {
        float: none;
    }

    .navbar-toggle {
        display: block;
    }

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }

        .navbar-collapse.collapse {
            display: none !important;
        }

    .navbar-nav {
        float: none !important;
        margin: 7.5px -15px;
    }

        .navbar-nav > li {
            float: none;
        }

            .navbar-nav > li > a {
                padding-top: 10px;
                padding-bottom: 10px;
            }

    .navbar-text {
        float: none;
        margin: 15px 0;
    }
    /* since 3.1.0 */
    .navbar-collapse.collapse.in {
        display: block !important;
    }

    .collapsing {
        overflow: hidden !important;
    }

    .menuSup {
        display: none;
    }
}

.img1 {
    width: 100%;
    max-height: 35em;
}

.input-group-addon {
    color: #fff;
    background: #3276B1;
}
/*Botao*/
.navbar-nav.navbar-right .btn {
    position: relative;
    z-index: 2;
    padding: 4px 20px;
    margin: 10px auto;
}
/*Conteúdo dos botões*/
.navbar .navbar-collapse {
    position: relative;
}

    .navbar .navbar-collapse .navbar-right > li:last-child {
        padding-left: 22px;
    }

.navbar .nav-collapse:not(.areaCli) {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding-right: 300px;
    padding-left: 80px;
    width: 100%;
}
/*area do cliente*/
.areaCli {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding-right: 300px;
    padding-left: 80px;
    width: 100%;
}
/*Area do cliente*/
.navbar.navbar-default .nav-collapse {
    background-color: #f8f8f8;
}

.navbar.navbar-inverse .nav-collapse {
    background-color: #222;
}

.navbar .nav-collapse .navbar-form {
    border-width: 0;
    box-shadow: none;
}

.nav-collapse > li {
    float: right;
}

.btn.btn-circle {
    border-radius: 50px;
}

.btn.btn-outline {
    background-color: transparent;
}

.p1 {
    font-size: 3vw;
    text-align: center;
}
.navbar-brand{
  border:solid;
  border-colorred;
  }

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<nav class="navbar navbar-default navbar-fixed-top">
  <div class="container">
    
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-2">
        <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="www.google.com" class="navbar-brand"><span class="glyphicon glyphicon-home" style="color:black;" />
      </a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="navbar-collapse-2">
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#">Início</a>
        </li>
        <li><a href="#">Contato</a>
        </li>
        <li>
          <a class="btn btn-default btn-outline btn-circle btnCliente" data-toggle="collapse" href="#areaCliente" aria-expanded="false" aria-controls="nav-collapse2" style="background-color:#3276b1; border:none; color:white;">Aárea do Cliente</a>
        </li>
        <li>
          <a class="btn btn-default btn-outline btn-circle" data-toggle="collapse" href="#nav-collapse2" aria-expanded="false" aria-controls="nav-collapse2" style="background-color: #00ff21; border:none; color: white;">Entrar</a>
        </li>
      </ul>
      <div class="collapse nav navbar-nav nav-collapse" id="nav-collapse2">
        <form action="~/Public/Login" method="post" class="navbar-form navbar-right form-inline" role="form">
          <div class="form-group">
            <label class="sr-only" for="Email">Email</label>
            <input type="text" id="email" class="form-control TextoTextBox" name="email" placeholder="E-mail" required="required" autocomplete="on" autofocus />
          </div>
          <div class="form-group">
            <label class="sr-only" for="Password">Password</label>
            <input type="password" id="password" class="form-control TextoTextBox" name="password" placeholder="Senha" required="required" />
          </div>
          <button type="submit" class="btn btn-success">Entrar</button>
        </form>
      </div>
      <div class="collapse nav navbar-nav nav-collapse areaCli" id="areaCliente">
        <form @*action="~/Public/Login" method="post" *@ class="navbar-form navbar-right form-inline" role="form">
          <div class="form-group">
            <input type="text" id="codCli" class="form-control TextoTextBox" name="codCli" placeholder="Código do Cliente" required="required" autocomplete="on" autofocus />
          </div>
          <button type="submit" class="btn btn-success">Acessar</button>
        </form>
      </div>
    </div>
    <!-- /.navbar-collapse -->
  </div>
  <!-- /.container -->
</nav>
<!-- /.navbar -->


oi