diff --git a/src/components/FAQ.astro b/src/components/FAQ.astro
new file mode 100644
index 0000000..e5ca498
--- /dev/null
+++ b/src/components/FAQ.astro
@@ -0,0 +1,127 @@
+---
+const { index = 0, question, answer, source = 'nosrc' } = Astro.props;
+
+---
+
+<div class="faq">
+  <div class="faq-title">
+    <div class="accordion-section-title"> <!-- TODO: add href attribute linking to answer div -->
+      {question}
+    </div>
+    <!-- TODO: add rotating chevron -->
+  </div>
+  <div class="accordion-section-content"> <!-- TODO: add id attr for linking to -->
+    <p>
+      {answer}
+    </p>
+    {source != 'nosrc' &&
+      <p>
+        Visit <a href={source}>this page</a> for more information.
+      </p>
+    }
+  </div>
+</div>
+
+<style>
+  .faq-section {
+    width: 100%;
+    height: fit-content;
+    display: flex;
+    justify-content: center;
+    margin-top: 5rem;
+    margin-bottom: 5rem;
+
+    h1 {
+      margin-bottom: 2rem;
+    }
+
+    .faq-container {
+      width: $page-width;
+      margin: 0.5rem;
+    }
+
+    a {
+      text-decoration: underline;
+      color: #b62a2a;
+    }
+
+    a:hover {
+      color: #ff0000;
+    }
+  }
+
+  @media screen and (max-width: 855px) {
+    .faq-section {
+      align-items: center;
+      margin: auto;
+
+      .faq-container {
+        width: 600px;
+      }
+    }
+  }
+
+  @media screen and (max-width: 855px) {
+    .faq-section {
+      align-items: center;
+      margin: auto;
+
+      .faq-container {
+        width: 600px;
+      }
+    }
+  }
+
+  .faq {
+    margin: 1rem 0;
+    border-radius: 0.1rem;
+    background: #f0efef;
+    transition: all linear 0.1s;
+    border-left: 4px solid #f0efef;
+    cursor: pointer;
+  }
+
+  .faq-title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .faq-chevron {
+    margin: 1rem;
+    margin-right: 1.5rem;
+  }
+
+  .accordion {
+    overflow: hidden;
+    border-radius: 4px;
+  }
+  .accordion-section-title {
+    width: 100%;
+    padding: 15px;
+  }
+  .accordion-section-title {
+    width: 100%;
+    display: inline-block;
+    transition: all linear 0.1s;
+    padding: 1.3rem 15px;
+    text-decoration: none;
+    font-weight: 600;
+  }
+  .faq.active {
+    border-left: 4px solid #e62828;
+    text-decoration: none;
+  }
+  .faq:hover {
+    border-left: 4px solid #e62828;
+    text-decoration: none;
+  }
+  .accordion-section:last-child .accordion-section-title {
+    border-bottom: none;
+  }
+  .accordion-section-content {
+    padding: 15px;
+    padding-top: 0;
+    display: none;
+  }
+</style>