I am trying to insert my brand logo in bootstrap and I am coming across great difficult resizing it. The image saved is sized at "200X150", however it is much smaller than that when viewed.

Once applied to

```
<a class="navbar-brand" href="#">
  <img src="img/rsz_arabella.png" alt="">
</a>

```

It appears just below the navbar and needs resizing to fit inside obviously.
I have tried setting the img to max-width: 100%, max-height: 100%. It fits inside the navbar-brand but it becomes too small to view. Have I saved the image as an incorrect size? Am I positioning it incorrectly?

Please see my brand image at the bottom of the page.

Thanks.

```
<body>
  <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="#bs-example-navbar-collapse-1" aria-expanded="false">
        <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="#">
        <img src="img/rsz_arabella.png" alt="">
      </a>
    </div>
    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="navbar-collapse collapse" id="bs-example-navbar-collapse-1" aria-expanded="false" style="height: 1px;">
      <ul class="nav navbar-nav">
        <li>
          <a href="#">About</a>
        </li>
        <li>
          <a href="#">Services</a>
        </li>
        <li>
          <a href="#">Contact</a>
        </li>
      </ul>
    </div>
    <!-- /.navbar-collapse -->
  </div>
</body>

```

[![My Brand logo](https://i.stack.imgur.com/YgaFv.png)](https://i.stack.imgur.com/YgaFv.png)