diff --git a/layouts/partials/content.html b/layouts/partials/content.html
index d251905..b515d37 100644
--- a/layouts/partials/content.html
+++ b/layouts/partials/content.html
@@ -21,7 +21,7 @@
   <hr />
   <div class="content mt-3">
     {{ if .TableOfContents }}
-      <div class="float-lg-right ml-lg-3 mb-2 p-3">
+      <div class="float-lg-right ml-lg-3 mb-3 p-3">
         {{ .TableOfContents }}
       </div>
     {{ end }}
diff --git a/layouts/partials/share.html b/layouts/partials/share.html
index 9038429..1ddcbde 100644
--- a/layouts/partials/share.html
+++ b/layouts/partials/share.html
@@ -1,5 +1,5 @@
 {{ if .Section }}
-    <div class="container mt-4 text-center">
+    <div class="container mt-5 text-center">
     <small>Share this page</small>
     <h3>
         <a href="https://twitter.com/intent/tweet?text={{ .Permalink }}"><i class="mx-1 fab fa-twitter" aria-hidden="true"></i></a>
diff --git a/static/src/scss/style.scss b/static/src/scss/style.scss
index 54305ba..e175f81 100644
--- a/static/src/scss/style.scss
+++ b/static/src/scss/style.scss
@@ -169,7 +169,7 @@ ul ul, ol ol {
 }
 
 pre.chroma {
-  margin: $spacer 0;
+  margin-bottom: $paragraph-margin-bottom;
   padding: $spacer;
 
   .highlight & {
@@ -179,7 +179,7 @@ pre.chroma {
 
 .content {
   h1, h2, h3, h4, h5, h6 {
-    margin-top: $spacer;
+    margin-top: $headings-margin-bottom * 2.2;
   }
 
   blockquote {
@@ -195,6 +195,10 @@ pre.chroma {
     width: 100%;
     height: 75vh;
   }
+
+  figure {
+    margin-bottom: $paragraph-margin-bottom;
+  }
 }
 
 .plyr {
diff --git a/static/src/scss/variables.scss b/static/src/scss/variables.scss
index be41f0f..0877b7a 100644
--- a/static/src/scss/variables.scss
+++ b/static/src/scss/variables.scss
@@ -1,3 +1,6 @@
 $primary: #E85537;
 $body-bg: #17181C;
 $footer-height: 110px;
+$font-size-base: 1.2rem;
+$headings-margin-bottom: 1.5rem;
+$paragraph-margin-bottom: $headings-margin-bottom * 0.85;