diff --git a/static/src/js/components/breadcrumbs.js b/static/src/js/components/breadcrumbs.js
index 294feb5..067f28b 100644
--- a/static/src/js/components/breadcrumbs.js
+++ b/static/src/js/components/breadcrumbs.js
@@ -7,6 +7,9 @@ export default class Breadcrumbs extends React.Component {
   }
 
   render() {
+    if (this.urlParts.length < 2) {
+      return;
+    }
     var elements = [];
     for (var i = 0; i < this.urlParts.length; i++) {
       var dirs = [];
diff --git a/static/src/less/style.less b/static/src/less/style.less
index 3e8a5ca..9584439 100644
--- a/static/src/less/style.less
+++ b/static/src/less/style.less
@@ -128,7 +128,24 @@ footer {
   .box-shadow(0px 8px 10px 3px rgba(0,0,0,0.6));
   margin-bottom: 27px;
   h1 {
-    margin: 25px 0;
+    margin: 15px 0;
+  }
+  .breadcrumb-container {
+    text-align: right;
+    .breadcrumb {
+      li + li::before {
+        content: "/";
+      }
+      background: transparent;
+      margin-bottom: 3px;
+      font-size: 17px;
+      a {
+        color: white;
+        &:hover {
+          color: #ff7f00;
+        }
+      }
+    }
   }
 }
 /* @end content base */
diff --git a/templates/content_base.html b/templates/content_base.html
index 20b71dc..6fbca6e 100644
--- a/templates/content_base.html
+++ b/templates/content_base.html
@@ -7,10 +7,14 @@
 {% block baseContent %}
   <div class="jumbotron header">
     <div class="container">
-      <h1>{% block pageTitle %}{% endblock %}</h1>
-    </div>
-    <div class="container">
-      <div id="breadcrumbs"></div>
+      <div class="row">
+        <div class="col-sm-8">
+          <h1>{% block pageTitle %}{% endblock %}</h1>
+        </div>
+        <div class="col-sm-4 breadcrumb-container">
+          <div id="breadcrumbs"></div>
+        </div>
+      </div>
     </div>
     <navbar></navbar>
   </div>