Update page-africa.html

Author: Andrew

page-africa.html

@@ -7,27 +7,35 @@
 
 <section class="hero">
   <div class="hero__content text-white">
-    <div class="wrapper py-7">
-      <div class="text-center col-md-8 col-lg-6 mx-auto">
-        <img class="mx-auto col-4 col-md-12" style="max-width: 248px;" src="/assets/img/africa-logo.svg" alt="Access icon" />
-        <p class="mt-4">All In Africa is an online educational program that provides Africans with free open source education, training, mentorship, community involvement, and internship opportunities.</p>
-
-        <div class="btn mt-4 disabled">
-          <span>Coming Soon</span>
-          {% include arrow.html %}
+    <div class="wrapper">
+      <div class="d-md-flex text-center text-left-md">
+        <div class="col-12 col-md-4 col-lg-5 mb-6 mb-md-0 px-md-6" data-animate-in="up">
+          <img class="mx-auto col-4 col-md-12" style="max-width: 248px;" src="/assets/img/direction/access-icon.svg" alt="Access icon" />
+        </div>
+        <div class="col-12 col-md-8 col-lg-6" data-animate-in="up">
+          <h1 class="h5">{ All In Access }</h1>
+          <h1 class="h2">All In Africa</h1>
+          <p class="p-lg mt-0">All In Africa is an online educational program that provides Africans with free open source education, training, mentorship, community involvement, and career opportunities.</p>
+          <div class="mt-6">
+            <div class="btn mt-4 disabled">
+              <span>Coming Soon</span>
+              {% include arrow.html %}
+            </div>
+          </div>
         </div>
       </div>
     </div>
 
-    <div class="wrapper d-md-flex py-lg-6 mt-7">
+    <div class="py-lg-4"></div>
+
+    <div class="wrapper d-md-flex py-8">
       <div class="col-12 col-md-4 col-lg-5" style="order: 3;" data-animate-in="up">
         <img class="mx-auto col-10" src="{{ '/assets/img/direction/student-on-computer-2.png' | relative_url }}" alt="student on computer" />
       </div>
       <div class="col-12 col-md-7 pr-md-6">
-        <h2 class="h3 mb-6" data-animate-in="up">All In Africa</h2>
+        <h2 class="h3 mb-6" data-animate-in="up">Overivew</h2>
         <p>All In Africa is designed to empower Africans and bridge the diversity gap of developers through free open source education, comprehensive training, mentorship, vibrant community engagement, and career focused experiential opportunities. Participants will enhance their technical skills with access to open source courses, practical training, and hackathons.</p>
 
-
         <p>The program offers a unique chance to connect with tech professionals and fellow students across Africa, fostering networking and collaboration. By joining this community, individuals can collaborate on impactful open source projects that address real-world challenges. </p>
 
         <p>All In Africa is a gateway to growth, learning, and meaningful connections within the African open source ecosystem and beyond.</p>
@@ -50,11 +58,6 @@ <h2 class="h3 mb-6" data-animate-in="up">All In Africa</h2>
     <div class="col-12 col-md-7 pr-md-6">
       <h2 class="h3 h3-lg" data-animate-in="up">Open source, for all.</h2>
       <p class="h3 h3--alt mb-4">All Africans interested in Open Source are eligible to participate and join us.</p>
-
-      <div class="btn disabled mt-5">
-        <span>Coming Soon</span>
-        {% include arrow.html %}
-      </div>
     </div>
   </div>
 </section>
@@ -97,10 +100,10 @@ <h2 class="h3 h3--alt" data-animate-in="up">{ Ambassadors in Your Region }</h2>
     <p class="h2">Are you All In?</p>
     <p>All In Africa provides open source curriculum, career development, and opportunities at companies, nonprofits and within open source communities.</p>
     <div class="mt-6">
-      <div class="btn disabled">
+      <a class="btn disabled" href="">
         <span>Join the All In Africa Program</span>
         {% include arrow.html %}
-      </div>
+      </a>
     </div>
   </div>
 </section>