Logo not displaying in header of webpage

I am creating a website from a template for a friend, when developing the website locally on my hard drive it was showing the logo image perfectly fine within the header, however when I uploaded the directory it shows a broken image icon now when viewing the live website.

This is what the code looks like

<header id="jHeader" class="invert">
      <!-- NavBar -->
      <nav class="navbar navbar-default" role="navigation">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="index.html">
              <img src="images/IE_logo.png" alt="logo">
          </a>
        </div>
        <!-- Links -->
        <div class="collapse navbar-collapse navbar-ex1-collapse">
          <ul class="nav navbar-nav navbar-right invert">
            <li class="active"><a href="index.html">home</a></li>
            <li><a href="about-minimal.html">About Us</a></li>
            <!--<li><a href="The Intrepid Earth Process.html">Portfolio</a></li>-->
            <li><a href="The Intrepid Earth Process.html">The Intrepid Earth Process</a></li>
            <li><a href="contact.html">contact</a></li>
          </ul>
        </div>
        <!-- Links -->
      </nav>
    <!-- NavBar -->
    </header>

The image is in that directory it just doesn't show.

this is the image

http://ift.tt/2kiHBS0