diff --git a/about.html b/about.html
index d60f11d..4aa6a68 100644
--- a/about.html
+++ b/about.html
@@ -4,6 +4,8 @@
     <title>About Bethany - WillowMeCreations</title>
     <link rel="stylesheet" type="text/css" href="style.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kalnia">
 </head>
 <body>
     <div class="container">
diff --git a/contact.html b/contact.html
index 43cca09..5376437 100644
--- a/contact.html
+++ b/contact.html
@@ -4,6 +4,8 @@
     <title>Contact Us - WillowMeCreations</title>
     <link rel="stylesheet" type="text/css" href="style.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kalnia">
 </head>
 <body>
     <div class="container">
diff --git a/index.html b/index.html
index 4782e76..8a01c08 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,8 @@
     <title>Willow Me Creations</title>
     <link rel="stylesheet" type="text/css" href="style.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kalnia">
 </head>
 
 <body>
@@ -51,6 +53,7 @@
                 <p>My sweaters, scarves, and shawls are meticulously crafted in small batches. They come in a diverse range of colors and weights, ensuring a unique and personalized touch to each piece. We also offer custom orders, so if you don't see what you're looking for, please contact us and we will do our best to accommodate your needs.</p>
                 <p>My items are available for purchase through our online store, or at one of the many fiber festivals we attend throughout the year. Please check our <a href="products.html">Products</a> page for more information.</p>
                 <p>Thank you for visiting my website!</p>
+                <button onclick="topFunction()" id="myBtn" title="Go to top">Go to top</button>
             </div>
         </div>
         <!-- <div class="footer">
@@ -109,6 +112,7 @@
             </div>
         </div>
     </div>
+    <script src="script.js"></script>
     </body>
 
 </html>
\ No newline at end of file
diff --git a/privacy.html b/privacy.html
index 372b06f..f388a7a 100644
--- a/privacy.html
+++ b/privacy.html
@@ -4,6 +4,8 @@
     <title>Contact Us - WillowMeCreations</title>
     <link rel="stylesheet" type="text/css" href="style.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kalnia">
 </head>
 <body>
     <div class="container">
diff --git a/products.html b/products.html
index 31e13f8..8850039 100644
--- a/products.html
+++ b/products.html
@@ -4,6 +4,8 @@
     <title>Products - WillowMeCreations</title>
     <link rel="stylesheet" type="text/css" href="style.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Kalnia">
 </head>
 <body>
     <div class="container">
diff --git a/script.js b/script.js
index e69de29..49d7fbe 100644
--- a/script.js
+++ b/script.js
@@ -0,0 +1,19 @@
+//Get the button
+var mybutton = document.getElementById("myBtn");
+
+// When the user scrolls down 20px from the top of the document, show the button
+window.onscroll = function() {scrollFunction()};
+
+function scrollFunction() {
+  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
+    mybutton.style.display = "block";
+  } else {
+    mybutton.style.display = "none";
+  }
+}
+
+// When the user clicks on the button, scroll to the top of the document
+function topFunction() {
+  document.body.scrollTop = 0; // For Safari
+  document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
+}
\ No newline at end of file
diff --git a/style.css b/style.css
index 78eba08..22c197b 100644
--- a/style.css
+++ b/style.css
@@ -1,9 +1,9 @@
 
 
 body {
-    background: linear-gradient(to bottom, #F5F5DC, #FFFFFF); /* gradient from cream to white */
+    background: linear-gradient(to bottom, #FFDAB9, #FFFACD); /* gradient from light peach to cream */
     color: #006400; /* dark green */
-    font-family: Arial, sans-serif;
+    font-family: Kalnia, 'Times New Roman', Times, serif;
     line-height: 1.6;
 }
 
@@ -22,7 +22,7 @@ body {
 }
 
 h1, h2 {
-    color: #800080; /* purple */
+    color: #333333; /* dark grey */
     margin-bottom: 10px;
 }
 
@@ -31,16 +31,16 @@ p {
 }
 
 a {
-    color: #006400; /* dark green */
+    color: #000080; /* dark blue */
     text-decoration: none;
 }
 
 a:hover {
-    color: #800080; /* purple */
+    color: #800000; /* maroon */
 }
 
 .fab {
-    color: #006400; /* dark green */
+    color: #000080; /* dark blue */
 }
 
 .card img {
@@ -58,4 +58,24 @@ a:hover {
 .header, .topnav {
     flex: 1;
 
+}
+
+#myBtn {
+    display: none;
+    position: fixed;
+    bottom: 20px;
+    right: 30px;
+    z-index: 99;
+    border: none;
+    outline: none;
+    background-color: red;
+    color: white;
+    cursor: pointer;
+    padding: 15px;
+    border-radius: 10px;
+    font-size: 18px;
+}
+
+#myBtn:hover {
+    background-color: #555;
 }
\ No newline at end of file
