space at the bottom of webpage using bootstrap - html

Question

I'm currently making a website using bootstrap, but at the end of the homepage's background image there is a piece of white space about 50px in length.
Is it possible to get rid of this strip of white space? I have provided my html and css code for the site. Help would be much appreciated.
HTML
<!-- html-->
<div id="title-page">
<div class="container">
<div id="nav" class="navbar navbar-inverse navbar-static-top">
<div class="container">
<button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="collapse navbar-collapse navHeaderCollapse">
<ul class="nav navbar-nav navbar-right">
<li>Home</li>
<li>Portfolio</li>
<li>About</li>
<li>Contact</li>
</ul>
</div>
</div>
</div>
<div id="pic-headings">
<h1 class=" text-center" ></h1><>
<br>
<h2 class=" text-center"></h2>
</div>
</div>
</div>
CSS
<!--css-->
#nav{
margin-bottom: 0px;
background-color: transparent;
border: none;
padding-right: 20px;
}
.navbar-brand{
color: #fff;
}
#title-page{
background-size: 100%;
background-size: cover;
background-image: url(stephen1.jpg);
color: #fff;
height: 830px;
margin-bottom: 0px;
}
#pic-headings{
padding-top: 200px;
text-align: center;
}
h1{
font-family: eb-garamond, sans-serif;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
h2{
font-family: eb-garamond, sans-serif;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}

Answer 1

On line 24 you have some stray characters <> which can't be helping your situation. And you may consider restructuring your code without the nested container classes and overall just not nesting your div's so deeply. In the process of doing that you will most certainly identify the problem.
Please post link or jsfiddle or more code, and which version of Bootstrap your trying to use to get more help.
this may or may not help get you started
<div id="header">
<div class="container clearfix">
<ul id="nav">
<li></li>
</ul>
</div>
</div>
<div class="container">
<div class="row-fluid">
<div class="span12">
something
</div>
</div>
</div>