diff --git a/index.html b/index.html
index 76254c13..3da54bf0 100644
--- a/index.html
+++ b/index.html
@@ -1,179 +1,156 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
-
-    <link rel="dns-prefetch" href="//fonts.googleapis.com" />
-    <link
-      href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,"
-      rel="stylesheet"
-    />
-    <link
-      rel="stylesheet"
-      href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
-    />
-    <link rel="stylesheet" href="styles/style.css" />
-
-    <title>Bikes for Refugees</title>
-  </head>
-
-  <body>
-    <div class="header">
-
-        <a href="#">
-          <img
-            src="images/bikes-for-refugees_logo.jpg"
-            alt="Logo for Bikes for Refugees Scotland"
-            class="header__logo"
-          />
-        </a>
-
-        <div>
-          <ul class="navigation__list">
-            <li class="navigation__item">
-              <a class="navigation__link" href="#">Home</a>
-            </li>
-            <li class="navigation__item">
-              <a class="navigation__link" href="#">About Us</a>
-            </li>
-            <li class="navigation__item">
-              <a class="navigation__link" href="#">News & Events</a>
-            </li>
-            <li class="navigation__item">
-              <a class="navigation__link" href="#">Contact Us</a>
-            </li>
-          </ul>
-        </div>
-
-        <button>Donate Now</button>
-
-    </div>
-
-    <div class="content">
-        <div 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">
-            <h1>Bikes for Refugees</h1>
-            <p>
-              Providing donated bikes and accessories to refugees and asylum
-              seekers in Scotland.
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+
+  <link rel="dns-prefetch" href="//fonts.googleapis.com" />
+  <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700," rel="stylesheet" />
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
+  <link rel="stylesheet" href="styles/style.css" />
+
+  <title>Bikes for Refugees</title>
+</head>
+
+<body>
+  <header class="header">
+
+    <a href="#">
+      <img src="./images/bikes-for-refugees_logo.jpg" alt="Logo for Bikes for Refugees Scotland" class="header__logo" />
+    </a>
+
+    <nav>
+      <ul class="navigation__list">
+        <li class="navigation__item">
+          <a class="navigation__link" href="#">Home</a>
+        </li>
+        <li class="navigation__item">
+          <a class="navigation__link" href="#">About Us</a>
+        </li>
+        <li class="navigation__item">
+          <a class="navigation__link" href="#">News & Events</a>
+        </li>
+        <li class="navigation__item">
+          <a class="navigation__link" href="#">Contact Us</a>
+        </li>
+      </ul>
+    </nav>
+
+    <button class="donate-button">Donate Now</button>
+
+  </header>
+
+  <div class="content">
+    <main class="main">
+      <section 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>
+      </section>
+
+      <section class="hero">
+        <h1>Bikes for Refugees</h1>
+        <p>
+          Providing donated bikes and accessories to refugees and asylum
+          seekers in Scotland.
+        </p>
+        <button class="donate-button">Donate a bike today</button>
+        <button class="volunteer-button">Volunteer</button>
+      </section>
+
+      <section>
+        <h2 class="heading-underline">Learn more</h2>
+
+        <div class="article__container">
+          <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
+              few jobs. Bikes provide low-cost transportation so that they
+              can get to work, manage child care and do their shopping.
+            </p>
+            <p class="article__read-more">
+              <a href="#">
+                <span class="arrow-right"></span>
+                Learn more
+              </a>
+            </p>
+          </article>
+
+          <article class="article">
+            <h3 class="article__title">How can I help?</h3>
+            <p class="article__summary">
+              We need lots of bikes and bike accessories! If you have an
+              old bike you don't use, bring it to one of our dropoff
+              events. Or come attend one of our fundraisers.
             </p>
