Image not displaying in my view while another image is - image

Question

I have read a lot of solutions to image problem but none of them are working for me and I can't figure out where I'm going wrong. I've an ASP.Net MVC 4 project I'm working on and all I wanted to do is add an image to one of the views. In this same view is already an image that displays perfectly fine.
Here is some of the code for non-working image:
#Scripts.Render("~/Scripts/Page/QueryForm.js")
<img id="searchPic" src="#Url.Content("~/Images/NereusSearchLogo-small.jpg")" alt="Pic"/>
<input list="RecentQueries" name="q" value="#(Model.SearchResults == null ? string.Empty : Model.SearchResults.Query)" autocomplete="off"/>
<datalist id="RecentQueries">
#{
foreach (var query in Model.RecentQueries)
{
<option value="#query.Text">#query.LastUsed.ToLocalTime()</option>
}
}
</datalist>
<button type="button" id="search">Search</button>
<button type="button" class="hasTooltip" id="new-project-search" title="Start a new search project">New Project Search</button>
Here is the code for the working image:
<span id="search-period-dd" data-dropdown="#search-period-menu" data-horizontal-offset="-8">
<img src="#Url.Content("~/Images/arrow_down-grey-16.png")" class="hasTooltip" title="Filter search results based on date" />
<span id="search-period">#(Model.StartDate == null? Model.SearchPeriodOption.GetAttribute<DisplayAttribute>().Name : "Since " + Model.StartDate.Value.ToLocalTime().ToString("d"))</span>
Here is the html generated:
<img id="searchPic" src="/Images/NereusSearchLogo-small.jpg" alt="Pic"/>
<input list="RecentQueries" name="q" value="" autocomplete="off"/>
<datalist id="RecentQueries">
<option value="Mice">8/7/2013 3:57:38 PM</option>
<option value="Deer">8/7/2013 1:12:49 PM</option>
<option value="Pigs">8/7/2013 12:22:29 PM</option>
<option value="Cats">8/7/2013 9:23:59 AM</option>
<option value="Dogs">8/7/2013 9:23:56 AM</option>
<option value="Birds">8/7/2013 9:23:48 AM</option>
</datalist>
<button type="button" id="search">Search</button>
<button type="button" class="hasTooltip" id="new-project-search" title="Start a new search project">New Project Search</button>
<link href="/Content/Common/ThirdParty/jquery.dropdown.css" rel="stylesheet"/>
<link href="/Content/Page/SearchPeriodDropdown.css" rel="stylesheet"/>
<script src="/Scripts/Common/ThirdParty/jquery.dropdown.js"></script>
<script src="/Scripts/Page/SearchPeriodDropdown.js"></script>
<span id="search-period-dd" data-dropdown="#search-period-menu" data-horizontal-offset="-8">
<img src="/Images/arrow_down-grey-16.png" class="hasTooltip" title="Filter search results based on date" />
<span id="search-period">Any time</span>
</span>
The image is physically in the correct directory, and has been added to the project under the Images folder.
When I inspect the element with Chrome there is no warning/error.
Any help would be greatly appreciated as I am at my whit's end as to why this keeps showing a broken image icon.
Edit Update:
I've confirmed that both images are in the same file location. Both have been added to the project under the same folder. When hovered over in Visual Studio (2012) both images show up. Both have the same full path value (minus their names of course) under the Properties tab when selected in Visual Studio (2012). However, if I swap their names within the code the problem image still doesn't show up and the good one does. I just don't know why at this point. Thanks for all your help.

Answer 1

Danrhul was correct. It was the company's filter. I just changed the file type to png and all is working.