diff --git a/frontend/src/components/Auth/Header.vue b/frontend/src/components/Auth/Header.vue
index 415167573..6d184462c 100644
--- a/frontend/src/components/Auth/Header.vue
+++ b/frontend/src/components/Auth/Header.vue
@@ -12,15 +12,14 @@
       <b-img class="header-img d-block d-lg-none" :src="sheet"></b-img>
       <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
 
-      <b-collapse id="nav-collapse" is-nav>
+      <b-collapse id="nav-collapse" is-nav class="mt-5 mt-lg-0">
         <b-navbar-nav class="ml-auto" right>
           <b-nav-item href="https://gradido.net/de/" target="_blank">
             {{ $t('auth.navbar.overGradido') }}
           </b-nav-item>
-          <b-nav-item class="ml-5">
-            <b-link to="/register">{{ $t('signup') }} {{ $t('|') }}</b-link>
-            <b-link to="/login">{{ $t('signin') }}</b-link>
-          </b-nav-item>
+          <b-nav-item class="ml-lg-5" to="/register">{{ $t('signup') }}</b-nav-item>
+          <span class="d-none d-lg-block mt-3">{{ $t('|') }}</span>
+          <b-nav-item to="/login">{{ $t('signin') }}</b-nav-item>
         </b-navbar-nav>
       </b-collapse>
     </b-navbar>
diff --git a/frontend/src/components/Auth/MobileStart.vue b/frontend/src/components/Auth/MobileStart.vue
index f71be3939..67316211e 100644
--- a/frontend/src/components/Auth/MobileStart.vue
+++ b/frontend/src/components/Auth/MobileStart.vue
@@ -47,7 +47,7 @@ export default {
 .mobil-start-box {
   position: fixed;
   height: 100%;
-  z-index: 1000;
+  z-index: 10000;
 }
 .mobil-start-box-text {
   position: fixed;
diff --git a/frontend/src/components/Auth/NavbarSmall.vue b/frontend/src/components/Auth/NavbarSmall.vue
new file mode 100644
index 000000000..754cb8a35
--- /dev/null
+++ b/frontend/src/components/Auth/NavbarSmall.vue
@@ -0,0 +1,18 @@
+<template>
+  <div class="navbar-small text-center">
+    <b-navbar>
+       <b-collapse is-nav class="mt-5 mt-lg-0">
+        <b-navbar-nav class="ml-md-auto">
+          <b-nav-item class="ml-lg-5" to="/register">{{ $t('signup') }}</b-nav-item>
+          <span class="mt-3">{{ $t('|') }}</span>
+          <b-nav-item to="/login">{{ $t('signin') }}</b-nav-item>
+        </b-navbar-nav>
+      </b-collapse>
+    </b-navbar>
+  </div>
+</template>
+<script>
+export default {
+  name: 'NavbarSmall',
+}
+</script>
diff --git a/frontend/src/layouts/AuthLayout_gdd.vue b/frontend/src/layouts/AuthLayout_gdd.vue
index dc38a5c15..2face2798 100644
--- a/frontend/src/layouts/AuthLayout_gdd.vue
+++ b/frontend/src/layouts/AuthLayout_gdd.vue
@@ -15,10 +15,14 @@
           <b-button variant="gradido">{{ $t('auth.left.learnMore') }}</b-button>
         </div>
       </div>
-
       <b-row class="justify-content-md-center">
         <b-col sm="12" md="8" offset-lg="6" lg="6">
           <div class="right-content-box ml-2 ml-sm-4 mr-2 mr-sm-4">
+            <b-row class="d-none d-md-block d-lg-none mt-7">
+              <b-col class="zindex1000 mb--4">
+                <navbar-small />
+              </b-col>
+            </b-row>
             <b-row class="mt-5 pl-2 pl-md-0 pl-lg-0">
               <b-col cols="9">
                 <div class="h1 mb--2">{{ $t('welcome') }}</div>
@@ -57,15 +61,11 @@
               <b-row class="d-inline d-sm-inline d-md-none d-lg-none mb-3">
                 <b-col class="text-center">
                   <b-avatar src="img/brand/gradido_coin●.png" size="6rem"></b-avatar>
-                  <div>
-                    <span>
-                      <router-link to="login">{{ $t('signup') }}</router-link>
-                    </span>
-                    {{ $t('|') }}
-                    <span>
-                      <router-link to="register">{{ $t('signin') }}</router-link>
-                    </span>
-                  </div>
+                  <b-row class="mt-4">
+                    <b-col class="zindex1000 mb--4">
+                      <navbar-small />
+                    </b-col>
+                  </b-row>
                 </b-col>
               </b-row>
               <b-card-body class="">
@@ -83,6 +83,7 @@
 <script>
 import MobileStart from '@/components/Auth/MobileStart.vue'
 import AuthHeader from '@/components/Auth/Header.vue'
+import NavbarSmall from '@/components/Auth/NavbarSmall.vue'
 import Carousel from '@/components/Auth/Carousel.vue'
 import LanguageSwitch from '@/components/LanguageSwitch2'
 import AuthFooter from '@/components/Auth/Footer.vue'
@@ -92,6 +93,7 @@ export default {
   components: {
     MobileStart,
     AuthHeader,
+    NavbarSmall,
     Carousel,
     LanguageSwitch,
     AuthFooter,
@@ -172,6 +174,10 @@ export default {
   overflow: hidden;
 }
 
+.zindex1000 {
+  z-index: 1000;
+}
+
 @media screen and (min-width: 2000px) {
   .right-content {
     height: 100%;