-            <button>Donate a bike today</button>
-            <button>Volunteer</button>
-          </div>
-
-          <div>
-            <h2 class="heading-underline">Learn more</h2>
-
-            <div>
-              <div 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
-                  few jobs. Bikes provide low-cost transportation so that they
-                  can get to work, manage child care and do their shopping.
-                </p>
-                <p class="article__read-more">
-                  <a href="#">
-                    <span class="arrow-right"></span>
-                    Learn more
-                  </a>
-                </p>
-              </div>
-
-              <div class="article">
-                <h3 class="article__title">How can I help?</h3>
-                <p class="article__summary">
-                  We need lots of bikes and bike accessories! If you have an
-                  old bike you don't use, bring it to one of our dropoff
-                  events. Or come attend one of our fundraisers.
-                </p>
-                <p class="article__read-more">
-                  <a href="#">
-                    <span class="arrow-right"></span>
-                    Learn more
-                  </a>
-                </p>
-              </div>
-            </div>
-          </div>
+            <p class="article__read-more">
+              <a href="#">
+                <span class="arrow-right"></span>
+                Learn more
+              </a>
+            </p>
+          </article>
         </div>
-
-        <div class="sidebar">
-          <h2 class="heading-underline">Upcoming events</h2>
-
-          <div class="article">
-            <img
-              class="article__thumbnail"
-              src="spring-fundraisers_thumbnail.jpg"
-              alt=""
-            />
-            <div class="article__content">
-              <h3 class="article__title">
-                <a class="article__title-link" href="#">Join us for our Spring fundraisers</a>
-              </h3>
-              <p class="article__summary">
-                Riders needed now to help raise awareness and funds for BfR and
-                Médecins Sans Frontières.
-              </p>
-            </div>
-          </div>
-
-          <div class="article">
-            <img
-              class="article__thumbnail"
-              src="bikes-for-refugees_logo.jpg"
-              alt=""
-            />
-            <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>
-
-          <div class="article">
-            <img
-              class="article__thumbnail"
-              src="edinburgh-damascus_thumbnail.png"
-              alt=""
-            />
-            <div class="article__content">
-              <h3 class="article__title">
-                <a class="article__title-link" href="#">Help us cycle 4,797km</a>
-              </h3>
-              <p class="article__summary">
-                We need you to help us cycle 4797km, the distance of Edinburgh
-                to Damascus.
-              </p>
-            </div>
-          </div>
-
-          <a
-            href="https://www.facebook.com/BikesforRefugeesScotland/events/?ref=page_internal"
-            target="_blank"
-            class="facebook-link"
-          >
-            <span class="fa fa-facebook-square"></span>
-            All Facebook events
-          </a>
+      </section>
+    </main>
+
+    <aside class="sidebar">
+      <h2 class="heading-underline">Upcoming events</h2>
+
+      <article class="article">
+        <img class="article__thumbnail" src="./images/spring-fundraisers_thumbnail.jpg" alt="" />
+        <div class="article__content">
+          <h3 class="article__title">
+            <a class="article__title-link" href="#">Join us for our Spring fundraisers</a>
+          </h3>
+          <p class="article__summary">
+            Riders needed now to help raise awareness and funds for BfR and
+            Médecins Sans Frontières.
+          </p>
         </div>
-    </div>
-
-    <div class="footer">
-      <div class="footer__content">
-        <p>
-          <strong>Bikes for Refugees Scotland is a volunteer-led project to help
+      </article>
+
+      <article class="article">
+        <img class="article__thumbnail" src="./images/bikes-for-refugees_logo.jpg" alt="" />
+        <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>
+      </article>
+
+      <article class="article">
+        <img class="article__thumbnail" src="./images/edinburgh-damascus_thumbnail.png" alt="" />
+        <div class="article__content">
+          <h3 class="article__title">
+            <a class="article__title-link" href="#">Help us cycle 4,797km</a>
+          </h3>
+          <p class="article__summary">
+            We need you to help us cycle 4797km, the distance of Edinburgh
+            to Damascus.
+          </p>
+        </div>
+      </article>
+
+      <a href="https://www.facebook.com/BikesforRefugeesScotland/events/?ref=page_internal" target="_blank"
+        class="facebook-link">
+        <span class="fa fa-facebook-square"></span>
+        All Facebook events
+      </a>
+    </aside>
+  </div>
+
+  <footer class="footer">
+    <nav class="footer__content">
+      <p>
+        <strong>Bikes for Refugees Scotland is a volunteer-led project to help
           people explore and make connections with their local communities.</strong>
