diff --git a/css/style.css b/css/style.css
index 885ecfd..4c10a3e 100644
--- a/css/style.css
+++ b/css/style.css
@@ -13,10 +13,11 @@
     IMPORT  
 ------------------------------------------------------- */
 
-@import url(http://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,400italic,700,700italic,900,900italic);
+@import url(https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap);
 /* ----------------------------------------------------
     SKELETON    
 ------------------------------------------------------- */
+
 body {
     background: #fff;
     color: #777777;
@@ -145,6 +146,7 @@ pre {
 a {
     outline: 0 !important;
     text-decoration: none !important;
+    transition: color 0.3s ease, background-color 0.3s ease;
 }
 
 ins {
@@ -299,6 +301,7 @@ mark {
 a:focus,
 a:hover {
     color: #0E97EE;
+    text-decoration: none;
 }
 
 .intro2 i {
@@ -371,21 +374,25 @@ a:hover {
 #myBtn {
   display: none;
   position: fixed;
-  z-index: 1;
-  height:40px;
-  width:40px;
-  bottom: 55px;
-  right: 20px;
+  z-index: 999;
+  height: 40px;
+  width: 40px;
+  bottom: 30px;
+  right: 30px;
   font-size: 18px;
   border: none;
   outline: none;
-  background-color: grey;
-  color:#ffff;
+  background-color: #0E97EE;
+  color: #ffffff;
   cursor: pointer;
-  padding: 0px;
+  padding: 0;
   border-radius: 50%;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  transition: all 0.3s ease;
 }
 
 #myBtn:hover {
-  background-color: #404040;
+  background-color: #2187BB;
+  transform: translateY(-3px);
+  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
 }