M hugo-site/layouts/index.html → hugo-site/layouts/index.html

@@ -150,6 +150,7 @@ </div>
           </a>
         </div>
         <!-- <div class=btn id=project-cta>View All</div> -->
+      </div>
     </div>
   </section>
 

M hugo-site/static/css/main.css → hugo-site/static/css/main.css

@@ -186,6 +186,7 @@ 
 
 #socials{
     display: flex;
+    align-items: center;
     position: absolute;
     right: -100px;
     bottom: 30px;
@@ -207,6 +208,7 @@ .sb{
     padding: 15px;
     display: flex;
     box-shadow: 0px 7px 7px rgba(0,0,0,0.15);
+    border-radius: 6px;
 }
 
 .sb img{
@@ -222,6 +224,12 @@ .github{
     background: #333
 }
 
+.sb:hover{
+    box-shadow: 0px 13px 20px rgba(0,0,0,0.20);
+    padding: 17px;
+    margin: -2px;
+}
+
 .dribbble{
     background: #ea4c89 
 }
@@ -245,10 +253,12 @@ margin-bottom: 5rem;
 }
 
 #projects h1 {
-    transform: translate(-4rem, 1.2rem);
+    position: absolute;
+    top: -1.8rem;
+    left: -5rem;
+    z-index: 1;
     color: rgba(0,0,0,0.8);
     font-size: 2.4rem;
-    z-index: 1;
     text-shadow: 0 4px 7px rgba(0,0,0,0.2);
 }
 
@@ -372,10 +382,10 @@ color: #B554E3;
     }
 
     #projects h1 {
-        transform: none;
+        position: static;
         font-size: 2rem;
-        margin-bottom: 0.4rem;
         text-align: center;
+        margin-bottom: 0.4rem;
     }
 
     #project-cta{