-        </p>
-        <p>Website by Code Your Future</p>
-      </div>
-    </div>
-  </body>
-</html>
+      </p>
+      <p>Website by Code Your Future</p>
+    </nav>
+  </footer>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/styles/style.css b/styles/style.css
index 4d1c088e..ab7cc84c 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -5,13 +5,13 @@
  * 
  */
 
- :root {
-   --grey-dark: #292b2c;
-   --grey-light: #e4e4e4;
-   --orange-dark: #c05326;
-   --orange-light: #f7eae4;
-   --white: #fff;
- }
+:root {
+  --grey-dark: #292b2c;
+  --grey-light: #e4e4e4;
+  --orange-dark: #c05326;
+  --orange-light: #f7eae4;
+  --white: #fff;
+}
 
 body {
   margin: 0;
@@ -24,7 +24,18 @@ button {
   font-size: 1rem;
 }
 
-h1,h2,h3,h4,h5,h6 {
+button {
+  padding: 0.5rem 1rem;
+  border: 0;
+  border-radius: 5px;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
   margin-top: 0;
   margin-bottom: 0;
 }
@@ -67,6 +78,7 @@ p {
 
 .navigation__item {
   padding: 0.5rem 0;
+  margin: 1rem;
 }
 
 .navigation__link {
@@ -76,6 +88,10 @@ p {
   text-decoration: none;
 }
 
+.navigation__link:hover {
+  color: var(--orange-dark);
+}
+
 
 /* Text styles */
 
@@ -95,8 +111,27 @@ p {
 
 /* Buttons */
 
-  /* INSERT BUTTON STYLES HERE */
+.donate-button {
+  background-color: var(--orange-dark);
+  color: var(--white);
+}
+
+.donate-button:hover {
+  cursor: pointer;
+  background-color: var(--white);
+  color: var(--orange-dark);
+}
+
+.volunteer-button {
+  background-color: var(--white);
+  color: var(--orange-dark);
+}
 
+.volunteer-button:hover {
+  cursor: pointer;
+  background-color: var(--orange-dark);
+  color: var(--white);
+}
 
 /* Content */
 
@@ -120,8 +155,11 @@ p {
 /* hero */
 
 .hero {
-  background-image: url("header-bike.jpg");
-  background-color: var(--grey-light);
+  background-image: url("../images/header-bike.jpg");
+  background-size: cover;
+  padding: 6rem 2rem;
+  margin-bottom: 2rem;
+  color: var(--white);
 }
 
 .hero h1 {
@@ -161,8 +199,15 @@ p {
 
 /* Article */
 
+.article__container {
+  display: flex;
+  gap: 1rem;
+}
+
 .article {
-  margin-bottom: 1rem;
+  border: 2px solid var(--grey-light);
+  padding: 1rem;
+  gap: 1rem;
 }
 
 .article__title {
@@ -209,6 +254,7 @@ p {
 
 .facebook-link {
   color: var(--orange-dark);
+  align-self: flex-end;
 }
 
 /* Sidebar */
@@ -216,7 +262,16 @@ p {
 .sidebar {
   display: flex;
   flex-direction: column;
-  min-width: 350px;
+  gap: 1rem;
+  flex: 5;
+}
+
+.main {
+  flex: 11;
+}
+
+.sidebar article {
+  display: flex;
 }
 
 /* Footer */
@@ -247,4 +302,4 @@ p {
   .main {
     padding-right: 2rem;
   }
-}
+}
\ No newline at end of file
