Updating team pictures

css/main.css

@@ -1120,11 +1120,10 @@ section:nth-of-type(2) {
     width: 1rem;
   }
   .team-member {
-    transition: box-shadow 0.2s ease;
+    transition: background-color 0.2s ease;
-    box-shadow: 0 0 0 0 rgba(var(--text-color), 1);
   }
   .team-member:hover {
-    box-shadow: 0 0 0 0.1rem rgba(var(--text-color), 1);
+    background-color: rgba(var(--foreground-color), 1);
   }
 }
 .hidden {

css/main.scss

@@ -1061,10 +1061,9 @@ section {
     }
   }
   .team-member {
-    transition: box-shadow 0.2s ease;
+    transition: background-color 0.2s ease;
-    box-shadow: 0 0 0 0 rgba(var(--text-color), 1);
     &:hover {
-      box-shadow: 0 0 0 0.1rem rgba(var(--text-color), 1);
+      background-color: rgba(var(--foreground-color), 1);
     }
   }
 }

index.html

@@ -362,8 +362,8 @@
                     <h4 class="reveal"><span>Why</span></h4>
                     <h2 class="reveal"><span>El Salvador?</span></h2>
                 </div>
-                <ul class="grid">
+                <ul class="grid move-in">
-                    <li class="milestone move-in">
+                    <li class="milestone">
                         <div class="milestone__label">1</div>
                         <h3 class="milestone__title">Bitcoin legalized</h3>
                         <p class="milestone__description">
@@ -372,7 +372,7 @@
                             protections.
                         </p>
                     </li>
-                    <li class="milestone move-in">
+                    <li class="milestone">
                         <div class="milestone__label">2</div>
                         <h3 class="milestone__title">No capital gains tax</h3>
                         <p class="milestone__description">
@@ -381,14 +381,14 @@
                             leverage the power of new technologies.
                         </p>
                     </li>
-                    <li class="milestone move-in">
+                    <li class="milestone">
                         <div class="milestone__label">3</div>
                         <h3 class="milestone__title">Digital assets regulation</h3>
                         <p class="milestone__description">
                             El Salvador has created Comprehensive Digital Assets regulatory system.
                         </p>
                     </li>
-                    <li class="milestone move-in">
+                    <li class="milestone">
                         <div class="milestone__label">4</div>
                         <h3 class="milestone__title">Best physical launchpad</h3>
                         <p class="milestone__description">
@@ -397,7 +397,7 @@
                             up all over the world using blockchain dynamics.
                         </p>
                     </li>
-                    <li class="milestone move-in">
+                    <li class="milestone">
                         <div class="milestone__label">5</div>
                         <h3 class="milestone__title">First mover advantage for new ideas</h3>
                         <p class="milestone__description">
@@ -407,7 +407,7 @@
                             advantage is often a permanent advantage in Crypto space.
                         </p>
                     </li>
-                    <li class="milestone move-in">
+                    <li class="milestone">
                         <div class="milestone__label">6</div>
                         <h3 class="milestone__title">Emerging focal point of crypto community</h3>
                         <p class="milestone__description">
@@ -560,12 +560,12 @@
         </section>
         <section id="methodology_section">
             <h2 class="reveal"><span>Methodology</span></h2>
-            <ul id="methodology_wrapper"> </ul>
+            <ul id="methodology_wrapper" class="move-in"> </ul>
         </section>
         <section class="grid gap-3">
             <h2 class="reveal"><span>Project team structure</span> </h2>
-            <ul id="project_team__components">
+            <ul id="project_team__components" class="move-in">
-                <li class="grid gap-1 milestone move-in">
+                <li class="grid gap-1 milestone">
                     <div class="milestone__label">1</div>
                     <h3 class="milestone__title">
                         Create client-side steering team
@@ -587,7 +587,7 @@
                         </ol>
                     </div>
                 </li>
-                <li class="grid gap-1 milestone move-in">
+                <li class="grid gap-1 milestone">
                     <div class="milestone__label">2</div>
                     <h3 class="milestone__title">
                         Approval from the board or higher management
@@ -608,7 +608,7 @@
                         </p>
                     </div>
                 </li>
-                <li class="grid gap-1 milestone move-in">
+                <li class="grid gap-1 milestone">
                     <div class="milestone__label">3</div>
                     <h3 class="milestone__title">Project B team role</h3>
                     <div class="grid milestone__description gap-1">
@@ -622,7 +622,7 @@
                         </p>
                     </div>
                 </li>
-                <li class="grid gap-1 milestone move-in">
+                <li class="grid gap-1 milestone">
                     <div class="milestone__label">4</div>
                     <h3 class="milestone__title">
                         Regulatory team role
