bootstrapでnavbar で一番左側のタイトル部分を削除すると生じる隙間を削除したい

コード

bootstrapでnavbar で一番左側のタイトル部分を削除すると生じる隙間を削除したいのですが、どのようにしたらよいでしょうか？
新たにCSSの内容を上書きするstyle.cssを作成して打ち消しながらレイアウトをしています。

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbarEexample">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">タイトル</a>
    </div>
    <div class="collapse navbar-collapse" id="navbarEexample">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">メニューＡ</a></li>
        <li><a href="#">メニューＢ</a></li>
        <li><a href="#">メニューＣ</a></li>
      </ul>
    </div>
  </div>
</nav>

の
<a class="navbar-brand" href="#">タイトル</a>
を削除すると
左端にスペースが生じます。
これを削除しようとしていますが、うまくいきません。
上書きするcssファイルに
padding:0;などを設定していますが。
まだ残っています。
どのようにしたらよいでしょうか？
Tggle メニューが崩壊してしまったりしています。

下記のようにスマホ以外の場合にCSSファイル情報を上書きしてToggleメニューが崩れないように設定をしたつもりなのですが・・・崩れてしまいます。
PC、タブレットサイズはToggle メニューが表示されないので、影響は受けていません。

@media only screen and (min-width : 480px) {
  nav .container-fluid,
  .navbar-collapse {
    padding-left: 0px;
  }

  .navbar-brand {
    display: none;
  }
}

@media only screen and (min-width : 768px) {
  nav .container-fluid,
  .navbar-collapse {
    padding-left: 0px;
  }

  .navbar-brand {
    display: none;
  }
}

@media only screen and (min-width : 992px) {
  nav .container-fluid,
  .navbar-collapse {
    padding-left: 0px;
  }

  .navbar-brand {
    display: none;
  }
}
@media only screen and (min-width : 1200px) {
  nav .container-fluid,
  .navbar-collapse {
    padding-left: 0px;
  }

  .navbar-brand {
    display: none;
  }
}

ご教授頂ければ幸いです。
どのようにしたらよいの