From 2ab1f31cd016e32603c6b6ab7b0798674435b02c Mon Sep 17 00:00:00 2001
From: findthelorax <findthelorax@gmail.com>
Date: Wed, 20 Sep 2023 13:31:35 -0400
Subject: [PATCH] 9.20.23 v3

---
 index.html | 63 ++++++++++++++++++------------------------------------
 styles.css | 39 +++++++++++++++++++++++++++------
 2 files changed, 54 insertions(+), 48 deletions(-)

diff --git a/index.html b/index.html
index 531a3a4..656fcdd 100644
--- a/index.html
+++ b/index.html
@@ -39,7 +39,7 @@
             <h3>Hello, It's Me</h3>
             <h3>Brett Ferrante</h3>
             <h3>And I'm a <span>Web Developer</span></h3>
-            <p>I'm a Web Developer who loves diving headfirst into new problems. I love solving puzzles, cooking, snowboarding, rock climbing and hanging out with my son.</p>
+            <p>I love diving headfirst into new problems. I enjoy solving puzzles, cooking, snowboarding, rock climbing and hanging out with my son.</p>
             <div class="home_social">
                 <ul class="home_social_icons">
                     <li><a href="" class="home_social_icon"> <i class="fa-solid fa-envelope"></i></a></li>
@@ -55,51 +55,28 @@ <h3>And I'm a <span>Web Developer</span></h3>
         </div>
     </section>
 
-    <!-- * OLD Bio Container -->
-    <!--  <div class="bio_container">
-        <div class="bio_left">
-            <div class="bio_intro">
-                <img src="./profile_pic.png" alt="Handsome Redhead" id="bio_pic">
-
-                <h2>Brett Ferrante</h2>
-                <div class="underline"></div>
-                <h3>Web Developer</h3>
-            </div>
-
-            <div class="social_div">
-                <ul class="social_icons">
-                    <li><a href="" class="social_icon"> <i class="fa-solid fa-envelope"></i></a></li>
-                    <li><a href="" class="social_icon"> <i class="fa-brands fa-facebook-f"></i></a></li>
-                    <!-- <li><a href="" class="social_icon"> <i class="fa-brands fa-square-twitter"></i></a></li>
-                    <li><a href="" class="social_icon"> <i class="fa-brands fa-youtube"></i></a></li>
-                    <li><a href="" class="social_icon"> <i class="fa-brands fa-linkedin"></i></a></li>
-                    <li><a href="" class="social_icon"> <i class="fa-brands fa-github"></i></a></li>
-                </ul>
-            </div>
-        </div>
-
-        <div class="bio_right">
-            
-        </div>
-    </div> -->
-
 
     <!-- My Works -->
     <div id="works">
         <section class="container">
-            <h1> Skills </h1>
+            <h1 class="skills_header"> Skills </h1>
             <div class="skills_box">
                 <div class="box_1">
-                    <h3 class="skills_header"> Father </h3>
-                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ab ea voluptatibus reprehenderit error debitis suscipit molestias, dicta, quidem explicabo accusantium maiores magni unde animi? Saepe eveniet dicta provident dolore ab?</p>
+                    <h3 class="skills_header"> Father </h3><br>
+                    <p>I just had a son in April 2023 and it's been amazing. I can't wait for him to grow up so I can teach him everything I know</p>
                 </div>
                 <div class="box_2">
-                    <h3 class="skills_header"> Development Languages </h3>
-                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas ratione, dolore ad consequuntur ipsam sunt labore, eligendi iusto ipsum exercitationem asperiores error accusantium temporibus optio magni voluptates quam quidem odit.</p>
+                    <h3 class="skills_header"> Development Languages </h3><br>
+                    <p>Proficient in: HTML, CSS.
+                        <br>
+                        <br>Learning: Javascript, C#, React, Node.js.
+                    </p>
                 </div>
                 <div class="box_3">
-                    <h3 class="skills_header"> Mountaineering </h3>
-                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea saepe quae praesentium beatae autem eos error ad veritatis ab fuga, perferendis officia nobis voluptatem perspiciatis vitae ipsa architecto maxime commodi.</p>
+                    <h3 class="skills_header"> Mountaineering </h3><br>
+                    <p>I spent two months in Haines, Alaska working on my Mountaineering Guide Certification.
+                        I learned glacial traversal, camp dynamics and structure, rescue scenarios and terrain management. It was an amazing experience.
+                    </p>
                 </div>
             </div>
         </section>
@@ -107,16 +84,17 @@ <h3 class="skills_header"> Mountaineering </h3>
         <section class="container">
             <div class="skills_box">
                 <div class="box_4">
