diff --git a/pages/UI/modals.html b/pages/UI/modals.html
index 8da9de1af..5da1f31bd 100644
--- a/pages/UI/modals.html
+++ b/pages/UI/modals.html
@@ -633,11 +633,6 @@
     <!-- Main content -->
     <section class="content">
       <div class="container-fluid">
-        <div class="callout callout-info">
-          <h4>Reminder!</h4>
-          Instructions for how to use modals are available on the
-          <a href="http://getbootstrap.com/javascript/#modals">Bootstrap documentation</a>
-        </div>
         <div class="row">
           <div class="col-md-12">
             <div class="card card-primary card-outline">
@@ -685,6 +680,10 @@
                 <button type="button" class="btn btn-default" data-toggle="modal" data-target="#modal-overlay">
                   Launch Modal with Overlay
                 </button>
+                <div class="text-muted mt-3">
+                  Instructions for how to use modals are available on the
+                  <a href="http://getbootstrap.com/javascript/#modals">Bootstrap documentation</a>
+                </div>
               </div>
               <!-- /.card -->
             </div>
diff --git a/pages/UI/navbar.html b/pages/UI/navbar.html
index 37b837282..2183c3d50 100644
--- a/pages/UI/navbar.html
+++ b/pages/UI/navbar.html
@@ -745,17 +745,17 @@
           <div class="card-body">
             <h4>Left Sided</h4>
             <div class="row">
-              <div class="col-3">
-                <div class="nav flex-column nav-tabs" id="vert-tabs-tab" role="tablist" aria-orientation="vertical">
+              <div class="col-5 col-sm-3">
+                <div class="nav flex-column nav-tabs h-100" id="vert-tabs-tab" role="tablist" aria-orientation="vertical">
                   <a class="nav-link active" id="vert-tabs-home-tab" data-toggle="pill" href="#vert-tabs-home" role="tab" aria-controls="vert-tabs-home" aria-selected="true">Home</a>
                   <a class="nav-link" id="vert-tabs-profile-tab" data-toggle="pill" href="#vert-tabs-profile" role="tab" aria-controls="vert-tabs-profile" aria-selected="false">Profile</a>
                   <a class="nav-link" id="vert-tabs-messages-tab" data-toggle="pill" href="#vert-tabs-messages" role="tab" aria-controls="vert-tabs-messages" aria-selected="false">Messages</a>
                   <a class="nav-link" id="vert-tabs-settings-tab" data-toggle="pill" href="#vert-tabs-settings" role="tab" aria-controls="vert-tabs-settings" aria-selected="false">Settings</a>
                 </div>
               </div>
-              <div class="col-9">
+              <div class="col-7 col-sm-9">
                 <div class="tab-content" id="vert-tabs-tabContent">
-                  <div class="tab-pane fade show active" id="vert-tabs-home" role="tabpanel" aria-labelledby="vert-tabs-home-tab">
+                  <div class="tab-pane text-left fade show active" id="vert-tabs-home" role="tabpanel" aria-labelledby="vert-tabs-home-tab">
                      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur. 
                   </div>
                   <div class="tab-pane fade" id="vert-tabs-profile" role="tabpanel" aria-labelledby="vert-tabs-profile-tab">
@@ -772,7 +772,7 @@
             </div>
             <h4 class="mt-4">Right Sided <small>(nav-tabs-right)</small></h4>
             <div class="row">
-              <div class="col-9">
+              <div class="col-7 col-sm-9">
                 <div class="tab-content" id="vert-tabs-tabContent">
                   <div class="tab-pane fade show active" id="vert-tabs-home" role="tabpanel" aria-labelledby="vert-tabs-home-tab">
                      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin malesuada lacus ullamcorper dui molestie, sit amet congue quam finibus. Etiam ultricies nunc non magna feugiat commodo. Etiam odio magna, mollis auctor felis vitae, ullamcorper ornare ligula. Proin pellentesque tincidunt nisi, vitae ullamcorper felis aliquam id. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id orci eu lectus blandit suscipit. Phasellus porta, ante et varius ornare, sem enim sollicitudin eros, at commodo leo est vitae lacus. Etiam ut porta sem. Proin porttitor porta nisl, id tempor risus rhoncus quis. In in quam a nibh cursus pulvinar non consequat neque. Mauris lacus elit, condimentum ac condimentum at, semper vitae lectus. Cras lacinia erat eget sapien porta consectetur. 
@@ -788,8 +788,8 @@
                   </div>
                 </div>
               </div>
-              <div class="col-3">
-                <div class="nav flex-column nav-tabs nav-tabs-right" id="vert-tabs-tab" role="tablist" aria-orientation="vertical">
+              <div class="col-5 col-sm-3">
+                <div class="nav flex-column nav-tabs nav-tabs-right h-100" id="vert-tabs-tab" role="tablist" aria-orientation="vertical">
                   <a class="nav-link active" id="vert-tabs-home-tab" data-toggle="pill" href="#vert-tabs-home" role="tab" aria-controls="vert-tabs-home" aria-selected="true">Home</a>
                   <a class="nav-link" id="vert-tabs-profile-tab" data-toggle="pill" href="#vert-tabs-profile" role="tab" aria-controls="vert-tabs-profile" aria-selected="false">Profile</a>
                   <a class="nav-link" id="vert-tabs-messages-tab" data-toggle="pill" href="#vert-tabs-messages" role="tab" aria-controls="vert-tabs-messages" aria-selected="false">Messages</a>
diff --git a/pages/layout/top-nav.html b/pages/layout/top-nav.html
index 3119dfc21..e52d779db 100644
--- a/pages/layout/top-nav.html
+++ b/pages/layout/top-nav.html
@@ -49,7 +49,7 @@ scratch. This page gets rid of all links and provides the needed markup only.
             <li class="dropdown-divider"></li>
 
             <!-- Level two dropdown-->
-            <li class="dropdown-submenu">
+            <li class="dropdown-submenu dropdown-hover">
               <a id="dropdownSubMenu2" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="dropdown-item dropdown-toggle">Hover for action</a>
               <ul aria-labelledby="dropdownSubMenu2" class="dropdown-menu border-0 shadow">
                 <li>