diff --git a/app/views/templates/partials/header.twig b/app/views/templates/partials/header.twig
index cd3fd2d..f95b992 100755
--- a/app/views/templates/partials/header.twig
+++ b/app/views/templates/partials/header.twig
@@ -1,26 +1,35 @@
 <!-- header -->
 <header id="header" class="row">
-	<div class="col-sm-2"></div>
-	<div class="col-sm-8 col-xs-12">
-		<img class="band-logo" src="/img/logo-white.png" />
-	</div>
-	<div class="col-sm-2"></div>
+  <div class="col-sm-2"></div>
+  <div class="col-sm-8 col-xs-12">
+    <img class="band-logo" src="/img/logo-white.png" />
+  </div>
+  <div class="col-sm-2"></div>
 </header>
 
 <!-- nav bar -->
-<nav id="nav" class="row">
-	<ul class="col-sm-12">
-		<li class="nav_item">
-			<a href="{{ urlFor('home') }}">Home</a>
-		</li>
-		<li class="nav_item">
-			<a href="{{ urlFor('about') }}">About</a>
-		</li>
-		<li class="nav_item">
-			<a href="{{ urlFor('shows') }}">Shows</a>
-		</li>
-		<li class="nav_item">
-			<a href="{{ urlFor('contact') }}">Contact</a>
-		</li>
-	</ul>
+<nav id="nav" class="navbar" class="row">
+  <div class="container-fluid">
+		<button id="navbar-collapse-button" type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false">
+	    <span class="sr-only">Toggle navigation</span>
+	    <i class="fa fa-bars" aria-hidden="true"></i>
+	  </button>
+
+	  <div class="collapse navbar-collapse" id="navbar-collapse">
+	    <ul class="nav navbar-nav">
+	      <li class="nav_item">
+	        <a href="{{ urlFor('home') }}">Home</a>
+	      </li>
+	      <li class="nav_item">
+	        <a href="{{ urlFor('about') }}">About</a>
+	      </li>
+	      <li class="nav_item">
+	        <a href="{{ urlFor('shows') }}">Shows</a>
+	      </li>
+	      <li class="nav_item">
+	        <a href="{{ urlFor('contact') }}">Contact</a>
+	      </li>
+	    </ul>
+	  </div>
+  </div>
 </nav>