-                    <h3 class="skills_header"> Yo-Yoing </h3>
-                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ab ea voluptatibus reprehenderit error debitis suscipit molestias, dicta, quidem explicabo accusantium maiores magni unde animi? Saepe eveniet dicta provident dolore ab?</p>
+                    <h3 class="skills_header"> Yo-Yoing </h3><br>
+                    <p>I grew up playing with skill toys, juggling, poi, devil sticks, diablo and yo-yoing. I went on to compete in the World Yo-Yo Competition placing 13th in the World and 13th in the Nation in the same year and holding a AYYA World Record for Iron Whips.</p>
                 </div>
                 <div class="box_5">
-                    <h3 class="skills_header"> Wilderness EMT </h3>
-                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas ratione, dolore ad consequuntur ipsam sunt labore, eligendi iusto ipsum exercitationem asperiores error accusantium temporibus optio magni voluptates quam quidem odit.</p>
+                    <h3 class="skills_header"> Wilderness EMT </h3><br>
+                    <p>In 2006 I got my WFR certification then went on to work Ski Patrol at Killington Resort. I now have CPR, Wilderness EMT, Outdoor Emergency Care, ATF Certification for explosive handling among others.
+                    </p>
                 </div>
                 <div class="box_6">
-                    <h3 class="skills_header"> Chef </h3>
-                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea saepe quae praesentium beatae autem eos error ad veritatis ab fuga, perferendis officia nobis voluptatem perspiciatis vitae ipsa architecto maxime commodi.</p>
+                    <h3 class="skills_header"> Chef </h3><br>
+                    <p>I've been working in kitchens for 20+ years. I run a kitchen at a summer camp feeding 100 children 9-14 and 50 staff while catering to all dietary needs: Vegetarian, Gluten, Free, Dairy Free, Keto, Egg Free, Sesame Free and any others.</p>
                 </div>
             </div>
         </section>
@@ -170,5 +148,6 @@ <h4 class="social_header">Follow Me</h4>
         </div>
     </footer>
 
+    <a href="#" class="top"><i class="fa-solid fa-arrow-up"></i></a>
 </body>
 </html>
\ No newline at end of file
diff --git a/styles.css b/styles.css
index 33ec6a7..0838987 100644
--- a/styles.css
+++ b/styles.css
@@ -86,20 +86,30 @@ body {
 
 /* Homepage Design Styling */
 section {
-    min-height: 100vh;
+    /* min-height: 100vh; */
     padding: 5rem 8% 2rem;
 }
 #home {
     display: flex;
     justify-content: center;
-    align-items: center;
+    align-items: top;
+    padding: 5rem 5rem;
 }
 .home_content h3 {
     font-size: 3rem;
     font-weight: 700;
 }
 .home_content h3:nth-of-type(2) {
-    margin-bottom: 1.2rem;
+    margin: 1.2rem 0;
+    text-decoration: none;
+    text-transform: uppercase;
+    letter-spacing: .25rem;
+    color: #131313;
+    text-shadow:
+        0 0 7px #fff,
+        0 0 10px #ff00aa,
+        0 0 21px #ff00aa,
+        0 0 42px #0fa;
 }
 .home_content h3:nth-of-type(3) {
     margin-bottom: 1.2rem;
@@ -218,7 +228,7 @@ section {
 .skills_header {
     text-align: center;
     text-transform: uppercase;
-    padding: 0 0 10px 0;
+    padding: 0 0 30px 0;
 }
 .skills_box {
     display: flex;
@@ -231,14 +241,14 @@ section {
     margin: 10px 10px;
     padding: 30px 20px;
     text-align: center;
-    border: 2px solid rgba(255, 0, 179, 0.1);
+    border: 2px solid pink;
     border-radius: 24px;
 }
 .skills_box p {
     margin: 0 auto;
     padding: 0 20px;
     width: 300px;
-    font-weight: 600;
+    font-weight: 500;
     text-align: center;
 }
 
@@ -435,4 +445,21 @@ textarea {
     position: absolute;
     width: 100%;
     height: 2.5rem;
+}
+
+/* Top Button */
+/* ! Adjust button spacing from bottom of page */
+.top {
+    place-self:end;
+    text-decoration: none;
+    padding: 10px;
+    color: #fff;
+    background-color: #2b2a29;
+    box-shadow: 0 5px 10px #ff00aa;
+    border-radius: 100px;
+    font-size: 20px;
+    position: sticky;
+    bottom: 20px;
+    left: 30px;
+    margin-top: 150vh;
 }
\ No newline at end of file