diff --git a/src/content/site/faq.md b/src/content/site/faq.md
index a476849..0b087ff 100644
--- a/src/content/site/faq.md
+++ b/src/content/site/faq.md
@@ -4,7 +4,7 @@ path: /faq
 
 ## What are the roles and what do they mean?
 
-### Community-Member,<br>Active Contributor,<br>Chatterbox,<br>Super-Talky-Guy,<br>Bepis-Drinker,<br>Conke-Commander,<br>and Patriotic-Procrastinator
+### Community-Member,<br />Active Contributor,<br />Chatterbox,<br />Super-Talky-Guy,<br />Bepis-Drinker,<br />Conke-Commander,<br />and Patriotic-Procrastinator
 
 These are the activity roles of the server in the order you will be granted them. Different tiers will grant different perks, such as unlocking hidden channels, voice access, and nicknaming privileges. These roles are assigned automatically as you participate in the server, so don't ask for them.
 
diff --git a/src/pages/faq.tsx b/src/pages/faq.tsx
index 5ae52e1..192f4ae 100644
--- a/src/pages/faq.tsx
+++ b/src/pages/faq.tsx
@@ -1,7 +1,7 @@
 import { graphql } from "gatsby"
 import React, { Fragment } from "react"
 import cx from "classnames"
-import { MarkdownRemark } from "../../generated/graphql"
+import { Mdx } from "../../generated/graphql"
 import { ComponentQuery } from "../../typings"
 import { Markdown } from "../components/Markdown"
 import { SEO } from "../components/SEO"
@@ -9,7 +9,7 @@ import { PageContent } from "../components/PageContent"
 import { HeaderBarebone } from "../components/HeaderBarebone"
 import { buildToc } from "../utils"
 
-function FaqPage({ data }: ComponentQuery<{ md: MarkdownRemark }>) {
+function FaqPage({ data }: ComponentQuery<{ md: Mdx }>) {
   const { md } = data
 
   const toc = buildToc(md.headings!)
@@ -22,15 +22,15 @@ function FaqPage({ data }: ComponentQuery<{ md: MarkdownRemark }>) {
         className={cx({ shifted: toc.length })}
       />
 
-      <PageContent content={<Markdown content={md.html!} />} toc={toc} />
+      <PageContent content={<Markdown content={md.body!} />} toc={toc} />
     </Fragment>
   )
 }
 
 export const query = graphql`
   query FaqPage {
-    md: markdownRemark(frontmatter: { path: { eq: "/faq" } }) {
-      html
+    md: mdx(frontmatter: { path: { eq: "/faq" } }) {
+      body
       headings {
         depth
         value