@@ -1176,7 +1176,7 @@
             const renderedTeamMembers = teamMembers.map((member, index) => {
                 const { image, name, title, bio } = member
                 return html`
-                <li data-index=${index} class="team-member move-in">
+                <li data-index=${index} class="team-member">
                     <img src="${image}" alt=${`${name} profile picture`} loading="lazy">
                     <div class="flex flex-direction-column">
                         <p class="team-member__name">${name}</p>
@@ -1201,7 +1201,7 @@
             const renderedMethodology = methodology.map((step, index) => {
                 const { title, content } = step
                 return html`
-                    <li class="milestone move-in">
+                    <li class="milestone">
                         <div class="milestone__label">${index + 1}</div>
                         <h3 class="milestone__title">${title}</h3>
                         <p class="milestone__description">${content}</p>
@@ -1291,31 +1291,31 @@
             {
                 name: 'Carlos Javier Castellanos Flores',
                 title: 'Principal Director and Shareholder',
-                image: 'assets/people/carlos.jpg',
+                image: 'assets/people/Carlos-Castellanos-B&W.jpg',
                 bio: `Carlos Javier Castellanos Flores is a Blockchain Consultant experienced in Bitcoin infrastructure and asset tokenization.\n\n He currently works at RanchiMall, specializing in integrating companies into the Bitcoin Blockchain.\n\n Carlos is also the Founder and Product Designer at Garrobo Co., where he creates designs and manages production for Garrobo T-Shirts. With a background in customer support and technical services, he has worked for HP SmartFriend Tech Support, Boost Mobile, and Sitel Group.\n\n Carlos holds a degree from Universidad Nacional de Ingeniería and possesses skills in Blockchain, business development, and graphic design.`
             },
             {
                 name: 'John Giannakos',
                 title: 'Shareholder',
-                image: 'assets/people/john.jpg',
+                image: 'assets/people/John-Ginnakos-2023-B&W.jpg',
                 bio: `John Giannakos is an experienced leasing and retail property manager based in Mahone Bay, Nova Scotia, Canada. He has owned and operated various businesses, including Hellas Enterprises Ltd and Hellas Family Restaurant.\n\n John has also served as an Assistant Treasurer, First Responder, and Passenger Assistance. \n\nHe is a graduate of Nova Scotia Institute of Technology and Sackville High School, with a background in Petroleum Resources Technology. \n\nJohn has been involved in political endeavors, having been a candidate for the Progressive Conservative Party and the Atlantica Party.\n\n With his extensive experience and involvement in the community, John is a well-rounded professional.`
             },
             {
                 name: 'Iris Avalos',
                 title: 'Principal Director',
-                image: 'assets/people/Iris-Avalos.jpg',
+                image: 'assets/people/Iris-Avalos-B&W.jpg',
                 bio: `Iris Avalos is a skilled professional experienced in finance, administration, project coordination, and customer service.\n\n Currently serving as the Co-Founder and Admin Finance Manager at Garrobo Co., she is responsible for website design, marketing, financial documentation, and ensuring a seamless online shopping experience.\n\n With a background in accounts receivable and payable roles, Iris has worked in various organizations, including St Andrew's Cathedral School and Royal Freemasons' Benevolent Institution.\n\n She holds a Bachelor's degree in Commerce and has completed additional courses in digital currencies and business administration.\n\n Iris is dedicated to using her career to make a positive impact and possesses a strong understanding of financial systems.`
             },
             {
                 name: 'Puneet Sondh',
                 title: 'Principal Director',
-                image: 'assets/people/Puneet Sondh.jpg',
+                image: 'assets/people/Puneet-Sondh-2023-B&W.jpg',
                 bio: `Puneet Sondh is a highly experienced financial services professional with a strong leadership background. He has successfully managed teams in diverse global environments, specializing in operational risk, financial crime, and business transformation.\n\n Puneet's notable roles include Partner at Wipro Ltd, Business and Risk Consultant, Head of Risk and Compliance at State Street Syntel Services, and Assistant General Manager at ICICI Bank.\n\nHe holds advanced degrees in finance and industrial management, and has certifications in FinTech and Financial Crime.\n\n Puneet's expertise and achievements make him a valuable asset in the financial services industry.`
             },
             {
                 name: 'Erika Pérez Cañas',
                 title: 'Principal Director',
-                image: 'assets/people/erika pérez cañas.jpg',
+                image: 'assets/people/Erika-Perez-2023-B&W.jpg',
                 bio: `Erika Pérez Cañas is a Salvadoran professional specialized in managerial assistance and procurement. She has experience in international relations and is currently studying Industrial Engineering.\n\n Erika has expertise in project management and a strong command of the Logical Framework Approach (LFA). Her previous roles include being an Administrator at Crowley, where she supported category management teams, and working as an Assistant Technician at UTEC-MINED, where she handled technical proposals and procurement processes.\n\n She also served as an Assistant to the General Manager at Tom Sawyer and worked as a Fraud Prevention Analyst for Avianca Airlines.\n\n Erika holds a Bachelor's degree in International Relations and is pursuing a degree in Industrial Engineering. She is fluent in Spanish and has a proficient level of English.\n\n Her skills include leadership, critical thinking, creativity, emotional intelligence, and problem-solving.`
             },
         ]