diff --git a/webapp/components/AvatarMenu/AvatarMenu.vue b/webapp/components/AvatarMenu/AvatarMenu.vue
index a5b56ba43..5ec031e61 100644
--- a/webapp/components/AvatarMenu/AvatarMenu.vue
+++ b/webapp/components/AvatarMenu/AvatarMenu.vue
@@ -31,7 +31,10 @@
             slot-scope="item"
             :route="item.route"
             :parents="item.parents"
-            @click.native="closeMenu(false)"
+            @click.native="
+              closeMenu(false)
+              $emit('toggle-Mobile-Menu-view')
+            "
           >
             <base-icon :name="item.route.icon" />
             {{ item.route.name }}
diff --git a/webapp/components/HeaderMenu/HeaderMenu.vue b/webapp/components/HeaderMenu/HeaderMenu.vue
index f96a287e4..df0607402 100644
--- a/webapp/components/HeaderMenu/HeaderMenu.vue
+++ b/webapp/components/HeaderMenu/HeaderMenu.vue
@@ -191,13 +191,15 @@
             style="text-align: center"
           >
             <client-only>
-              <map-button />
+              <div @click="toggleMobileMenuView">
+                <map-button />
+              </div>
             </client-only>
           </ds-flex-item>
           <!-- avatar menu mobile -->
           <ds-flex-item :class="{ 'hide-mobile-menu': !toggleMobileMenu }" style="text-align: end">
             <client-only>
-              <avatar-menu placement="top" />
+              <avatar-menu placement="top" @toggle-Mobile-Menu-view="toggleMobileMenuView" />
             </client-only>
           </ds-flex-item>
         </ds-flex>
@@ -205,22 +207,33 @@
           <!-- dynamic branding menus -->
           <ul v-if="isHeaderMenu" class="dynamic-branding-mobil">
             <li v-for="item in menu" :key="item.name">
-              <a v-if="item.url" :href="item.url" :target="item.target">
+              <a
+                v-if="item.url"
+                :href="item.url"
+                :target="item.target"
+                @click="toggleMobileMenuView"
+              >
                 <ds-text size="large" bold>
                   {{ $t(item.nameIdent) }}
                 </ds-text>
               </a>
               <nuxt-link v-else :to="item.path">
-                <ds-text size="large" bold>
-                  {{ $t(item.nameIdent) }}
-                </ds-text>
+                <div @click="toggleMobileMenuView">
+                  <ds-text size="large" bold>
+                    {{ $t(item.nameIdent) }}
+                  </ds-text>
+                </div>
               </nuxt-link>
             </li>
           </ul>
           <hr />
           <!-- dynamic footer menu in header  -->
           <ul class="dynamic-footer-mobil">
-            <li v-for="pageParams in links.FOOTER_LINK_LIST" :key="pageParams.name">
+            <li
+              v-for="pageParams in links.FOOTER_LINK_LIST"
+              :key="pageParams.name"
+              @click="toggleMobileMenuView"
+            >
               <page-params-link :pageParams="pageParams">
                 {{ $t(pageParams.internalPage.footerIdent) }}
               </page-params-link>