<script language="JavaScript">
<!--
function _AN_global_var_init(){
	_AN_this_url = "/prx/000/";
	_AN_base_scheme = "https";
	_AN_base_host = "https://patch-diff.githubusercontent.com";
	_AN_base_path = "https://patch-diff.githubusercontent.com/raw/ShaifArfan/one-page-website-html-css-project/pull/";
	_AN_encode_urls = 0;
	_AN_mpo = 1;
	_AN_md = 0;
	_AN_rel_urls = 0;
	_AN_nav_switch = 0;
	_AN_nav_allowurl = 1;
	_AN_nav_override = 0;
	_AN_has_iframe = 0;
	_AN_dbg_flags = null;
	_AN_nav_use_aaa = 1;
	_AN_expires_pass = 0;
	_AN_wrap_evthandlers = 0;
	_AN_rewrite_param_exact = 0;
	_AN_obj_params = {};
} 
_AN_global_var_init();
//-->
</script>
<script language="JavaScript" src="/prx/001/http/localh/an_util.js"></script>
<script language="JavaScript" src="/prx/001/http/localh/NSLib.js"></script>

diff --git a/app.js b/app.js
index d5591aea..8ac3263c 100644
--- a/app.js
+++ b/app.js
@@ -23,3 +23,23 @@ menu_item.forEach((item) => {
 		mobile_menu.classList.toggle('active');
 	});
 });
+
+var mybutton = document.getElementById("back2Top");
+
+
+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;
+  document.documentElement.scrollTop = 0;
+}
+
diff --git a/index.html b/index.html
index 6624159e..6fb92dd0 100644
--- a/index.html
+++ b/index.html
@@ -212,6 +212,8 @@ <h2>Your Complete Web Solution</h2>
     </div>
   </section>
   <!-- End Footer -->
+<a id="back2Top" title="Back to top" href="#" onclick="topFunction(); ">&#10148;</a>
+
   <script src="./app.js,_ANDesc=js,"></script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/style.css b/style.css
index 62948890..bdacf550 100644
--- a/style.css
+++ b/style.css
@@ -1,4 +1,5 @@
-@import 'https://fonts.googleapis.com/css?family=Montserrat:300, 400, 700&display=swap';
+
+@import 'https://fonts.googleapis.com/css2?family=David+Libre&display=swap';
 * {
 	padding: 0;
 	margin: 0;
@@ -6,7 +7,7 @@
 }
 html {
 	font-size: 10px;
-	font-family: 'Montserrat', sans-serif;
+	font-family: 'David Libre', serif;
 	scroll-behavior: smooth;
 }
 a {
@@ -36,7 +37,7 @@ p {
 	font-size: 4rem;
 	font-weight: 300;
 	color: black;
-	margin-bottom: 10px;
+	margin-bottom: 30px;
 	text-transform: uppercase;
 	letter-spacing: .2rem;
 	text-align: center;
@@ -298,6 +299,11 @@ p {
 	z-index: 1;
 	overflow: hidden;
 }
+
+#services .service-item:hover{
+ transform: scale(1.09);
+
+}
 #services .service-item::after {
 	content: '';
 	position: absolute;
@@ -530,6 +536,32 @@ p {
 }
 /* End Footer */
 
+#back2Top {
+    width: 40px;
+    line-height: 40px;
+    overflow: hidden;
+    z-index: 999;
+    display: none;
+    cursor: pointer;
+    -moz-transform: rotate(270deg);
+    -webkit-transform: rotate(270deg);
+    -o-transform: rotate(270deg);
+    -ms-transform: rotate(270deg);
+    transform: rotate(270deg);
+    position: fixed;
+    bottom: 30px;
+    right: 20px;
+    background-color: #DDD;
+    color: #555;
+    text-align: center;
+    font-size: 30px;
+    text-decoration: none;
+}
+#back2Top:hover {
+    background-color: #DDF;
+    color: #000;
+}
+
 /* Keyframes */
 @keyframes hamburger_puls {
 	0% {
