diff --git a/css/components/slide-nav.css b/css/components/slide-nav.css
index 6dec6c49292657bca7e7bf4819cfabd4d8c6ee0c..ce2a692312640ae1ebb9c1fd0e8a9f07e03d5ab3 100644
--- a/css/components/slide-nav.css
+++ b/css/components/slide-nav.css
@@ -1,16 +1,16 @@
 @media (max-width: 767px) {
-  .navbar-slide-nav {
+  .navbar-collapse {
     border-top: 0;
   }
-  .navbar-slide-nav .navbar-nav {
+  .navbar-collapse .navbar-nav {
     margin-right: 0;
     margin-left: 0;
   }
-  .navbar-slide-nav [class*="container"] {
+  .navbar-collapse [class*="container"] {
     background-color: inherit;
     border-color: inherit;
   }
-  .navbar-slide-nav .navbar-slide {
+  .navbar-collapse .navigation {
     position: fixed;
     top: 0;
     bottom: 0;
@@ -20,15 +20,19 @@
     height: 100%;
     margin: 0;
     overflow: auto;
-    background-color: inherit;
+    background-color: white;
     border-right: 1px solid;
     border-right-color: inherit;
+    padding-left: 0.25rem;
+  }
+  .bg-dark .navbar-collapse .navigation {
+    background-color: #17141f !important;
   }
-  .navbar-slide-nav .navbar-slide .navbar-nav .dropdown-menu li a {
+  .navbar-collapse .navigation .navbar-nav .dropdown-menu li a {
     width: 100%;
     white-space: normal;
   }
-  .navbar-slide-nav .navbar-form {
+  .navbar-collapse .navbar-form {
     width: 100%;
     margin: 8px 0;
     overflow: hidden;
@@ -36,10 +40,26 @@
   }
 }
 @media (min-width: 768px) {
-  .navbar-slide {
+  .navigation {
     display: block;
     width: auto !important;
     padding-right: 15px;
     padding-left: 15px;
   }
-}
\ No newline at end of file
+}
+
+.navbar-dark .navbar-toggler-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 16 16'%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' fill-rule='evenodd' d='M11.854 4.146a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708-.708l7-7a.5.5 0 0 1 .708 0z'/%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' fill-rule='evenodd' d='M4.146 4.146a.5.5 0 0 0 0 .708l7 7a.5.5 0 0 0 .708-.708l-7-7a.5.5 0 0 0-.708 0z'/%3e%3c/svg%3e");
+}
+
+.navbar-dark .collapsed .navbar-toggler-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
+}
+
+.navbar-light .navbar-toggler-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 16 16'%3e%3cpath stroke='rgba%280, 0, 0, 0.4%29' fill-rule='evenodd' d='M11.854 4.146a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708-.708l7-7a.5.5 0 0 1 .708 0z'/%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' fill-rule='evenodd' d='M4.146 4.146a.5.5 0 0 0 0 .708l7 7a.5.5 0 0 0 .708-.708l-7-7a.5.5 0 0 0-.708 0z'/%3e%3c/svg%3e");
+}
+
+.navbar-light .collapsed .navbar-toggler-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.4%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
+}
diff --git a/subtheme/templates/_page.html.twig b/subtheme/templates/_page.html.twig
index 30504dfdf91451f64e5dbcffbe3f89448e5eec88..fc34d2dd9d5ef6f9984a6413d451421eaabcc6a8 100644
--- a/subtheme/templates/_page.html.twig
+++ b/subtheme/templates/_page.html.twig
@@ -104,7 +104,7 @@
 	          </div>
             {% endif %}
             {% if sidebar_collapse %}
-              <button class="navbar-toggler navbar-toggler-left" type="button" data-toggle="collapse" data-target="#CollapsingLeft" aria-controls="CollapsingLeft" aria-expanded="false" aria-label="Toggle navigation"></button>
+              <button class="navbar-toggler navbar-toggler-left collapsed" type="button" data-toggle="collapse" data-target="#CollapsingLeft" aria-controls="CollapsingLeft" aria-expanded="false" aria-label="Toggle navigation"></button>
             {% endif %}
           {% if container_navbar %}
           </div>
diff --git a/templates/layout/page.html.twig b/templates/layout/page.html.twig
index 73a83c62295ebc046190b2e0546c1546247ec642..a12b840b2b07eb1d7b70038d20ea384fd90c4be3 100644
--- a/templates/layout/page.html.twig
+++ b/templates/layout/page.html.twig
@@ -105,7 +105,7 @@
 	          </div>
             {% endif %}
             {% if sidebar_collapse %}
-              <button class="navbar-toggler navbar-toggler-left" type="button" data-toggle="collapse" data-target="#CollapsingLeft" aria-controls="CollapsingLeft" aria-expanded="false" aria-label="Toggle navigation"></button>
+              <button class="navbar-toggler navbar-toggler-left collapsed" type="button" data-toggle="collapse" data-target="#CollapsingLeft" aria-controls="CollapsingLeft" aria-expanded="false" aria-label="Toggle navigation"></button>
             {% endif %}
           {% if container_navbar %}
           </div>