html navigation bar does not display inline - html

Question

I would like to implement the navigation bar style used by this open source software (http://demo.openrem.org/openrem/ct/) which uses django as a web framework. I have have grabbed the html and css from the source that I think I require. However my nav-bar does not display inline, has bullet points in the list (https://jsfiddle.net/1prLa21x/1/). I think I am missing some additional css style settings. Any pointers on how to get closer to the navbar displayed by the openrem page?
HTML
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="/openrem/">nc_jobs</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li>Done</li>
<li>Not Done</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<p class="navbar-text navbar-right">
<span class="glyphicon glyphicon-user"></span>
Welcome test.user -
logout
</p>
</ul>
</div>
</div>
</div>
CSS
.navbar-default {
background-color: #7092be;
border-color: #145ebe;
}
.navbar-default .navbar-brand {
color: #e0eaf6;
}
.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
color: #ffffff;
}
.navbar-default .navbar-text {
color: #e0eaf6;
}
.navbar-default .navbar-nav > li > a {
color: #e0eaf6;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
color: #ffffff;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
color: #ffffff;
background-color: #145ebe;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
color: #ffffff;
background-color: #145ebe;
}
.navbar-default .navbar-toggle {
border-color: #145ebe;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
background-color: #145ebe;
}
.navbar-default .navbar-toggle .icon-bar {
background-color: #e0eaf6;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
border-color: #e0eaf6;
}
.navbar-default .navbar-link {
color: #e0eaf6;
}
.navbar-default .navbar-link:hover {
color: #ffffff;
}
#media (max-width: 767px) {
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
color: #e0eaf6;
}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
color: #ffffff;
}
.navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
color: #ffffff;
background-color: #145ebe;
}
}

Answer 1

That example is running off the bootstrap framework -
if you add https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css as an external resource to your fiddle it displays correctly.
You can download the whole source at getbootstrap.com