From 109b3576719d23cbdeef537492658815ae0e27f7 Mon Sep 17 00:00:00 2001
From: Kevin Chu <kwhchu@users.noreply.github.com>
Date: Fri, 7 Apr 2017 14:15:00 -0700
Subject: [PATCH] Updating accordion styles

---
 docs/assets/scss/_accordion-content.scss | 40 ++++++++++++++++++++++++
 docs/pages/index.md                      |  2 +-
 2 files changed, 41 insertions(+), 1 deletion(-)

diff --git a/docs/assets/scss/_accordion-content.scss b/docs/assets/scss/_accordion-content.scss
index c41bb83df..f3558de6a 100644
--- a/docs/assets/scss/_accordion-content.scss
+++ b/docs/assets/scss/_accordion-content.scss
@@ -1,7 +1,47 @@
+.accordion {
+  margin-top: 2rem;
+}
+
 .accordion-content-item {
   margin-bottom: 1rem;
 }
 
+.accordion-title {
+  background-color: #f5f5f5;
+  color: #676767;
+  font-size: 1.25rem;
+  margin-bottom: 1rem;
+  border-bottom: 1px solid #e6e6e6;
+}
+
+.accordion-title:hover,
+.accordion-title:focus {
+  color: $black;
+  background-color: #efefef;
+}
+
+
+.accordion-item {
+  
+  &.is-active {
+    box-shadow: 0px 1px 8px 0px rgba(0,0,0,0.15);  
+    
+    .accordion-title {
+      margin-bottom: 0;
+      border-bottom: none;
+      color: $black;
+    }
+    
+    .accordion-content {
+      margin-bottom: 1rem;
+      border-bottom: 1px solid #e6e6e6;
+    }
+  }
+}
+
+
+
+
 .accordion-content-item-divider {
   border-bottom: 1px dashed #e5e5e5;
 }
diff --git a/docs/pages/index.md b/docs/pages/index.md
index 9890098dc..11042a9bf 100644
--- a/docs/pages/index.md
+++ b/docs/pages/index.md
@@ -70,7 +70,7 @@ With an easy to understand syntax and consistent structure, you'll learn your wa
 
 ## Experienced with Foundation for Sites?
 
-With an easy to understand syntax and consistent structure, you'll learn your way around Foudnation in no time!
+With an easy to understand syntax and consistent structure, you'll learn your way around Foundation in no time!
 
 <ul class="accordion" data-accordion>
   <li class="accordion-item is-active" data-accordion-item>
-- 
2.47.2