diff --git a/bower.json b/bower.json
index 417f96dd..74f11390 100644
--- a/bower.json
+++ b/bower.json
@@ -31,12 +31,12 @@
     "js/tests",
     "test-infra"
   ],
-  "dependencies": {
+  "x-private-dependencies": {
     "bootstrap": "git@github.com:rosskevin/bootstrap.git#v4-tmp-flex-master",
     "tether": "^1.1"
   },
-  "old-dependencies": {
-    "bootstrap": "v4-dev",
+  "dependencies": {
+    "bootstrap": "git@github.com:twbs/bootstrap.git#v4-dev",
     "tether": "^1.1"
   }
 }
diff --git a/package.json b/package.json
index 9a3f9824..9143d9b7 100644
--- a/package.json
+++ b/package.json
@@ -33,7 +33,7 @@
   },
   "license": "MIT",
   "dependencies": {
-    "bootstrap": "rosskevin/bootstrap#v4-tmp-flex-master",
+    "bootstrap": "twbs/bootstrap#v4-dev",
     "jquery": "^2.0",
     "tether": "^1.1.1"
   },
diff --git a/scss/_bootstrap.scss b/scss/_bootstrap.scss
index a1393edc..aa0c133c 100644
--- a/scss/_bootstrap.scss
+++ b/scss/_bootstrap.scss
@@ -1,4 +1,4 @@
-// FIXME: temporarily use the local bootstrap - waiting on flex enable navbar https://github.com/twbs/bootstrap/pull/18976
+// FIXME: only necessary because there isn't an underscored file - see https://github.com/twbs/bootstrap/issues/18350
 //@import "../bower_components/bootstrap/scss/
 //@import "../../bootstrap/scss/
 
@@ -7,6 +7,23 @@
 @import "bootstrap/scss/variables";
 @import "bootstrap/scss/mixins";
 
+// #853 start - https://github.com/twbs/bootstrap/pull/18976/files
+// hack
+@mixin pull-left {
+  float: left !important;
+  @if $enable-flex {
+    margin-right: auto;
+  }
+}
+@mixin pull-right {
+  float: right !important;
+  @if $enable-flex {
+    margin-left: auto;
+  }
+}
+// #853 end - https://github.com/twbs/bootstrap/pull/18976/files
+
+
 // Reset and dependencies
 @import "bootstrap/scss/normalize";
 @import "bootstrap/scss/print";
