I am new to html/css and trying to get a basic footer to work/look properly in ArcGIS Hub. The appearance of the section, is working just fine. The problem is that it overlaps (or floats) over last of the page content. I think it is a problem with the class. Here's the code that's being used. Any help would be appreciated. I've tried to fix it to no avail.
<style>
.footer {
background-color: #83b9c6;
color: white;
}
</style>
<div class="footer">
<div class="col-xs-12">
<p></p>
</div>
<div class="col-xs-12">
<img src="http://files.constantcontact.com/c351f4f8001/ce31a50e-e01c-4055-b46a-6b59b476850f.png?a=112900961401..." class="center-block logo" height="100">
</div>
<div class="col-xs-12">
<ul class="nav nav-pills" { list-style-type: none }>
<li role="presentation" style="list-style-type:none"><a href="#">Home</a></li>
<li role="presentation"><a href="#">About</a></li>
<li role="presentation"><a href="#">Catalog</a></li>
<li role="presentation"><a href="#">FAQ</a></li>
<li role="presentation"><a href="#">Contact Us</a></li>
</ul>
</p>
<div class="col-xs-12">
<div class="text-center"><em>Copyright 2018. Upper Valley Lake Sunapee Regional Planning Commission.</em></div>
</div>
</div>
</div>
