diff --git a/src/functions.js b/src/functions.js
index 92a2af3..2eeac5f 100644
--- a/src/functions.js
+++ b/src/functions.js
@@ -39,6 +39,20 @@ export const isInViewport = element => {
 }
 
 
+
+/*
+** Smooth Scroll
+*/
+export const smoothScroll = (event, element = null) => {
+    document.querySelector(element).scrollIntoView({
+        behavior: 'smooth',
+        block: 'start'
+    })
+    event.preventDefault()
+}
+
+
+
 /*
 ** Random String Generator
 */
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index bf29f80..1329e21 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -99,7 +99,7 @@
         <div class="intro__description style-description">
             <p>{$site.description}</p>
 
-            <Button href="#choose" type="a" className="button" text="Explore locations">
+            <Button type="a" href="#choose" className="button" text="Explore locations" on:click={e => fn.smoothScroll(e, '#choose')}>
                 <IconGlobeSmall width="22" color="#666" />
             </Button>
         </div>