diff --git a/plinth/templates/base.html b/plinth/templates/base.html
index 603551c69..8996b3351 100644
--- a/plinth/templates/base.html
+++ b/plinth/templates/base.html
@@ -87,8 +87,8 @@
 
         {% block mainmenu_left %}
           <a href="{% url 'index' %}"  class="navbar-brand
-                   {% if not active_menu_urls %} menu_link_active {% else %}
-                   menu_link {% endif %}" title="{{ box_name }}">
+                   {% if not active_menu_urls %}active{% endif %}"
+             title="{{ box_name }}">
             <i class="fa fa-freedombox fa-2x fa-inverse" aria-hidden="true"></i>
           </a>
         {% endblock %}
@@ -115,7 +115,7 @@
                   {% url 'index' as index_url %}
                   <a href="{{ index_url }}" title='{% trans " Home" %}'
                      class="nav-link {% if not active_menu_urls %}
-                     menu_link_active {% else %} menu_link {% endif %}">
+                     active{% endif %}">
                     {% trans "Home" %}
                   </a>
                 </li>
@@ -123,7 +123,7 @@
                   {% url 'apps' as apps_url %}
                   <a href="{{ apps_url }}" title='{% trans " Apps" %}'
                      class="nav-link {% if apps_url in active_menu_urls %}
-                     menu_link_active {% else %} menu_link {% endif %}">
+                     active{% endif %}">
                     <span class="fa fa-th nav-icon"></span>
                     {% trans "Apps" %}
                   </a>
@@ -132,7 +132,7 @@
                   {% url 'system' as system_url %}
                   <a href="{{ system_url }}" title='{% trans " System" %}'
                      class="nav-link {% if system_url in active_menu_urls %}
-                     menu_link_active {% else %} menu_link {% endif %}">
+                     active{% endif %}">
                     <span class="fa fa-cog nav-icon"></span>
                     {% trans "System" %}
                   </a>
diff --git a/static/themes/default/css/main.css b/static/themes/default/css/main.css
index cc61c8c77..26d1f8f60 100644
--- a/static/themes/default/css/main.css
+++ b/static/themes/default/css/main.css
@@ -516,42 +516,36 @@ footer {
     padding: 0;
 }
 
-.main-header .navbar-nav > li > a,
-.main-header .navbar-toggler {
-    color: #FFF;
-}
-
 .main-header .nav-item .nav-link {
     padding: 0.9375rem !important;
     height: 3.25rem;
 }
 
-.main-header .nav-link,
-.main-header .nav-link:hover {
-    color: white;
+.main-header .nav-link {
+    --bs-navbar-color: white;
+    --bs-navbar-active-color: white;
+    --bs-navbar-hover-color: white;
+    --bs-nav-link-color: white;
+    --bs-nav-link-active-color: white;
+    --bs-nav-link-hover-color: white;
 }
 
 .main-header .navbar-toggler {
-    border: 1px solid #ddd;
+    --bs-navbar-toggler-border-color: white;
+    --bs-navbar-color: white;
     /* In mobile layout, during first setup, maintain the height of the navbar */
     margin: 0.6875rem 0;
 }
 
 @media screen and (max-width: 767px) {
-    .main-header .navbar-nav .dropdown-menu {
-        background-color: var(--freedombox-blue-color);
-    }
-
-    .main-header .navbar-nav > li > a:focus,
-    .main-header .navbar-nav > li > a:hover,
-    .main-header .navbar-nav li > form > input,
-    .main-header .navbar-nav li > form > input:focus,
-    .main-header .navbar-nav li > form > input:hover,
-    .main-header .navbar-nav .show a,
-    .main-header .navbar-nav .show a:hover,
-    .main-header .navbar-nav .show a:focus {
-        color: #FFF;
-        background: transparent;
+    .main-header .dropdown-menu {
+        --bs-dropdown-link-color: white;
+        --bs-dropdown-link-active-color: white;
+        --bs-dropdown-link-hover-color: white;
+        --bs-dropdown-link-hover-bg: var(--freedombox-blue-color);
+        --bs-dropdown-link-active-bg: var(--freedombox-blue-color);
+        --bs-dropdown-bg: var(--freedombox-blue-color);
+        --bs-dropdown-border-color: white;
     }
 
     .main-header .navbar-nav .nav-item:last-of-type .dropdown-menu {
@@ -559,6 +553,11 @@ footer {
     }
 }
 
+.main-header .navbar-brand.active,
+.main-header .nav-link.active {
+    border-bottom: white 3px solid;
+}
+
 /* Cards in Index, Apps, System and Help pages */
 .card-list {
     display: flex;
@@ -580,18 +579,6 @@ footer {
     border-bottom: var(--neutral-dark-color) solid 2px;
 }
 
-a.menu_link {
-    text-decoration: none;
-}
-
-a.menu_link:hover,a.menu_link:active {
-    text-decoration: none;
-}
-
-a.menu_link_active {
-    border-bottom: white 3px solid;
-}
-
 .card {
     display: block;
     line-height: 1.42857143;