diff --git a/app/templates/moduls/navigation.html.j2 b/app/templates/moduls/navigation.html.j2
index 3d7a714..d4f6660 100644
--- a/app/templates/moduls/navigation.html.j2
+++ b/app/templates/moduls/navigation.html.j2
@@ -41,19 +41,19 @@
             <span class="navbar-toggler-icon"></span>
         </button>
         <div class="collapse navbar-collapse" id="navbarNav{{menu_type}}">
-            <ul class="navbar-nav {% if menu_type == 'header' %}ms-auto{% endif %}">
+            <ul class="navbar-nav {% if menu_type == 'header' %}ms-auto{% endif %} btn-group">
                 {% for item in navigation[menu_type].children %}
                     {% if item.url %}
                         <!-- Single Item -->
                         <li class="nav-item">
-                            <a class="nav-link" href="{{ item.url }}" target="{{ item.target|default('_blank') }}" data-bs-toggle="tooltip" title="{{ item.description }}">
+                            <a class="nav-link btn btn-light" href="{{ item.url }}" target="{{ item.target|default('_blank') }}" data-bs-toggle="tooltip" title="{{ item.description }}">
                                 {{ render_icon_and_name(item) }}
                             </a>
                         </li>
                     {% else %}
                         <!-- Dropdown Menu -->
                         <li class="nav-item dropdown">
-                            <a class="nav-link dropdown-toggle" id="navbarDropdown{{ loop.index }}" role="button" data-bs-display="dynamic" aria-expanded="false">
+                            <a class="nav-link dropdown-toggle btn btn-light" id="navbarDropdown{{ loop.index }}" role="button" data-bs-display="dynamic" aria-expanded="false">
                                 {% if item.icon is defined and item.icon.class is defined %}
                                     {{ render_icon_and_name(item) }}
                                 {% else %}