diff --git a/pass/public/styles/index.less b/pass/public/styles/index.less
index e49660bb289991663553f36a961f4d4c9af88e9b..daaf8206dcfb84b8a2ab74bc8b53593633abdf3f 100644
--- a/pass/public/styles/index.less
+++ b/pass/public/styles/index.less
@@ -3,6 +3,10 @@
 @breakpoint-hero-medium: 800px;
 @breakpoint-hero-small: 500px;
 
+html {
+  scroll-behavior: smooth;
+}
+
 #hero {
   color: white;
   background-color: @color-main;
diff --git a/pass/views/index.ejs b/pass/views/index.ejs
index c9822ed68bd8d272e9af88004c2b9dbc38b137d6..57edcfc6bdd235cc32ad2088cba83153131f19c7 100644
--- a/pass/views/index.ejs
+++ b/pass/views/index.ejs
@@ -21,7 +21,7 @@
           </button>
         </div>
       </div>
-      <a class="call-to-action" href="#">So funktioniert es</a>
+      <a class="call-to-action" href="#how-it-works">So funktioniert es</a>
     </div>
   </div>
   <div id="advantages">