diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index cd40640065..c20e14cf88 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -202,10 +202,1402 @@ table {
   border-spacing: 0;
 }
 
+html {
+  font-size: 62.5%;
+  -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+  -webkit-overflow-scrolling: touch;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+@media screen and (max-device-width: 480px) {
+  html {
+    -webkit-text-size-adjust: none;
+        -ms-text-size-adjust: none;
+  }
+}
+
+body {
+  margin: 0;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  font-size: 1.4rem;
+  line-height: 1.5;
+  color: #333333;
+  background-color: #ffffff;
+}
+
+body,
+input,
+button,
+select,
+textarea {
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  line-height: 20px;
+}
+
+a {
+  color: #428bca;
+  text-decoration: none;
+}
+
+a:hover {
+  color: #2a6496;
+  text-decoration: underline;
+}
+
+a:focus {
+  outline: thin dotted #333;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+
+img {
+  width: auto\9;
+  height: auto;
+  max-width: 100%;
+  vertical-align: middle;
+}
+
+.img-rounded {
+  border-radius: 6px;
+}
+
+.img-polaroid {
+  padding: 4px;
+  background-color: #fff;
+  border: 1px solid #ccc;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+}
+
+.img-circle {
+  border-radius: 500px;
+}
+
+@media print {
+  * {
+    color: #000 !important;
+    text-shadow: none !important;
+    background: transparent !important;
+    box-shadow: none !important;
+  }
+  a,
+  a:visited {
+    text-decoration: underline;
+  }
+  a[href]:after {
+    content: " (" attr(href) ")";
+  }
+  abbr[title]:after {
+    content: " (" attr(title) ")";
+  }
+  .ir a:after,
+  a[href^="javascript:"]:after,
+  a[href^="#"]:after {
+    content: "";
+  }
+  pre,
+  blockquote {
+    border: 1px solid #999;
+    page-break-inside: avoid;
+  }
+  thead {
+    display: table-header-group;
+  }
+  tr,
+  img {
+    page-break-inside: avoid;
+  }
+  img {
+    max-width: 100% !important;
+  }
+  @page  {
+    margin: 0.5cm;
+  }
+  p,
+  h2,
+  h3 {
+    orphans: 3;
+    widows: 3;
+  }
+  h2,
+  h3 {
+    page-break-after: avoid;
+  }
+}
+
+p {
+  margin: 0 0 10px;
+}
+
+.lead {
+  margin-bottom: 20px;
+  font-size: 21px;
+  font-weight: 200;
+  line-height: 30px;
+}
+
+small {
+  font-size: 85%;
+}
+
+strong {
+  font-weight: bold;
+}
+
+em {
+  font-style: italic;
+}
+
+cite {
+  font-style: normal;
+}
+
+.muted {
+  color: #999999;
+}
+
+a.muted:hover {
+  color: #808080;
+}
+
+.text-warning {
+  color: #c09853;
+}
+
+a.text-warning:hover {
+  color: #a47e3c;
+}
+
+.text-error {
+  color: #b94a48;
+}
+
+a.text-error:hover {
+  color: #953b39;
+}
+
+.text-success {
+  color: #468847;
+}
+
+a.text-success:hover {
+  color: #356635;
+}
+
+.text-left {
+  text-align: left;
+}
+
+.text-right {
+  text-align: right;
+}
+
+.text-center {
+  text-align: center;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  margin: 10px 0;
+  font-family: inherit;
+  font-weight: 500;
+  line-height: 20px;
+  text-rendering: optimizelegibility;
+}
+
+h1 small,
+h2 small,
+h3 small,
+h4 small,
+h5 small,
+h6 small {
+  font-weight: normal;
+  line-height: 1;
+  color: #999999;
+}
+
+h1,
+h2,
+h3 {
+  line-height: 40px;
+}
+
+h1 {
+  font-size: 38.5px;
+}
+
+h2 {
+  font-size: 31.5px;
+}
+
+h3 {
+  font-size: 24.5px;
+}
+
+h4 {
+  font-size: 17.5px;
+}
+
+h5 {
+  font-size: 14px;
+}
+
+h6 {
+  font-size: 11.9px;
+}
+
+h1 small {
+  font-size: 24.5px;
+}
+
+h2 small {
+  font-size: 17.5px;
+}
+
+h3 small {
+  font-size: 14px;
+}
+
+h4 small {
+  font-size: 14px;
+}
+
+.page-header {
+  padding-bottom: 9px;
+  margin: 20px 0 30px;
+  border-bottom: 1px solid #eeeeee;
+}
+
+ul,
+ol {
+  padding: 0;
+  margin: 0 0 10px 25px;
+}
+
+ul ul,
+ul ol,
+ol ol,
+ol ul {
+  margin-bottom: 0;
+}
+
+li {
+  line-height: 20px;
+}
+
+.list-unstyled,
+.list-inline {
+  margin-left: 0;
+  list-style: none;
+}
+
+.list-inline > li {
+  display: inline-block;
+  padding-right: 5px;
+  padding-left: 5px;
+}
+
+dl {
+  margin-bottom: 20px;
+}
+
+dt,
+dd {
+  line-height: 20px;
+}
+
+dt {
+  font-weight: bold;
+}
+
+dd {
+  margin-left: 10px;
+}
+
+.dl-horizontal:before,
+.dl-horizontal:after {
+  display: table;
+  content: " ";
+}
+
+.dl-horizontal:after {
+  clear: both;
+}
+
+.dl-horizontal dt {
+  float: left;
+  width: 160px;
+  overflow: hidden;
+  clear: left;
+  text-align: right;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.dl-horizontal dd {
+  margin-left: 180px;
+}
+
+hr {
+  margin: 20px 0;
+  border: 0;
+  border-top: 1px solid #eeeeee;
+  border-bottom: 1px solid #fff;
+}
+
+abbr[title],
+abbr[data-original-title] {
+  cursor: help;
+  border-bottom: 1px dotted #999999;
+}
+
+abbr.initialism {
+  font-size: 90%;
+  text-transform: uppercase;
+}
+
+blockquote {
+  padding: 0 0 0 15px;
+  margin: 0 0 20px;
+  border-left: 5px solid #eeeeee;
+}
+
+blockquote p {
+  margin-bottom: 0;
+  font-size: 17.5px;
+  font-weight: 300;
+  line-height: 1.25;
+}
+
+blockquote small {
+  display: block;
+  line-height: 20px;
+  color: #999999;
+}
+
+blockquote small:before {
+  content: '\2014 \00A0';
+}
+
+blockquote.pull-right {
+  float: right;
+  padding-right: 15px;
+  padding-left: 0;
+  border-right: 5px solid #eeeeee;
+  border-left: 0;
+}
+
+blockquote.pull-right p,
+blockquote.pull-right small {
+  text-align: right;
+}
+
+blockquote.pull-right small:before {
+  content: '';
+}
+
+blockquote.pull-right small:after {
+  content: '\00A0 \2014';
+}
+
+q:before,
+q:after,
+blockquote:before,
+blockquote:after {
+  content: "";
+}
+
+address {
+  display: block;
+  margin-bottom: 20px;
+  font-style: normal;
+  line-height: 20px;
+}
+
+code,
+pre {
+  padding: 0 3px 2px;
+  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
+  font-size: 12px;
+  color: #333333;
+  border-radius: 4px;
+}
+
+code {
+  padding: 2px 4px;
+  font-size: 90%;
+  color: #c7254e;
+  white-space: nowrap;
+  background-color: #f9f2f4;
+}
+
+pre {
+  display: block;
+  padding: 9.5px;
+  margin: 0 0 10px;
+  font-size: 13px;
+  line-height: 20px;
+  word-break: break-all;
+  word-wrap: break-word;
+  white-space: pre;
+  white-space: pre-wrap;
+  background-color: #f5f5f5;
+  border: 1px solid #ccc;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  border-radius: 4px;
+}
+
+pre.prettyprint {
+  margin-bottom: 20px;
+}
+
+pre code {
+  padding: 0;
+  color: inherit;
+  white-space: pre;
+  white-space: pre-wrap;
+  background-color: transparent;
+  border: 0;
+}
+
+.pre-scrollable {
+  max-height: 340px;
+  overflow-y: scroll;
+}
+
+.container {
+  max-width: 940px;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+.container:before,
+.container:after {
+  display: table;
+  content: " ";
+}
+
+.container:after {
+  clear: both;
+}
+
+.row {
+  margin-right: -10px;
+  margin-left: -10px;
+}
+
+.row:before,
+.row:after {
+  display: table;
+  content: " ";
+}
+
+.row:after {
+  clear: both;
+}
+
+[class^="span"] {
+  padding-right: 10px;
+  padding-left: 10px;
+  -webkit-box-sizing: border-box;
+     -moz-box-sizing: border-box;
+          box-sizing: border-box;
+}
+
+[class*="span"].pull-right {
+  float: right;
+}
+
+.fade {
+  opacity: 0;
+  -webkit-transition: opacity 0.15s linear;
+     -moz-transition: opacity 0.15s linear;
+       -o-transition: opacity 0.15s linear;
+          transition: opacity 0.15s linear;
+}
+
+.fade.in {
+  opacity: 1;
+}
+
+/*.collapse {
+  position: relative;
+  height: 0;
+  overflow: hidden;
+  .transition(height .35s ease);
+  &.in {
+    height: auto;
+  }
+}*/
+
+.collapse {
+  position: relative;
+  height: 0;
+  overflow: hidden;
+  -webkit-transition: height 0.35s ease;
+     -moz-transition: height 0.35s ease;
+       -o-transition: height 0.35s ease;
+          transition: height 0.35s ease;
+}
+
+.collapse.in {
+  height: auto;
+}
+
+.nav {
+  padding-left: 0;
+  margin-bottom: 0;
+  margin-left: 0;
+  list-style: none;
+}
+
+.nav:before,
+.nav:after {
+  display: table;
+  content: " ";
+}
+
+.nav:after {
+  clear: both;
+}
+
+.nav > li {
+  display: block;
+}
+
+.nav > li > a {
+  position: relative;
+  display: block;
+  padding: 10px 15px;
+}
+
+.nav > li > a:hover {
+  text-decoration: none;
+  background-color: #eeeeee;
+}
+
+.nav-list > li > a {
+  margin-bottom: -1px;
+  border: 1px solid #e5e5e5;
+}
+
+.nav-list > li:first-child > a {
+  border-top-right-radius: 4px;
+  border-top-left-radius: 4px;
+}
+
+.nav-list > li:last-child > a {
+  border-radius: 0 0 6px 6px;
+  border-bottom-right-radius: 4px;
+  border-bottom-left-radius: 4px;
+}
+
+.nav-list > .active > a,
+.nav-list > .active > a:hover {
+  z-index: 2;
+  color: #fff;
+  background-color: #428bca;
+  border-color: #428bca;
+}
+
+/*
+// Prevent IE8 from misplacing imgs
+// See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989
+.nav > li > a > img {
+  max-width: none;
+}
+
+// Redeclare pull classes because of specifity
+.nav > .pull-right {
+  float: right;
+}
+
+// Nav headers (for dropdowns and lists)
+.nav-header {
+  display: block;
+  padding: 3px 15px;
+  font-size: 11px;
+  font-weight: bold;
+  line-height: @line-height-base;
+  color: @grayLight;
+  text-shadow: 0 1px 0 rgba(255,255,255,.5);
+  text-transform: uppercase;
+}
+// Space them out when they follow another list item (link)
+.nav li + .nav-header {
+  margin-top: 9px;
+}
+
+// Dividers (basically an hr) within the dropdown
+.nav .divider {
+  .nav-divider();
+}
+*/
+
+/*
+// Tabs
+// -------------------------
+
+// Give the tabs something to sit on
+.nav-tabs {
+  border-bottom: 1px solid #ddd;
+}
+// Make the list-items overlay the bottom border
+.nav-tabs > li {
+  margin-bottom: -1px;
+}
+// Actual tabs (as links)
+.nav-tabs > li > a {
+  margin-right: 2px;
+  line-height: @line-height-base;
+  border: 1px solid transparent;
+  border-radius: @border-radius-base @border-radius-base 0 0;
+  &:hover {
+    border-color: @grayLighter @grayLighter #ddd;
+  }
+}
+// Active state, and it's :hover to override normal :hover
+.nav-tabs > .active > a,
+.nav-tabs > .active > a:hover {
+  color: @gray;
+  background-color: @body-background;
+  border: 1px solid #ddd;
+  border-bottom-color: transparent;
+  cursor: default;
+}
+
+
+
+// Pills
+// -------------------------
+
+// Links rendered as pills
+.nav-pills > li > a {
+  border-radius: 5px;
+}
+.nav-pills > li + li > a {
+  margin-left: 2px;
+}
+
+// Active state
+.nav-pills > .active > a,
+.nav-pills > .active > a:hover {
+  color: #fff;
+  background-color: @link-color;
+}
+
+// Stacked pills
+.nav-stacked > li {
+  float: none;
+}
+.nav-stacked > li + li > a {
+  margin-top: 2px;
+  margin-left: 0; // no need for the gap between nav items
+}
+
+
+
+// Justified navs
+// -------------------------
+
+.nav-justified {
+  // Negative margin doesn't work, so we hack it
+  max-height: 37px;
+}
+.nav-justified > li {
+  float: none;
+  display: table-cell;
+  width: 1%;
+  text-align: center;
+}
+
+
+
+// Lists
+// -------------------------
+
+.nav-list {
+  background-color: #fff;
+  border-radius: 6px;
+  .box-shadow(0 1px 4px rgba(0,0,0,.065))
+}
+.nav-list > li {
+  float: none;
+}
+.nav-list > li > a {
+  margin-bottom: -1px; // pull up the following link for a 1px border between
+  border: 1px solid #e5e5e5;
+}
+.nav-list > li > a:hover {
+  background-color: #f5f5f5;
+}
+.nav-list > li:first-child > a {
+  border-radius: 6px 6px 0 0;
+}
+.nav-list > li:last-child > a {
+  border-radius: 0 0 6px 6px;
+}
+.nav-list > .active > a,
+.nav-list > .active > a:hover {
+  position: relative;
+  z-index: 2;
+  padding: 9px 15px;
+  color: #fff;
+  text-shadow: 0 1px 0 rgba(0,0,0,.15);
+  background-color: @link-color;
+  border-width: 0;
+  .box-shadow(~"inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1)")
+}
+
+
+
+// Dropdowns
+// -------------------------
+
+.nav-tabs .dropdown-menu {
+  // Remove the top rounded corners here since there is a hard edge above the menu
+  .border-top-radius(0);
+}
+
+// Default dropdown links
+// -------------------------
+// Make carets use linkColor to start
+.nav .dropdown-toggle .caret {
+  border-top-color: @link-color;
+  border-bottom-color: @link-color;
+  margin-top: 8px;
+}
+.nav .dropdown-toggle:hover .caret {
+  border-top-color: @link-color-hover;
+  border-bottom-color: @link-color-hover;
+}
+
+// Active dropdown links
+// -------------------------
+.nav .active .dropdown-toggle .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
+}
+.nav-tabs .active .dropdown-toggle .caret {
+  border-top-color: @gray;
+  border-bottom-color: @gray;
+}
+
+// Active:hover dropdown links
+// -------------------------
+.nav > .dropdown.active > a:hover {
+  cursor: pointer;
+}
+
+// Open dropdowns
+// -------------------------
+.nav-tabs .open .dropdown-toggle,
+.nav-pills .open .dropdown-toggle,
+.nav > li.dropdown.open.active > a:hover {
+  color: #fff;
+  background-color: @grayLight;
+  border-color: @grayLight;
+}
+.nav li.dropdown.open .caret,
+.nav li.dropdown.open.active .caret,
+.nav li.dropdown.open a:hover .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
+  .opacity(100);
+}
+
+// Dropdowns in stacked tabs
+.tabs-stacked .open > a:hover {
+  border-color: @grayLight;
+}
+
+
+
+// Tabbable tabs
+// -------------------------
+
+// Clear any floats
+.tabbable {
+  .clearfix();
+}
+
+// Show/hide tabbable areas
+.tab-content > .tab-pane,
+.pill-content > .pill-pane {
+  display: none;
+}
+.tab-content > .active,
+.pill-content > .active {
+  display: block;
+}
+
+
+
+// Disabled state
+// -------------------------
+
+// Gray out text
+.nav > .disabled > a {
+  color: @grayLight;
+}
+// Nuke hover effects
+.nav > .disabled > a:hover {
+  text-decoration: none;
+  background-color: transparent;
+  cursor: default;
+}
+*/
+
+.navbar {
+  padding: 15px;
+  background-color: #eee;
+}
+
+.navbar:before,
+.navbar:after {
+  display: table;
+  content: " ";
+}
+
+.navbar:after {
+  clear: both;
+}
+
+.navbar .brand {
+  display: inline-block;
+  padding: 7px 15px;
+  font-size: 18px;
+  font-weight: bold;
+  line-height: 1;
+}
+
+.navbar .brand:hover {
+  text-decoration: none;
+  background-color: #ddd;
+}
+
+.btn-navbar {
+  float: right;
+  padding: 10px 12px;
+  background-color: #ddd;
+  border: 0;
+  border-radius: 4px;
+}
+
+.btn-navbar .icon-bar {
+  display: block;
+  width: 20px;
+  height: 2px;
+  background-color: #fff;
+  border-radius: 1px;
+}
+
+.btn-navbar .icon-bar + .icon-bar {
+  margin-top: 3px;
+}
+
+.navbar .nav {
+  margin-top: 15px;
+}
+
+.navbar .nav > li > a {
+  line-height: 20px;
+}
+
+.navbar .nav > li > a:hover {
+  background-color: #ddd;
+}
+
+.navbar .nav > .active > a {
+  background-color: #ddd;
+}
+
+.navbar-inverse {
+  background-color: #222;
+}
+
+.navbar-inverse .brand {
+  color: #fff;
+}
+
+.navbar-inverse .brand:hover {
+  background-color: #333;
+}
+
+.navbar-inverse .nav > li > a {
+  color: #fff;
+}
+
+.navbar-inverse .nav > li > a:hover {
+  background-color: #333;
+}
+
+.navbar-inverse .nav > .active > a {
+  background-color: #333;
+}
+
+.navbar-inverse .btn-navbar {
+  background-color: #444;
+}
+
 /*
 
+// COMMON STYLES
+// -------------
+
+// Base class and wrapper
+.navbar {
+  overflow: visible;
+  padding: 0 20px;
+  margin-bottom: @line-height-base;
+  background-color: @navbar-background;
+  border-radius: @border-radius-base;
+
+  // Prevent floats from breaking the navbar
+  .clearfix();
+}
+
+// Set width to auto for default container
+// We then reset it for fixed navbars in the #gridSystem mixin
+.navbar .container {
+  width: auto;
+}
+
+// Override the default collapsed state
+.nav-collapse.collapse {
+  height: auto;
+  overflow: visible;
+}
+
+
+// Brand: website or project name
+// -------------------------
+.navbar .brand {
+  float: left;
+  display: block;
+  // Vertically center the text given @navbar-height
+  padding: ((@navbar-height - @line-height-base) / 2) 20px ((@navbar-height - @line-height-base) / 2);
+  margin-left: -20px; // negative indent to left-align the text down the page
+  font-size: 20px;
+  font-weight: 200;
+  color: @navbar-brand-color;
+  text-shadow: 0 1px 0 @navbar-background-highlight;
+  &:hover {
+    text-decoration: none;
+  }
+}
+
+// Plain text in topbar
+// -------------------------
+.navbar-text {
+  margin-bottom: 0;
+  line-height: @navbar-height;
+  color: @navbar-text;
+}
+
+// Janky solution for now to account for links outside the .nav
+// -------------------------
+.navbar-link {
+  color: @navbar-link-color;
+  &:hover {
+    color: @navbar-link-color-hover;
+  }
+}
+
+// Dividers in navbar
+// -------------------------
+.navbar .divider-vertical {
+  height: @navbar-height;
+  margin: 0 9px;
+  border-left: 1px solid @navbar-background;
+  border-right: 1px solid @navbar-background-highlight;
+}
+
+// Buttons in navbar
+// -------------------------
+.navbar .btn,
+.navbar .btn-group {
+  .navbarVerticalAlign(30px); // Vertically center in navbar
+}
+.navbar .btn-group .btn,
+.navbar .input-prepend .btn,
+.navbar .input-append .btn {
+  margin-top: 0; // then undo the margin here so we don't accidentally double it
+}
+
+// Navbar forms
+// -------------------------
+.navbar-form {
+  margin-bottom: 0; // remove default bottom margin
+  .clearfix();
+  input,
+  select,
+  .radio,
+  .checkbox {
+    .navbarVerticalAlign(30px); // Vertically center in navbar
+  }
+  input,
+  select,
+  .btn {
+    display: inline-block;
+    margin-bottom: 0;
+  }
+  input[type="image"],
+  input[type="checkbox"],
+  input[type="radio"] {
+    margin-top: 3px;
+  }
+  .input-append,
+  .input-prepend {
+    margin-top: 5px;
+    white-space: nowrap; // preven two  items from separating within a .navbar-form that has .pull-left
+    input {
+      margin-top: 0; // remove the margin on top since it's on the parent
+    }
+  }
+}
+
+// Navbar search
+// -------------------------
+.navbar-search {
+  position: relative;
+  float: left;
+  .navbarVerticalAlign(30px); // Vertically center in navbar
+  margin-bottom: 0;
+  .search-query {
+    margin-bottom: 0;
+    padding: 4px 14px;
+    #font > .sans-serif(13px, normal, 1);
+    border-radius: 15px; // redeclare because of specificity of the type attribute
+  }
+}
+
+
+
+// Static navbar
+// -------------------------
+
+.navbar-static-top {
+  position: static;
+  margin-bottom: 0; // remove 18px margin for default navbar
+  border-radius: 0;
+}
+
+
+
+// Fixed navbar
+// -------------------------
+
+// Shared (top/bottom) styles
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+  position: fixed;
+  right: 0;
+  left: 0;
+  z-index: @zindex-navbar-fixed;
+  margin-bottom: 0; // remove 18px margin for default navbar
+  border-radius: 0;
+}
+
+// Reset container width
+// Required here as we reset the width earlier on and the grid mixins don't override early enough
+.navbar-static-top .container,
+.navbar-fixed-top .container,
+.navbar-fixed-bottom .container {
+  #grid > .core > .span(@grid-columns);
+}
+
+// Fixed to top
+.navbar-fixed-top {
+  top: 0;
+}
+
+// Fixed to bottom
+.navbar-fixed-bottom {
+  bottom: 0;
+}
+
+
+
+// NAVIGATION
+// ----------
+
+.navbar .nav {
+  position: relative;
+  left: 0;
+  display: block;
+  float: left;
+  margin: 0 10px 0 0;
+}
+.navbar .nav.pull-right {
+  float: right; // redeclare due to specificity
+  margin-right: 0; // remove margin on float right nav
+}
+.navbar .nav > li {
+  float: left;
+}
+
+// Links
+.navbar .nav > li > a {
+  float: none;
+  // Vertically center the text given @navbar-height
+  padding: ((@navbar-height - @line-height-base) / 2) 15px ((@navbar-height - @line-height-base) / 2);
+  color: @navbar-link-color;
+  text-decoration: none;
+  text-shadow: 0 1px 0 @navbar-background-highlight;
+}
+.navbar .nav .dropdown-toggle .caret {
+  margin-top: 8px;
+}
+
+// Hover
+.navbar .nav > li > a:focus,
+.navbar .nav > li > a:hover {
+  background-color: @navbar-link-background-hover; // "transparent" is default to differentiate :hover from .active
+  color: @navbar-link-color-hover;
+  text-decoration: none;
+}
+
+// Active nav items
+.navbar .nav > .active > a,
+.navbar .nav > .active > a:hover,
+.navbar .nav > .active > a:focus {
+  color: @navbar-link-color-active;
+  text-decoration: none;
+  background-color: @navbar-link-background-active;
+}
+
+// Navbar button for toggling navbar items in responsive layouts
+// These definitions need to come after '.navbar .btn'
+.navbar .btn-navbar {
+  display: none;
+  float: right;
+  padding: 7px 10px;
+  margin-left: 5px;
+  margin-right: 5px;
+  .buttonBackground(darken(@navbar-background-highlight, 5%), darken(@navbar-background, 5%));
+  .box-shadow(~"inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075)");
+}
+.navbar .btn-navbar .icon-bar {
+  display: block;
+  width: 18px;
+  height: 2px;
+  background-color: #f5f5f5;
+  border-radius: 1px;
+  .box-shadow(0 1px 0 rgba(0,0,0,.25));
+}
+.btn-navbar .icon-bar + .icon-bar {
+  margin-top: 3px;
+}
+
+
+
+// Dropdown menus
+// --------------
+
+// Menu position and menu carets
+.navbar .nav > li > .dropdown-menu {
+  &:before {
+    content: '';
+    display: inline-block;
+    border-left:   7px solid transparent;
+    border-right:  7px solid transparent;
+    border-bottom: 7px solid #ccc;
+    border-bottom-color: @dropdown-border;
+    position: absolute;
+    top: -7px;
+    left: 9px;
+  }
+  &:after {
+    content: '';
+    display: inline-block;
+    border-left:   6px solid transparent;
+    border-right:  6px solid transparent;
+    border-bottom: 6px solid @dropdown-background;
+    position: absolute;
+    top: -6px;
+    left: 10px;
+  }
+}
+// Menu position and menu caret support for dropups via extra dropup class
+.navbar-fixed-bottom .nav > li > .dropdown-menu {
+  &:before {
+    border-top: 7px solid #ccc;
+    border-top-color: @dropdown-border;
+    border-bottom: 0;
+    bottom: -7px;
+    top: auto;
+  }
+  &:after {
+    border-top: 6px solid @dropdown-background;
+    border-bottom: 0;
+    bottom: -6px;
+    top: auto;
+  }
+}
+
+// Caret should match text color on hover
+.navbar .nav li.dropdown > a:hover .caret {
+  border-top-color: @navbar-link-color-hover;
+  border-bottom-color: @navbar-link-color-hover;
+}
+
+// Remove background color from open dropdown
+.navbar .nav li.dropdown.open > .dropdown-toggle,
+.navbar .nav li.dropdown.active > .dropdown-toggle,
+.navbar .nav li.dropdown.open.active > .dropdown-toggle {
+  background-color: @navbar-link-background-active;
+  color: @navbar-link-color-active;
+}
+.navbar .nav li.dropdown > .dropdown-toggle .caret {
+  border-top-color: @navbar-link-color;
+  border-bottom-color: @navbar-link-color;
+}
+.navbar .nav li.dropdown.open > .dropdown-toggle .caret,
+.navbar .nav li.dropdown.active > .dropdown-toggle .caret,
+.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret {
+  border-top-color: @navbar-link-color-active;
+  border-bottom-color: @navbar-link-color-active;
+}
+
+// Right aligned menus need alt position
+.navbar .pull-right > li > .dropdown-menu,
+.navbar .nav > li > .dropdown-menu.pull-right {
+  left: auto;
+  right: 0;
+  &:before {
+    left: auto;
+    right: 12px;
+  }
+  &:after {
+    left: auto;
+    right: 13px;
+  }
+  .dropdown-menu {
+    left: auto;
+    right: 100%;
+    margin-left: 0;
+    margin-right: -1px;
+    border-radius: 6px 0 6px 6px;
+  }
+}
+
+
+// Inverted navbar
+// -------------------------
+
+.navbar-inverse {
+  background-color: @navbar-inverse-background;
+
+  .brand,
+  .nav > li > a {
+    color: @navbar-inverse-link-color;
+    text-shadow: 0 -1px 0 rgba(0,0,0,.25);
+    &:hover {
+      color: @navbar-inverse-link-color-hover;
+    }
+  }
+
+  .brand {
+    color: @navbar-inverse-brand-color;
+  }
+
+  .navbar-text {
+    color: @navbar-inverse-text;
+  }
+
+  .nav > li > a:focus,
+  .nav > li > a:hover {
+    background-color: @navbar-inverse-link-background-hover;
+    color: @navbar-inverse-link-color-hover;
+  }
+
+  .nav .active > a,
+  .nav .active > a:hover,
+  .nav .active > a:focus {
+    color: @navbar-inverse-link-color-active;
+    background-color: @navbar-inverse-link-background-active;
+  }
+
+  // Inline text links
+  .navbar-link {
+    color: @navbar-inverse-link-color;
+    &:hover {
+      color: @navbar-inverse-link-color-hover;
+    }
+  }
+
+  // Dividers in navbar
+  .divider-vertical {
+    border-left-color: @navbar-inverse-background;
+    border-right-color: @navbar-inverse-background-highlight;
+  }
+
+  // Dropdowns
+  .nav li.dropdown.open > .dropdown-toggle,
+  .nav li.dropdown.active > .dropdown-toggle,
+  .nav li.dropdown.open.active > .dropdown-toggle {
+    background-color: @navbar-inverse-link-background-active;
+    color: @navbar-inverse-link-color-active;
+  }
+  .nav li.dropdown > a:hover .caret {
+    border-top-color: @navbar-inverse-link-color-active;
+    border-bottom-color: @navbar-inverse-link-color-active;
+  }
+  .nav li.dropdown > .dropdown-toggle .caret {
+    border-top-color: @navbar-inverse-link-color;
+    border-bottom-color: @navbar-inverse-link-color;
+  }
+  .nav li.dropdown.open > .dropdown-toggle .caret,
+  .nav li.dropdown.active > .dropdown-toggle .caret,
+  .nav li.dropdown.open.active > .dropdown-toggle .caret {
+    border-top-color: @navbar-inverse-link-color-active;
+    border-bottom-color: @navbar-inverse-link-color-active;
+  }
+
+  // Navbar search
+  .navbar-search {
+    .search-query {
+      color: #fff;
+      background-color: @navbar-inverse-search-background;
+      border-color: @navbar-inverse-search-border;
+      .box-shadow(~"inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15)");
+      .transition(none);
+      .placeholder(@navbar-inverse-search-placeholder-color);
+
+      // Focus states (we use .focused since IE8 and down doesn't support :focus)
+      &:focus,
+      &.focused {
+        padding: 5px 15px;
+        color: @grayDark;
+        text-shadow: 0 1px 0 #fff;
+        background-color: @navbar-inverse-search-background-focus;
+        border: 0;
+        .box-shadow(0 0 3px rgba(0,0,0,.15));
+        outline: 0;
+      }
+    }
+  }
+
+  // Navbar collapse button
+  .btn-navbar {
+    .buttonBackground(darken(@navbar-inverse-background-highlight, 5%), darken(@navbar-inverse-background, 5%));
+  }
+
+}
+
+*/
+
+/*
 // Grid system and page structure
-@import "scaffolding.less";
 @import "grid.less";
 
 // Base CSS
diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index c609cbeaa8..98a3bebe60 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -2,6 +2,7 @@
 
 
 /* Page =================================================== */
+/*
 html {
   background-color: #fff;
   font-size: 62.5%;
@@ -38,9 +39,10 @@ p {
 img {
   max-width: 100%;
 }
-
+*/
 
 /* Typography =================================================== */
+/*
 h1,
 h2,
 h3,
@@ -92,7 +94,7 @@ small {
 }
 ul,
 ol {
-  margin: 0 0 .5em;
+  margin: 0 0 1em;
   padding: 0 0 0 28px;
 }
 li ul,
@@ -124,10 +126,10 @@ a {
 a:hover {
   text-decoration: underline;
 }
+*/
 
 
-
-.collapse {
+/*.collapse {
   position: relative;
   height: 0;
   overflow: hidden;
@@ -135,13 +137,13 @@ a:hover {
 .collapse.in {
   height: auto;
 }
+*/
 
 
-
-.nav {
+/*.nav {
   margin-bottom: 0;
-  padding-left: 0; /* override default ul/ol */
-  overflow: hidden; /* clearfix */
+  padding-left: 0;
+  overflow: hidden;
 }
 .nav > li {
   display: block;
@@ -154,11 +156,11 @@ a:hover {
 .nav > li > a:hover {
   text-decoration: none;
   background-color: #f5f5f5;
-}
+}*/
 
 
-.nav-list > li > a {
-  margin-bottom: -1px; /* tuck up the following item to make 1px border */
+/*.nav-list > li > a {
+  margin-bottom: -1px; // tuck up the following item to make 1px border
   border: 1px solid #ddd;
 }
 .nav-list > li:first-child > a {
@@ -166,7 +168,7 @@ a:hover {
   border-top-right-radius: 5px;
 }
 .nav-list > li:last-child > a {
-  margin-bottom: 0; /* undo the tuck */
+  margin-bottom: 0;  undo the tuck
    border-bottom-left-radius: 5px;
   border-bottom-right-radius: 5px;
 }
@@ -175,17 +177,17 @@ a:hover {
   color: #fff;
   background-color: #428bca;
   border-color: #428bca;
-  z-index: 2; /* Bring active item forward so border sits on top of next element */
-}
+  z-index: 2; // Bring active item forward so border sits on top of next element
+}*/
 
 
 
 
 
-.navbar {
+/*.navbar {
   padding: 15px;
   background-color: #eee;
-  overflow: hidden; /* clearfix */
+  overflow: hidden;
 }
 
 .navbar .brand {
@@ -199,10 +201,10 @@ a:hover {
 .navbar .brand:hover {
   text-decoration: none;
   background-color: #ddd;
-}
+}*/
 
-.navbar .nav {
-  margin-top: 15px; /* space out from .navbar .brand and .btn-navbar */
+/*.navbar .nav {
+  margin-top: 15px;
 }
 .navbar .nav > li > a {
   line-height: 20px;
@@ -213,8 +215,8 @@ a:hover {
 .navbar .nav > .active > a {
   background-color: #ddd;
 }
-
-.btn-navbar {
+*/
+/*.btn-navbar {
   float: right;
   padding: 10px 12px;
   background-color: #ddd;
@@ -230,10 +232,10 @@ a:hover {
 }
 .btn-navbar .icon-bar + .icon-bar {
   margin-top: 3px;
-}
+}*/
 
 
-.navbar-inverse {
+/*.navbar-inverse {
   background-color: #222;
 }
 .navbar-inverse .brand {
@@ -253,33 +255,33 @@ a:hover {
 }
 .navbar-inverse .btn-navbar {
   background-color: #444;
-}
+}*/
 
 
 
 
 
 
-.row {
+/*.row {
   margin-left: -10px;
   margin-right: -10px;
-  overflow: hidden; /* clearfix */
+  overflow: hidden;
 }
 [class^="span"] {
   padding-left: 10px;
   padding-right: 10px;
   -webkit-box-sizing: border-box;
-}
+}*/
 
 
 
 /* Disable iOS/WinMobile font size changes */
-@media screen and (max-device-width: 480px) {
+/*@media screen and (max-device-width: 480px) {
   html {
     -ms-text-size-adjust: none;
     -webkit-text-size-adjust: none;
   }
-}
+}*/
 
 
 @media screen and (min-width: 480px) {
@@ -399,6 +401,11 @@ body > .container {
   padding: 14px;
   margin-bottom: -1px;
 }
+.bs-docs-example p:last-child,
+.bs-docs-example ul:last-child,
+.bs-docs-example ol:last-child {
+  margin-bottom: 0;
+}
 .bs-docs-example + .prettyprint {
   margin-top: 0;
 }
diff --git a/less/bootstrap.less b/less/bootstrap.less
index c30be82cf4..8e60e41c00 100644
--- a/less/bootstrap.less
+++ b/less/bootstrap.less
@@ -15,12 +15,22 @@
 // Reset
 @import "normalize.less";
 
+// Core CSS
+@import "scaffolding.less";
+@import "type.less";
+@import "code.less";
+@import "grid.less";
+
+// Components: common
+@import "component-animations.less";
+
+// Components: Nav
+@import "navs.less";
+@import "navbar.less";
 
 
 /*
-
 // Grid system and page structure
-@import "scaffolding.less";
 @import "grid.less";
 
 // Base CSS
diff --git a/less/code.less b/less/code.less
index cf884cb83a..1adb3efd40 100644
--- a/less/code.less
+++ b/less/code.less
@@ -16,9 +16,9 @@ pre {
 // Inline code
 code {
   padding: 2px 4px;
-  color: #d14;
-  background-color: #f7f7f9;
-  border: 1px solid #e1e1e8;
+  font-size: 90%;
+  color: #c7254e;
+  background-color: #f9f2f4;
   white-space: nowrap;
 }
 
diff --git a/less/component-animations.less b/less/component-animations.less
index d614263a76..b25adc932a 100644
--- a/less/component-animations.less
+++ b/less/component-animations.less
@@ -11,7 +11,7 @@
   }
 }
 
-.collapse {
+/*.collapse {
   position: relative;
   height: 0;
   overflow: hidden;
@@ -19,4 +19,14 @@
   &.in {
     height: auto;
   }
+}*/
+
+.collapse {
+  position: relative;
+  height: 0;
+  overflow: hidden;
+  .transition(height .35s ease);
+}
+.collapse.in {
+  height: auto;
 }
diff --git a/less/grid.less b/less/grid.less
index 2e7a61d91c..2638ee0683 100644
--- a/less/grid.less
+++ b/less/grid.less
@@ -9,8 +9,23 @@
   max-width: 940px;
 }
 
+// Mobile-first defaults
+.row {
+  margin-left: -10px;
+  margin-right: -10px;
+  .clear_float();
+}
+[class^="span"] {
+  padding-left: 10px;
+  padding-right: 10px;
+  // Proper box-model (padding doesn't add to width)
+  -webkit-box-sizing: border-box;
+     -moz-box-sizing: border-box;
+          box-sizing: border-box;
+}
+
 // Fixed (940px)
-#grid > .core(@grid-column-width, @grid-gutter-width, @grid-row-width);
+// #grid > .core(@grid-column-width, @grid-gutter-width, @grid-row-width);
 
 // Reset utility classes due to specificity
 [class*="span"].pull-right {
diff --git a/less/mixins.less b/less/mixins.less
index eeab4bbb0b..b530495548 100644
--- a/less/mixins.less
+++ b/less/mixins.less
@@ -425,7 +425,7 @@
 .container-fixed() {
   margin-right: auto;
   margin-left: auto;
-  .clearfix();
+  .clear_float();
 }
 
 // Make a Grid
diff --git a/less/navbar.less b/less/navbar.less
index 70f501accb..82abf07950 100644
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -1,7 +1,92 @@
 //
-// Navbars (Redux)
+// Navbars
 // --------------------------------------------------
 
+// Wrapper and base class
+.navbar {
+  padding: 15px;
+  background-color: #eee;
+  .clear_float();
+}
+
+// Brand/project name
+.navbar .brand {
+  display: inline-block;
+  padding: 7px 15px;
+  font-size: 18px;
+  font-weight: bold;
+  line-height: 1;
+  &:hover {
+    text-decoration: none;
+    background-color: #ddd;
+  }
+}
+
+// Responsive navbar button
+.btn-navbar {
+  float: right;
+  padding: 10px 12px;
+  background-color: #ddd;
+  border: 0;
+  border-radius: 4px;
+
+  // Bars
+  .icon-bar {
+    display: block;
+    width: 20px;
+    height: 2px;
+    background-color: #fff;
+    border-radius: 1px;
+  }
+  .icon-bar + .icon-bar {
+    margin-top: 3px;
+  }
+}
+
+// Nav links
+.navbar {
+  .nav {
+    margin-top: 15px; // space out from .navbar .brand and .btn-navbar
+  }
+  .nav > li > a {
+    line-height: 20px;
+  }
+  .nav > li > a:hover {
+    background-color: #ddd;
+  }
+  .nav > .active > a {
+    background-color: #ddd;
+  }
+}
+
+// Inverse navbar
+.navbar-inverse {
+  background-color: #222;
+
+  .brand {
+    color: #fff;
+    &:hover {
+      background-color: #333;
+    }
+  }
+  .nav > li > a {
+    color: #fff;
+  }
+  .nav > li > a:hover {
+    background-color: #333;
+  }
+  .nav > .active > a {
+    background-color: #333;
+  }
+  .btn-navbar {
+    background-color: #444;
+  }
+}
+
+
+
+
+/*
 
 // COMMON STYLES
 // -------------
@@ -446,3 +531,5 @@
   }
 
 }
+
+*/
diff --git a/less/navs.less b/less/navs.less
index ff7fe51fa1..c8fb40d86c 100644
--- a/less/navs.less
+++ b/less/navs.less
@@ -8,22 +8,52 @@
 
 .nav {
   margin-left: 0;
-  margin-bottom: @line-height-base;
+  margin-bottom: 0;
+  padding-left: 0; // Override default ul/ol
   list-style: none;
-  .clearfix();
+  .clear_float();
 }
 .nav > li {
-  float: left;
+  display: block;
 }
 .nav > li > a {
+  position: relative;
   display: block;
-  padding: 8px 12px;
+  padding: 10px 15px;
 }
 .nav > li > a:hover {
   text-decoration: none;
   background-color: @grayLighter;
 }
 
+// Lists
+// -------------------------
+
+.nav-list > li > a {
+  margin-bottom: -1px; // pull up the following link for a 1px border between
+  border: 1px solid #e5e5e5;
+}
+.nav-list > li:first-child > a {
+   border-top-left-radius: @border-radius-base;
+  border-top-right-radius: @border-radius-base;
+}
+.nav-list > li:last-child > a {
+  border-radius: 0 0 6px 6px;
+   border-bottom-left-radius: @border-radius-base;
+  border-bottom-right-radius: @border-radius-base;
+}
+.nav-list > .active > a,
+.nav-list > .active > a:hover {
+  z-index: 2; // Bring active item forward so border sits on top of next element
+  color: #fff;
+  background-color: @link-color;
+  border-color: @link-color;
+}
+
+
+
+
+/*
 // Prevent IE8 from misplacing imgs
 // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989
 .nav > li > a > img {
@@ -55,9 +85,10 @@
 .nav .divider {
   .nav-divider();
 }
+*/
 
 
-
+/*
 // Tabs
 // -------------------------
 
@@ -269,3 +300,4 @@
   background-color: transparent;
   cursor: default;
 }
+*/
diff --git a/less/scaffolding.less b/less/scaffolding.less
index e596f26d0e..2f0189dd60 100644
--- a/less/scaffolding.less
+++ b/less/scaffolding.less
@@ -6,9 +6,30 @@
 // Body reset
 // -------------------------
 
+html {
+  font-size: 62.5%;
+  // Touch the Mobile Magic™
+  -webkit-overflow-scrolling: touch;
+  -webkit-tap-highlight-color: rgba(0,0,0,0);
+  -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+}
+
+// Disable iOS/WinMobile font size changes
+@media screen and (max-device-width: 480px) {
+  html {
+    -ms-text-size-adjust: none;
+    -webkit-text-size-adjust: none;
+  }
+}
+
 body {
   margin: 0;
   color: @text-color;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  font-size: 1.4rem;
+  line-height: 1.5;
   background-color: @body-background;
 }
 
diff --git a/less/type.less b/less/type.less
index 89e65fff85..39358e4e38 100644
--- a/less/type.less
+++ b/less/type.less
@@ -93,9 +93,10 @@ h4 small { font-size: @font-size-base; }
 // --------------------------------------------------
 
 // Unordered and Ordered lists
-ul, ol {
+ul,
+ol {
   padding: 0;
-  margin: 0 0 @line-height-base / 2 25px;
+  margin: 0 0 (@line-height-base / 2) 25px;
 }
 ul ul,
 ul ol,
@@ -138,7 +139,7 @@ dd {
 }
 // Horizontal layout (like forms)
 .dl-horizontal {
-  .clearfix(); // Ensure dl clears floats if empty dd elements present
+  .clear_float(); // Ensure dl clears floats if empty dd elements present
   dt {
     float: left;
     width: @component-offset-horizontal - 20;
diff --git a/less/variables.less b/less/variables.less
index 47009525ca..db99e40754 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -46,7 +46,7 @@
 @line-height-base:        20px;
 
 @headings-font-family:    inherit; // empty to use BS default, @font-family-base
-@headings-font-weight:    bold;    // instead of browser default, bold
+@headings-font-weight:    500;
 
 
 // Component sizing