diff --git a/scss/_list-group.scss b/scss/_list-group.scss
index 96cd2825..32102dfb 100644
--- a/scss/_list-group.scss
+++ b/scss/_list-group.scss
@@ -6,6 +6,13 @@
 // - triple line 88dp
 
 .list-group {
+  // #853 start -- https://github.com/twbs/bootstrap/pull/18981/files
+  @if $enable-flex {
+    display: flex;
+    flex-direction: column;
+  }
+  // #853 end -- https://github.com/twbs/bootstrap/pull/18981/files
+
   flex-grow: 1;
 
   // Add 8dp of padding at the top and bottom of a list. One exception is at the top of a list with a subheader, because subheaders contain their own padding.
@@ -29,13 +36,22 @@
 }
 
 .list-group-item {
+  // #853 start -- https://github.com/twbs/bootstrap/pull/18981/files
+  @if $enable-flex {
+    display: flex;
+    flex-flow: row wrap;
+    align-items: center;
+  } @else {
+    display: block;
+  }
+  // #853 end -- https://github.com/twbs/bootstrap/pull/18981/files
   padding: 1rem;
   line-height: 1;
 
-  .list-group-item-text {    // word wrap? http://stackoverflow.com/a/26535469/2363935
+  .list-group-item-text { // word wrap? http://stackoverflow.com/a/26535469/2363935
     //flex-flow: row wrap;
     min-width: 0;
-    max-height: 2.188rem;  // 88dp tile total height
+    max-height: 2.188rem; // 88dp tile total height
     // FIXME: text overflow with ellipsis is not working
     //flex: 0 1 auto; //    http://stackoverflow.com/questions/12022288/how-to-keep-a-flex-item-from-overflowing-due-to-its-text
     overflow: hidden;
diff --git a/scss/_navbar.scss b/scss/_navbar.scss
index 120ebe24..f9f120af 100644
--- a/scss/_navbar.scss
+++ b/scss/_navbar.scss
@@ -4,186 +4,19 @@
   border-radius: 0;
   @include box-shadow($mdb-shadow-2dp);
 
-  //.navbar-brand {
-  //  position: relative;
-  //  height: 60px;
-  //  line-height: 30px;
-  //  color: inherit;
-  //  &:hover,
-  //  &:focus {
-  //    color: inherit;
-  //    background-color: transparent;
-  //  }
-  //}
-  //
-  //.navbar-text {
-  //  color: inherit;
-  //  margin-top: 20px;
-  //  margin-bottom: 20px;
-  //}
-  //
-  //.navbar-nav {
-  //  > li > a {
-  //    color: inherit;
-  //    padding-top: 20px;
-  //    padding-bottom: 20px;
-  //
-  //    &:hover,
-  //    &:focus {
-  //      color: inherit;
-  //      background-color: transparent;
-  //    }
-  //  }
-  //  > .active > a {
-  //    &,
-  //    &:hover,
-  //    &:focus {
-  //      color: inherit;
-  //      background-color: rgba($white, 0.1);
-  //    }
-  //  }
-  //  > .disabled > a {
-  //    &,
-  //    &:hover,
-  //    &:focus {
-  //      color: inherit;
-  //      background-color: transparent;
-  //      opacity: 0.9;
-  //    }
-  //  }
-  //}
-  //
-  //// Darken the responsive nav toggle
-  //.navbar-toggle {
-  //  border: 0;
-  //  &:hover,
-  //  &:focus {
-  //    background-color: transparent;
-  //  }
-  //  .icon-bar {
-  //    background-color: inherit;
-  //    border: 1px solid;
-  //  }
-  //}
-  //
-  //.navbar-default .navbar-toggle,
-  //.navbar-inverse .navbar-toggle {
-  //  border-color: transparent;
-  //}
-  //
-  //.navbar-collapse,
-  //
-  //// Dropdowns
-  //.navbar-nav {
-  //  > .open > a {
-  //    &,
-  //    &:hover,
-  //    &:focus {
-  //      background-color: transparent;
-  //      color: inherit;
-  //    }
-  //  }
-  //
-  //  @include media-breakpoint-down(md) {
-  //  //@media (max-width: $grid-float-breakpoint-max) {   //768px
-  //    .navbar-text {
-  //      color: inherit;
-  //      margin-top: 15px;
-  //      margin-bottom: 15px;
-  //    }
-  //
-  //    // Dropdowns get custom display
-  //    .open .dropdown-menu {
-  //      > .dropdown-header {
-  //        border: 0;
-  //        color: inherit;
-  //      }
-  //      .divider {
-  //        border-bottom: 1px solid;
-  //        opacity: 0.08;
-  //      }
-  //      > li > a {
-  //        color: inherit;
-  //        &:hover,
-  //        &:focus {
-  //          color: inherit;
-  //          background-color: transparent;
-  //        }
-  //      }
-  //      > .active > a {
-  //        &,
-  //        &:hover,
-  //        &:focus {
-  //          color: inherit;
-  //          background-color: transparent;
-  //        }
-  //      }
-  //      > .disabled > a {
-  //        &,
-  //        &:hover,
-  //        &:focus {
-  //          color: inherit;
-  //          background-color: transparent;
-  //        }
-  //      }
-  //    }
-  //  }
-  //}
-  //
-  //.navbar-link {
-  //  color: inherit;
-  //  &:hover {
-  //    color: inherit;
-  //  }
-  //}
-  //
-  //.btn-link {
-  //  color: inherit;
-  //  &:hover,
-  //  &:focus {
-  //    color: inherit;
-  //  }
-  //  &[disabled],
-  //  fieldset[disabled] & {
-  //    &:hover,
-  //    &:focus {
-  //      color: inherit;
-  //    }
-  //  }
-  //}
-  //
-  //  .mdb-form-group {
-  //    margin: 0;
-  //    padding: 0;
-  //  }
-  //
-  //  .mdb-form-group .form-control,
-  //  .form-control {
-  //    border-color: inherit;
-  //    color: inherit;
-  //    padding: 0;
-  //    margin: 0;
-  //  }
-  //
-  //// SASS conversion note: please mirror any content change in _mixins-shared.scss navbar-variations-content
-  //@include navbar-variations(unquote(".navbar"), unquote(""), $brand-primary);
-  //
-  //
-  //&-inverse {
-  //  background-color: $indigo;
-  //}
-  //
-  //@include media-breakpoint-down(lg) {
-  //  //@media (max-width: $screen-md-max) {  // 1200-1
-  //
-  //  .navbar-brand {
-  //    height: 50px;
-  //    padding: 10px 15px;
-  //  }
-  //
-  //  .navbar-nav > li > a {
-  //    padding-top: 15px;
-  //    padding-bottom: 15px;
-  //  }
-  //}
+  // #853 start - https://github.com/twbs/bootstrap/pull/18976/files
+  @if $enable-flex {
+    display: flex;
+    flex-flow: row nowrap;
+    flex-shrink: 0;
+    align-items: center;
+    align-self: stretch;
+
+    > * {
+      flex-shrink: 0;
+    }
+  } @else {
+    @include clearfix;
+  }
+  // #853 end - https://github.com/twbs/bootstrap/pull/18976/files
 }