diff --git a/src/App.vue b/src/App.vue
index 35a743c..3a56c7c 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -35,6 +35,5 @@
 </script>
 
 <style lang="scss">
-//@import '@/assets/styles/_obmc-custom';
-//@import './assets/styles/bootstrap/_helpers.scss';
+@import '@/assets/styles/_obmc-custom';
 </style>
diff --git a/src/assets/styles/bmc/custom/_buttons.scss b/src/assets/styles/bmc/custom/_buttons.scss
index 597766c..0ab7baa 100644
--- a/src/assets/styles/bmc/custom/_buttons.scss
+++ b/src/assets/styles/bmc/custom/_buttons.scss
@@ -73,7 +73,7 @@
   position: absolute;
   right: 0;
   top: 0;
-  //z-index: $zindex-dropdown + 1;
+  z-index: $zindex-dropdown + 1;
 }
 
 // Contain input buttons within input
diff --git a/src/assets/styles/bmc/custom/_dropdown.scss b/src/assets/styles/bmc/custom/_dropdown.scss
index 56d2ace..82dda86 100644
--- a/src/assets/styles/bmc/custom/_dropdown.scss
+++ b/src/assets/styles/bmc/custom/_dropdown.scss
@@ -1,8 +1,6 @@
-@import 'bootstrap/dist/css/bootstrap.css';
-
 // Make calendar visible over the table
 .dropdown-menu {
-  //z-index: $zindex-dropdown + 1;
+  z-index: $zindex-dropdown + 1;
   padding: 0;
 }
 .dropdown-item {
@@ -30,4 +28,4 @@
       box-shadow: inset 0 0 0 2px theme-color("primary");
     }
   }
