diff --git a/index.html b/index.html
index 76254c13..a49e74c2 100644
--- a/index.html
+++ b/index.html
@@ -20,7 +20,7 @@
   </head>
 
   <body>
-    <div class="header">
+    <header class="header">
 
         <a href="#">
           <img
@@ -30,7 +30,7 @@
           />
         </a>
 
-        <div>
+        <nav>
           <ul class="navigation__list">
             <li class="navigation__item">
               <a class="navigation__link" href="#">Home</a>
@@ -45,20 +45,25 @@
               <a class="navigation__link" href="#">Contact Us</a>
             </li>
           </ul>
-        </div>
+        </nav>
 
         <button>Donate Now</button>
 
-    </div>
+    </header>
 
-    <div class="content">
-        <div class="main">
+    <main class="content">
+        <section class="main">
           <div class="alert">
             You've helped us give <span class="text-highlight">72</span> bikes
             to refugees and asylum seekers so far. <strong>Thank you!</strong>
           </div>
 
           <div class="hero">
+            <img
+              class="hero__image"
+              src="images\header-bike.jpg"
+              alt="header-bike"
+            />
             <h1>Bikes for Refugees</h1>
             <p>
               Providing donated bikes and accessories to refugees and asylum
@@ -72,7 +77,7 @@ <h1>Bikes for Refugees</h1>
             <h2 class="heading-underline">Learn more</h2>
 
             <div>
-              <div class="article">
+              <article class="article">
                 <h3 class="article__title">Why do refugees need bikes?</h3>
                 <p class="article__summary">
                   Many refugees are placed in housing in areas where there are
@@ -85,7 +90,7 @@ <h3 class="article__title">Why do refugees need bikes?</h3>
                     Learn more
                   </a>
                 </p>
-              </div>
+              </article>
 
               <div class="article">
                 <h3 class="article__title">How can I help?</h3>
@@ -103,16 +108,16 @@ <h3 class="article__title">How can I help?</h3>
               </div>
             </div>
           </div>
-        </div>
+        </section>
 
-        <div class="sidebar">
+        <aside class="sidebar">
           <h2 class="heading-underline">Upcoming events</h2>
 
-          <div class="article">
+          <section class="article">
             <img
               class="article__thumbnail"
-              src="spring-fundraisers_thumbnail.jpg"
-              alt=""
+              src="images\spring-fundraisers_thumbnail.jpg"
+              alt="Spring Fundraisers thumbnail"
             />
             <div class="article__content">
               <h3 class="article__title">
@@ -123,26 +128,26 @@ <h3 class="article__title">
                 Médecins Sans Frontières.
               </p>
             </div>
-          </div>
+          </section>
 
-          <div class="article">
+          <section class="article">
             <img
               class="article__thumbnail"
-              src="bikes-for-refugees_logo.jpg"
-              alt=""
+              src="images\bikes-for-refugees_logo.jpg"
+              alt="Bikes for Refugees Scotland"
             />
             <div class="article__content">
               <h3 class="article__title">
                 <a class="article__title-link" href="#">Bike dropoff event in Edinburgh on May 11</a>
               </h3>
             </div>
-          </div>
+          </section>
 
-          <div class="article">
+          <section class="article">
             <img
               class="article__thumbnail"
-              src="edinburgh-damascus_thumbnail.png"
-              alt=""
+              src="images\edinburgh-damascus_thumbnail.png"
+              alt="Edinburgh tO Damascus"
             />
             <div class="article__content">
               <h3 class="article__title">
@@ -153,7 +158,7 @@ <h3 class="article__title">
                 to Damascus.
               </p>
             </div>
-          </div>
+          </section>
 
           <a
             href="https://www.facebook.com/BikesforRefugeesScotland/events/?ref=page_internal"
@@ -163,10 +168,10 @@ <h3 class="article__title">
             <span class="fa fa-facebook-square"></span>
             All Facebook events
           </a>
-        </div>
-    </div>
+        </aside>
+    </main>
 
-    <div class="footer">
+    <footer class="footer">
       <div class="footer__content">
         <p>
           <strong>Bikes for Refugees Scotland is a volunteer-led project to help
@@ -174,6 +179,6 @@ <h3 class="article__title">
         </p>
         <p>Website by Code Your Future</p>
       </div>
-    </div>
+    </footerS>
   </body>
 </html>
diff --git a/styles/style.css b/styles/style.css
index 4d1c088e..1017dafb 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -95,7 +95,22 @@ p {
 
 /* Buttons */
 
-  /* INSERT BUTTON STYLES HERE */
+  button {
+    background-color: var(--orange-dark);
+    color: var(--white);
+    border: none;
+    padding: 0.5rem 1rem;
+    border-radius: 4px;
+    cursor: pointer;
+    font-weight: 600;
+    text-transform: uppercase;
+  }
+
+  button:hover,
+  button:focus {
+    background-color: var(--orange-light);
+    color: var(--grey-dark);
+  }
 
 
 /* Content */
@@ -118,20 +133,34 @@ p {
 }
 
 /* hero */
-
 .hero {
   background-image: url("header-bike.jpg");
   background-color: var(--grey-light);
 }
+.hero {
+  position: relative;
+  text-align: center;
+  color: white;
+}
 
 .hero h1 {
-  margin-bottom: 1rem;
-  font-size: 2.5rem;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  font-size: 28px;
+  font-weight: bold;
 }
 
+
+
 .hero p {
-  font-size: 1.2rem;
-  margin-bottom: 2rem;
+  position: absolute;
+  top: 75%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  font-size: 20px;
+  font-weight: bold;
 }
 
 
