HTML

<nav class="navbar navbar-default bootsnav">
    <div class="container">  
        
<!-- Start Atribute Navigation --> <div class="attr-nav"> <ul> <li class="side-menu"><a href="#"><i class="fa fa-bars"></i></a></li> </ul> </div> <!-- End Atribute Navigation -->
<!-- Start Header Navigation --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-menu"> <i class="fa fa-bars"></i> </button> <a class="navbar-brand" href="#brand"><img src="LOGO_ADDRESS" class="logo" alt=""></a> </div> <!-- End Header Navigation --> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse" id="navbar-menu"> <ul class="nav navbar-nav navbar-center"> <li><a href="#">Home</a></li> <li><a href="#">About Us</a></li> <li><a href="#">Services</a></li> <li><a href="#">Portfolio</a></li> <li><a href="#">Contact Us</a></li> </ul> </div><!-- /.navbar-collapse --> </div>
<!-- Start Side Menu --> <div class="side"> <a href="#" class="close-side"><i class="fa fa-times"></i></a> <div class="widget"> <h6 class="title">Custom Pages</h6> <ul class="link"> <li><a href="#">About</a></li> <li><a href="#">Services</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Portfolio</a></li> <li><a href="#">Contact</a></li> </ul> </div> <div class="widget"> <h6 class="title">Additional Links</h6> <ul class="link"> <li><a href="#">Retina Homepage</a></li> <li><a href="#">New Page Examples</a></li> <li><a href="#">Parallax Sections</a></li> <li><a href="#">Shortcode Central</a></li> <li><a href="#">Ultimate Font Collection</a></li> </ul> </div> </div> <!-- End Side Menu -->
</nav>