-}
\ No newline at end of file
+}
diff --git a/src/assets/styles/bmc/custom/_tables.scss b/src/assets/styles/bmc/custom/_tables.scss
index deeddc3..e8b5a83 100644
--- a/src/assets/styles/bmc/custom/_tables.scss
+++ b/src/assets/styles/bmc/custom/_tables.scss
@@ -1,8 +1,6 @@
-@import 'bootstrap/dist/css/bootstrap.css'
-
 .table {
   position: relative;
-  //z-index: $zindex-dropdown;
+  z-index: $zindex-dropdown;
 
   td {
     border-top: 1px solid gray("300");
diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue
index 25c0f2b..b7c417f 100644
--- a/src/components/AppHeader/AppHeader.vue
+++ b/src/components/AppHeader/AppHeader.vue
@@ -249,9 +249,6 @@
 </script>
 
 <style lang="scss">
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 @mixin focus-box-shadow($padding-color: $navbar-color, $outline-color: $white) {
   box-shadow:
     inset 0 0 0 3px $padding-color,
@@ -262,11 +259,11 @@
     position: absolute;
     top: -60px;
     left: 0.5rem;
-    //z-index: $zindex-popover;
-    //transition: $duration--moderate-01 $exit-easing--expressive;
+    z-index: $zindex-popover;
+    transition: $duration--moderate-01 $exit-easing--expressive;
     &:focus {
       top: 0.5rem;
-      //transition-timing-function: $entrance-easing--expressive;
+      transition-timing-function: $entrance-easing--expressive;
     }
   }
   .navbar-text,
@@ -295,7 +292,6 @@
   .navbar {
     padding: 0;
     background-color: $navbar-color;
-
     @include media-breakpoint-up($responsive-layout-bp) {
       height: $header-height;
     }
diff --git a/src/components/AppNavigation/AppNavigation.vue b/src/components/AppNavigation/AppNavigation.vue
index eb8c2c6..45a95f5 100644
--- a/src/components/AppNavigation/AppNavigation.vue
+++ b/src/components/AppNavigation/AppNavigation.vue
@@ -103,10 +103,7 @@
 };
 </script>
 
-<style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
+<style scoped lang="scss">
 svg {
   fill: currentColor;
   height: 1.2rem;
diff --git a/src/components/Global/ButtonBackToTop.vue b/src/components/Global/ButtonBackToTop.vue
index f8d8b88..6d2f740 100644
--- a/src/components/Global/ButtonBackToTop.vue
+++ b/src/components/Global/ButtonBackToTop.vue
@@ -47,9 +47,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .btn-top {
   position: fixed;
   bottom: 24px;
diff --git a/src/components/Global/FormFile.vue b/src/components/Global/FormFile.vue
index bb3b46f..fc9dd32 100644
--- a/src/components/Global/FormFile.vue
+++ b/src/components/Global/FormFile.vue
@@ -84,9 +84,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .form-control-file {
   opacity: 0;
   height: 0;
diff --git a/src/components/Global/InfoTooltip.vue b/src/components/Global/InfoTooltip.vue
index f5063e9..fc80216 100644
--- a/src/components/Global/InfoTooltip.vue
+++ b/src/components/Global/InfoTooltip.vue
@@ -31,9 +31,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .btn-tooltip {
   padding: 0;
   line-height: 1em;
diff --git a/src/components/Global/InputPasswordToggle.vue b/src/components/Global/InputPasswordToggle.vue
index fadb99a..b682cd5 100644
--- a/src/components/Global/InputPasswordToggle.vue
+++ b/src/components/Global/InputPasswordToggle.vue
@@ -53,9 +53,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .input-password-toggle-container {
   position: relative;
 }
diff --git a/src/components/Global/LoadingBar.vue b/src/components/Global/LoadingBar.vue
index 49f2611..8b63093 100644
--- a/src/components/Global/LoadingBar.vue
+++ b/src/components/Global/LoadingBar.vue
@@ -74,9 +74,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .progress {
   position: absolute;
   left: 0;
diff --git a/src/components/Global/PageContainer.vue b/src/components/Global/PageContainer.vue
index 0de5fe7..ab4adb6 100644
--- a/src/components/Global/PageContainer.vue
+++ b/src/components/Global/PageContainer.vue
@@ -17,10 +17,6 @@
 };
 </script>
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
-@import 'bootstrap/dist/css/bootstrap.css';
 main {
   width: 100%;
   height: 100%;
diff --git a/src/components/Global/PageSection.vue b/src/components/Global/PageSection.vue
index 15aa383..dd39ddd 100644
--- a/src/components/Global/PageSection.vue
+++ b/src/components/Global/PageSection.vue
@@ -18,9 +18,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .page-section {
   margin-bottom: $spacer * 4;
 }
diff --git a/src/components/Global/PageTitle.vue b/src/components/Global/PageTitle.vue
index ca7f608..4f9ce5e 100644
--- a/src/components/Global/PageTitle.vue
+++ b/src/components/Global/PageTitle.vue
@@ -40,9 +40,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .page-title {
   margin-bottom: $spacer * 2;
 }
diff --git a/src/components/Global/Search.vue b/src/components/Global/Search.vue
index 5c51678..65da87b 100644
--- a/src/components/Global/Search.vue
+++ b/src/components/Global/Search.vue
@@ -73,9 +73,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .search-input {
   padding-left: ($spacer * 2);
 }
diff --git a/src/components/Global/StatusIcon.vue b/src/components/Global/StatusIcon.vue
index 6c1505e..4552633 100644
--- a/src/components/Global/StatusIcon.vue
+++ b/src/components/Global/StatusIcon.vue
@@ -34,9 +34,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .status-icon {
   vertical-align: text-bottom;
 
diff --git a/src/components/Global/TableFilter.vue b/src/components/Global/TableFilter.vue
index 2ed88bf..ba77720 100644
--- a/src/components/Global/TableFilter.vue
+++ b/src/components/Global/TableFilter.vue
@@ -111,11 +111,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
-@import 'bootstrap/dist/css/bootstrap.css';
-
 .badge {
   margin-right: $spacer / 2;
 }
diff --git a/src/components/Global/TableToolbar.vue b/src/components/Global/TableToolbar.vue
index 85d7c9c..0bdb87b 100644
--- a/src/components/Global/TableToolbar.vue
+++ b/src/components/Global/TableToolbar.vue
@@ -71,17 +71,12 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
-@import 'bootstrap/dist/css/bootstrap.css';
-
 $toolbar-height: 46px;
 
 .toolbar-container {
   width: 100%;
   position: relative;
-  //z-index: $zindex-dropdown + 1;
+  z-index: $zindex-dropdown + 1;
 }
 
 .toolbar-content {
diff --git a/src/layouts/AppLayout.vue b/src/layouts/AppLayout.vue
index 4f46848..2002269 100644
--- a/src/layouts/AppLayout.vue
+++ b/src/layouts/AppLayout.vue
@@ -70,9 +70,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .app-container {
   display: grid;
   grid-template-columns: 100%;
diff --git a/src/layouts/LoginLayout.vue b/src/layouts/LoginLayout.vue
index a79228f..36a070c 100644
--- a/src/layouts/LoginLayout.vue
+++ b/src/layouts/LoginLayout.vue
@@ -24,7 +24,7 @@
         <div class="login-aside__logo-bmc">
           <img
             svg-inline
-            height="60px"
+            height="60"
             src="@/assets/images/built-on-openbmc-logo.svg"
             alt="Built on OpenBMC"
           />
@@ -44,16 +44,9 @@
     };
   },
 };
-('');
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
-@import '@/assets/styles/bmc/helpers';
-@import '@/assets/styles/bootstrap/_helpers';
-
 .login-container {
   background: gray('100');
   display: flex;
diff --git a/src/main.js b/src/main.js
index 92c5c90..9637de9 100644
--- a/src/main.js
+++ b/src/main.js
@@ -13,12 +13,6 @@
 import store from './store';
 import eventBus from './eventBus';
 
-import './assets/styles/bmc/helpers/_index.scss';
-import './assets/styles/bootstrap/_helpers.scss';
-
-import 'bootstrap/dist/css/bootstrap.css';
-import 'bootstrap-vue/dist/bootstrap-vue.css';
-
 import {
   BootstrapVue,
   AlertPlugin,
diff --git a/src/views/ChangePassword/ChangePassword.vue b/src/views/ChangePassword/ChangePassword.vue
index 7778ebe..a6ac5ab 100644
--- a/src/views/ChangePassword/ChangePassword.vue
+++ b/src/views/ChangePassword/ChangePassword.vue
@@ -136,11 +136,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .change-password__form-container {
   @include media-breakpoint-up('md') {
     max-width: 360px;
diff --git a/src/views/Operations/Firmware/FirmwareCardsBios.vue b/src/views/Operations/Firmware/FirmwareCardsBios.vue
index 85e3df2..a2994cc 100644
--- a/src/views/Operations/Firmware/FirmwareCardsBios.vue
+++ b/src/views/Operations/Firmware/FirmwareCardsBios.vue
@@ -73,11 +73,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .page-section {
   margin-top: -$spacer * 1.5;
 }
diff --git a/src/views/Operations/Kvm/KvmConsole.vue b/src/views/Operations/Kvm/KvmConsole.vue
index 2b3084c..64ee897 100644
--- a/src/views/Operations/Kvm/KvmConsole.vue
+++ b/src/views/Operations/Kvm/KvmConsole.vue
@@ -176,14 +176,7 @@
 };
 </script>
 
-<style lang="scss">
-@import '@/assets/styles/bmc/custom/_kvm.scss';
-</style>
-
-<style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
+<style scoped lang="scss">
 .button-ctrl-alt-delete {
   float: right;
 }
diff --git a/src/views/Operations/RebootBmc/RebootBmc.vue b/src/views/Operations/RebootBmc/RebootBmc.vue
index 0865d77..d8c529c 100644
--- a/src/views/Operations/RebootBmc/RebootBmc.vue
+++ b/src/views/Operations/RebootBmc/RebootBmc.vue
@@ -88,7 +88,4 @@
 };
 </script>
 
-<style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/views/Operations/SerialOverLan/SerialOverLanConsole.vue b/src/views/Operations/SerialOverLan/SerialOverLanConsole.vue
index b711422..8f1c4bc 100644
--- a/src/views/Operations/SerialOverLan/SerialOverLanConsole.vue
+++ b/src/views/Operations/SerialOverLan/SerialOverLanConsole.vue
@@ -163,9 +163,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 @import '~xterm/css/xterm.css';
 
 #terminal {
diff --git a/src/views/Overview/OverviewCard.vue b/src/views/Overview/OverviewCard.vue
index 342bf98..7cfe558 100644
--- a/src/views/Overview/OverviewCard.vue
+++ b/src/views/Overview/OverviewCard.vue
@@ -77,9 +77,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 a {
   vertical-align: middle;
   font-size: 14px;
diff --git a/src/views/Overview/OverviewEvents.vue b/src/views/Overview/OverviewEvents.vue
index 0056af4..147f30c 100644
--- a/src/views/Overview/OverviewEvents.vue
+++ b/src/views/Overview/OverviewEvents.vue
@@ -91,9 +91,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .status-icon {
   vertical-align: text-top;
 }
diff --git a/src/views/Overview/OverviewQuickLinks.vue b/src/views/Overview/OverviewQuickLinks.vue
index 506de11..d9d7797 100644
--- a/src/views/Overview/OverviewQuickLinks.vue
+++ b/src/views/Overview/OverviewQuickLinks.vue
@@ -56,9 +56,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 dd,
 dl {
   margin: 0;
diff --git a/src/views/SecurityAndAccess/Policies/Policies.vue b/src/views/SecurityAndAccess/Policies/Policies.vue
index 6cba883..58d8363 100644
--- a/src/views/SecurityAndAccess/Policies/Policies.vue
+++ b/src/views/SecurityAndAccess/Policies/Policies.vue
@@ -257,9 +257,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .setting-section {
   border-bottom: 1px solid gray('300');
 }
diff --git a/src/views/SecurityAndAccess/UserManagement/UserManagement.vue b/src/views/SecurityAndAccess/UserManagement/UserManagement.vue
index cfe04a6..cb057a7 100644
--- a/src/views/SecurityAndAccess/UserManagement/UserManagement.vue
+++ b/src/views/SecurityAndAccess/UserManagement/UserManagement.vue
@@ -425,9 +425,6 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/styles/bmc/helpers/_index.scss';
-@import '@/assets/styles/bootstrap/_helpers.scss';
-
 .btn.collapsed {
   svg {
     transform: rotate(180deg);
diff --git a/tests/unit/Global/__snapshots__/InputPasswordToggle.spec.js.snap b/tests/unit/Global/__snapshots__/InputPasswordToggle.spec.js.snap
index f0df6ac..f691df2 100644
--- a/tests/unit/Global/__snapshots__/InputPasswordToggle.spec.js.snap
+++ b/tests/unit/Global/__snapshots__/InputPasswordToggle.spec.js.snap
@@ -4,11 +4,12 @@
 <div
   class="input-password-toggle-container"
 >
-   
-  <button
-    class="btn input-action-btn btn-icon-only btn-link isVisible"
-    title="global.ariaLabel.hidePassword"
-    type="button"
+  
+  
+  <b-button
+    class="input-action-btn btn-icon-only"
+    title="Show password as plain text. Note: this will visually expose your password on the screen."
+    variant="link"
   >
     <svg
       aria-hidden="true"
@@ -21,18 +22,17 @@
       xmlns="http://www.w3.org/2000/svg"
     >
       <path
-        d="M5.24,22.51l1.43-1.42A14.06,14.06,0,0,1,3.07,16C5.1,10.93,10.7,7,16,7a12.38,12.38,0,0,1,4,.72l1.55-1.56A14.72,14.72,0,0,0,16,5,16.69,16.69,0,0,0,1.06,15.66a1,1,0,0,0,0,.68A16,16,0,0,0,5.24,22.51Z"
+        d="M30.94,15.66A16.69,16.69,0,0,0,16,5,16.69,16.69,0,0,0,1.06,15.66a1,1,0,0,0,0,.68A16.69,16.69,0,0,0,16,27,16.69,16.69,0,0,0,30.94,16.34,1,1,0,0,0,30.94,15.66ZM16,25c-5.3,0-10.9-3.93-12.93-9C5.1,10.93,10.7,7,16,7s10.9,3.93,12.93,9C26.9,21.07,21.3,25,16,25Z"
       />
       <path
-        d="M12 15.73a4 4 0 013.7-3.7l1.81-1.82a6 6 0 00-7.33 7.33zM30.94 15.66A16.4 16.4 0 0025.2 8.22L30 3.41 28.59 2 2 28.59 3.41 30l5.1-5.1A15.29 15.29 0 0016 27 16.69 16.69 0 0030.94 16.34 1 1 0 0030.94 15.66zM20 16a4 4 0 01-6 3.44L19.44 14A4 4 0 0120 16zm-4 9a13.05 13.05 0 01-6-1.58l2.54-2.54a6 6 0 008.35-8.35l2.87-2.87A14.54 14.54 0 0128.93 16C26.9 21.07 21.3 25 16 25z"
+        d="M16,10a6,6,0,1,0,6,6A6,6,0,0,0,16,10Zm0,10a4,4,0,1,1,4-4A4,4,0,0,1,16,20Z"
       />
     </svg>
-     
     <span
       class="sr-only"
     >
-      global.ariaLabel.hidePassword
+      Show password as plain text. Note: this will visually expose your password on the screen.
     </span>
-  </button>
+  </b-button>
 </div>
 `;
diff --git a/vue.config.js b/vue.config.js
index e33918e..0fc5e6b 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -3,16 +3,37 @@
 const LimitChunkCountPlugin = webpack.optimize.LimitChunkCountPlugin;
 
 module.exports = {
-  devServer: {
-    server: {
-      type: 'https',
+  css: {
+    loaderOptions: {
+      sass: {
+        additionalData: (() => {
+          const envName = process.env.VUE_APP_ENV_NAME;
+          const hasCustomStyles =
+            process.env.CUSTOM_STYLES === 'true' ? true : false;
+          if (hasCustomStyles && envName !== undefined) {
+            return `
+              @import "@/assets/styles/bmc/helpers";
+              @import "@/env/assets/styles/_${envName}";
+              @import "@/assets/styles/bootstrap/_helpers";
+              @import '@/assets/styles/_obmc-custom.scss';
+            `;
+          } else {
+            return `
+              @import "@/assets/styles/bmc/helpers";
+              @import "@/assets/styles/bootstrap/_helpers";
+              @import '@/assets/styles/_obmc-custom.scss';
+            `;
+          }
+        })(), // immediately invoked function expression (IIFE)
+      },
     },
+  },
+  devServer: {
+    https: true,
     proxy: {
       '/': {
         target: process.env.BASE_URL,
         onProxyRes: (proxyRes) => {
-          // This header is ignored in the browser so removing
-          // it so we don't see warnings in the browser console
           delete proxyRes.headers['strict-transport-security'];
         },
       },
@@ -33,7 +54,6 @@
       .rule('vue')
       .use('vue-svg-inline-loader')
       .loader('vue-svg-inline-loader');
-
     config.module
       .rule('ico')
       .test(/\.ico$/)
@@ -45,7 +65,7 @@
     config.plugins.delete('preload');
     if (process.env.NODE_ENV === 'production') {
       config.plugin('html').tap((options) => {
-        options[0].filename = 'index.[contenthash:8].html';
+        options[0].filename = 'index.[hash:8].html';
         return options;
       });
     }
@@ -61,9 +81,6 @@
         default: false,
       },
     };
-    if (process.env.NODE_ENV === 'development') {
-      config.devtool = 'source-map';
-    }
     const crypto = require('crypto');
     const crypto_orig_createHash = crypto.createHash;
     crypto.createHash = (algorithm) =>