diff --git a/index.html b/index.html
index 36c4a93d..67e66e7d 100644
--- a/index.html
+++ b/index.html
@@ -46,7 +46,7 @@
         </ul>
       </div>
 
-      <button>Donate Now</button>
+      <button class="navbtn">Donate Now</button>
     </div>
 
     <section class="content">
@@ -62,8 +62,8 @@ <h1>Bikes for Refugees</h1>
               Providing donated bikes and accessories to refugees and asylum
               seekers in Scotland.
             </p>
-            <button><a href="WWW.google.com"></a>Donate a bike today</button>
-            <button>Volunteer</button>
+            <button class="btn1"><a href="WWW.google.com"></a>Donate a bike today</button>
+            <button class="btn2">Volunteer</button>
           </div>
 
           <div class="sidebar">
diff --git a/styles/style.css b/styles/style.css
index c41efb5e..1077dab8 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -176,6 +176,32 @@ p {
   background: var(--orange-dark);
 }
 
+.navbtn {
+  color: #e4e4e4;
+  background-color: #c05326;
+  width: 100px;
+  height: 35px;
+  border-radius: 5px;
+  border: #292b2c;
+}
+
+.btn1 {
+  color: #e4e4e4;
+  background-color: #c05326;
+  width: 150px;
+  height: 35px;
+  border-radius: 5px;
+  border: #292b2c;
+}
+.btn2 {
+  color: #e4e4e4;
+  background-color: #c05326;
+  width: 100px;
+  height: 35px;
+  border-radius: 5px;
+  border: #292b2c;
+}
+
 
 /* Article */