diff --git a/.editorconfig b/.editorconfig
index ce7c96f4..899140f9 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -12,10 +12,7 @@ trim_trailing_whitespace = true
 indent_size = 4
 indent_style = space
 
-[*.sass]
-indent_size = 2
-
-[*.vue]
+[*.{css,js,vue}]
 indent_size = 2
 
 # Markdown customizations
diff --git a/assets/css/app.css b/assets/css/app.css
new file mode 100644
index 00000000..a838dca8
--- /dev/null
+++ b/assets/css/app.css
@@ -0,0 +1,20 @@
+@tailwind preflight;
+
+a {
+  @apply text-blue no-underline;
+
+  &:hover {
+    @apply underline;
+  }
+}
+
+@tailwind components;
+
+@import 'components/blockquote.css';
+@import 'components/button.css';
+@import 'components/markup.css';
+@import 'components/note.css';
+@import 'components/talks/video.css';
+@import 'components/widget.css';
+
+@tailwind utilities;
diff --git a/assets/sass/components/blockquote.sass b/assets/css/components/blockquote.css
similarity index 75%
rename from assets/sass/components/blockquote.sass
rename to assets/css/components/blockquote.css
index 56e12b0b..ebd9152a 100644
--- a/assets/sass/components/blockquote.sass
+++ b/assets/css/components/blockquote.css
@@ -1,2 +1,3 @@
-blockquote
+blockquote {
   @apply border-l-4 border-blue pl-4 px-6 py-2
+}
diff --git a/assets/sass/components/button.sass b/assets/css/components/button.css
similarity index 64%
rename from assets/sass/components/button.sass
rename to assets/css/components/button.css
index 898282f3..3ccbabca 100644
--- a/assets/sass/components/button.sass
+++ b/assets/css/components/button.css
@@ -1,10 +1,13 @@
-.button
-  @apply bg-blue border-blue border inline-block text-white no-underline py-2 px-3 rounded text-sm
+.button {
+  @apply bg-blue border-blue border inline-block text-white no-underline py-2 px-3 rounded text-sm;
 
-  &:focus
+  &:focus {
     @apply py-2 px-3 m-0
+  }
 
   &:active,
   &:focus,
-  &:hover
+  &:hover {
     @apply bg-white text-blue
+  }
+}
diff --git a/assets/sass/components/markup.sass b/assets/css/components/markup.css
similarity index 68%
rename from assets/sass/components/markup.sass
rename to assets/css/components/markup.css
index 7ed2dae0..d55dce98 100644
--- a/assets/sass/components/markup.sass
+++ b/assets/css/components/markup.css
@@ -1,12 +1,14 @@
-.markup
-  @apply leading-normal
+.markup {
+  @apply leading-normal;
 
   h2,
-  h3
+  h3 {
     @apply text-black mb-3
+  }
 
-  h2
+  h2 {
     @apply mt-6 mb-2
+  }
 
   p,
   ul,
@@ -14,25 +16,34 @@
   table,
   figure,
   pre,
-  [v-pre]
-    &:not(:last-child)
+  [v-pre] {
+    &:not(:last-child) {
       @apply mb-6
+    }
+  }
 
-  code
+  code {
     @apply bg-grey-lighter font-mono text-sm
+  }
 
   p,
-  li
-    code
+  li {
+    code {
       @apply inline-block border border-grey-light font-bold mx-px p-1 leading-none
+    }
+  }
 
   pre code,
-  .hljs
+  .hljs {
     @apply block leading-loose overflow-x-scroll p-6
+  }
 
   figure,
-  img
+  img {
     @apply block
+  }
 
-  figcaption
+  figcaption {
     @apply italic text-sm text-grey-darker text-center mb-0 mt-1
+  }
+}
diff --git a/assets/css/components/note.css b/assets/css/components/note.css
new file mode 100644
index 00000000..0d8f1174
--- /dev/null
+++ b/assets/css/components/note.css
@@ -0,0 +1,15 @@
+.note {
+  @apply bg-blue-lighter border-blue border-l-4 mb-4 p-4 rounded;
+
+  > *:not(:first-child) {
+    @apply mt-6
+  }
+
+  p a {
+    @apply text-black underline;
+
+    &:hover {
+      @apply no-underline
+    }
+  }
+}
diff --git a/assets/sass/components/talk/video.sass b/assets/css/components/talks/video.css
similarity index 65%
rename from assets/sass/components/talk/video.sass
rename to assets/css/components/talks/video.css
index 97a47e1d..ed037900 100644
--- a/assets/sass/components/talk/video.sass
+++ b/assets/css/components/talks/video.css
@@ -1,4 +1,6 @@
-.talk-video
+.talk-video {
   iframe,
-  embed
+  embed {
     @apply absolute h-full pin-l pin-t w-full
+  }
+}
diff --git a/assets/css/components/widget.css b/assets/css/components/widget.css
new file mode 100644
index 00000000..fdcc356b
--- /dev/null
+++ b/assets/css/components/widget.css
@@ -0,0 +1,3 @@
+.widget {
+  @apply block mb-6
+}
diff --git a/assets/sass/app.sass b/assets/sass/app.sass
deleted file mode 100644
index 74e9a26d..00000000
--- a/assets/sass/app.sass
+++ /dev/null
@@ -1,25 +0,0 @@
-@import '~font-awesome/css/font-awesome'
-@import '~highlightjs/styles/github-gist'
-
-@tailwind preflight
-
-a
-  @apply text-blue no-underline
-
-  &:hover
-    @apply underline
-
-@tailwind components
-
-@import 'components/blockquote'
-@import 'components/button'
-@import 'components/listing'
-@import 'components/markup'
-@import 'components/note'
-@import 'components/post'
-@import 'components/slides'
-@import 'components/table'
-@import 'components/talk/video'
-@import 'components/widget'
-
-@tailwind utilities
diff --git a/assets/sass/components/listing.sass b/assets/sass/components/listing.sass
deleted file mode 100644
index e6553913..00000000
--- a/assets/sass/components/listing.sass
+++ /dev/null
@@ -1,8 +0,0 @@
-.listing
-  @apply pl-0
-
-.listing-item
-  @apply overflow-hidden pb-8
-
-  &:not(:last-child)
-    @apply border-b border-grey-light mb-8
diff --git a/assets/sass/components/note.sass b/assets/sass/components/note.sass
deleted file mode 100644
index d98a3ff4..00000000
--- a/assets/sass/components/note.sass
+++ /dev/null
@@ -1,8 +0,0 @@
-.note
-  @apply bg-blue-lighter border-blue border-l-4 mb-4 p-4 rounded
-
-  > *:last-child
-    @apply mb-0
-
-  p a
-    @apply text-black
diff --git a/assets/sass/components/post.sass b/assets/sass/components/post.sass
deleted file mode 100644
index 3b9e1ed0..00000000
--- a/assets/sass/components/post.sass
+++ /dev/null
@@ -1,5 +0,0 @@
-.post
-  @apply -mb-6
-
-  > *
-    @apply mb-6
diff --git a/assets/sass/components/slides.sass b/assets/sass/components/slides.sass
deleted file mode 100644
index 93aa9020..00000000
--- a/assets/sass/components/slides.sass
+++ /dev/null
@@ -1,15 +0,0 @@
-.slides
-  background: url("../images/loading.gif") center no-repeat
-  min-height: 275px
-
-  @screen md
-    &
-      min-height: 375px
-
-  @screen lg
-    &
-      min-height: 450px
-
-  @screen xl
-    &
-      min-height: 560px
diff --git a/assets/sass/components/table.sass b/assets/sass/components/table.sass
deleted file mode 100644
index 50d743bf..00000000
--- a/assets/sass/components/table.sass
+++ /dev/null
@@ -1,20 +0,0 @@
-.table-collapse
-  @apply border-collapse
-
-.table-responsive
-  @apply mb-4 border w-full overflow-x-auto overflow-y-hidden
-
-  table
-    @apply mb-0 border-0 whitespace-no-wrap
-
-.table
-  @apply w-full table-collapse
-
-  & tr:nth-child(odd)
-    @apply bg-grey-lighter
-
-  & tr th
-    @apply text-left p-3 bg-white
-
-  & td
-    @apply p-3 border-t
diff --git a/assets/sass/components/widget.sass b/assets/sass/components/widget.sass
deleted file mode 100644
index 12f3f3b9..00000000
--- a/assets/sass/components/widget.sass
+++ /dev/null
@@ -1,2 +0,0 @@
-.widget
-  @apply mb-6 block
diff --git a/package.json b/package.json
index afdaf343..f45a73c7 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
     "laravel-mix": "^2.1.11",
     "laravel-mix-purgecss": "^2.1.2",
     "laravel-mix-tailwind": "^0.1.0",
+    "postcss-nested": "^4.1.2",
     "tailwindcss": "^0.6",
     "tailwindcss-skip-link": "^1.0.0",
     "tailwindcss-visuallyhidden": "^1.0.1",
diff --git a/webpack.mix.js b/webpack.mix.js
index 7888e35c..3b30efe9 100644
--- a/webpack.mix.js
+++ b/webpack.mix.js
@@ -1,21 +1,22 @@
 let mix = require('laravel-mix');
 
 require('laravel-mix-purgecss');
-require('laravel-mix-tailwind');
 
 mix.disableNotifications()
-    .sass('assets/sass/app.sass', 'source/dist/css')
-    .js([
-        'node_modules/jquery/src/jquery.js',
-        'assets/js/app.js',
-    ], 'source/dist/js/all.js')
-    .copyDirectory('node_modules/font-awesome/fonts', 'source/dist/fonts')
-    .tailwind('tailwind.config.js')
-    .purgeCss({
-        globs: [
-            path.join(__dirname, 'assets/js/**/*.{js,vue}'),
-            path.join(__dirname, 'output_*/**/*.html'),
-        ],
-        whitelistPatterns: [/language/, /hljs/],
-        whitelistPatternsChildren: [/^markdown$/]
-    });
+  .postCss('assets/css/app.css', 'source/dist/css', [
+    require('postcss-nested'),
+    require('tailwindcss')('tailwind.config.js'),
+  ])
+  .js([
+    'node_modules/jquery/src/jquery.js',
+    'assets/js/app.js',
+  ], 'source/dist/js/all.js')
+  .copyDirectory('node_modules/font-awesome/fonts', 'source/dist/fonts')
+  .purgeCss({
+    globs: [
+      path.join(__dirname, 'assets/js/**/*.{js,vue}'),
+      path.join(__dirname, 'output_*/**/*.html'),
+    ],
+    whitelistPatterns: [/language/, /hljs/],
+    whitelistPatternsChildren: [/^markdown$/]
+  });
diff --git a/yarn.lock b/yarn.lock
index 5168d885..81698288 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5250,6 +5250,14 @@ postcss-nested@^3.0.0:
     postcss "^6.0.14"
     postcss-selector-parser "^3.1.1"
 
+postcss-nested@^4.1.2:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/postcss-nested/-/postcss-nested-4.1.2.tgz#8e0570f736bfb4be5136e31901bf2380b819a561"
+  integrity sha512-9bQFr2TezohU3KRSu9f6sfecXmf/x6RXDedl8CHF6fyuyVW7UqgNMRdWMHZQWuFY6Xqs2NYk+Fj4Z4vSOf7PQg==
+  dependencies:
+    postcss "^7.0.14"
+    postcss-selector-parser "^5.0.0"
+
 postcss-normalize-charset@^1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz#ef9ee71212d7fe759c78ed162f61ed62b5cb93f1"
@@ -5324,7 +5332,7 @@ postcss-selector-parser@^3.1.1:
     indexes-of "^1.0.1"
     uniq "^1.0.1"
 
-postcss-selector-parser@^5.0.0-rc.3:
+postcss-selector-parser@^5.0.0, postcss-selector-parser@^5.0.0-rc.3:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-5.0.0.tgz#249044356697b33b64f1a8f7c80922dddee7195c"
   integrity sha512-w+zLE5Jhg6Liz8+rQOWEAwtwkyqpfnmsinXjXg6cY7YIONZZtgvE0v2O0uhQBs0peNomOJwWRKt6JBfTdTd3OQ==
@@ -5394,6 +5402,15 @@ postcss@^7.0.0:
     source-map "^0.6.1"
     supports-color "^6.1.0"
 
+postcss@^7.0.14:
+  version "7.0.14"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.14.tgz#4527ed6b1ca0d82c53ce5ec1a2041c2346bbd6e5"
+  integrity sha512-NsbD6XUUMZvBxtQAJuWDJeeC4QFsmWsfozWxCJPWf3M55K9iu2iMDaKqyoOdTJ1R4usBXuxlVFAIo8rZPQD4Bg==
+  dependencies:
+    chalk "^2.4.2"
+    source-map "^0.6.1"
+    supports-color "^6.1.0"
+
 prepend-http@^1.0.0:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-1.0.4.tgz#d4f4562b0ce3696e41ac52d0e002e57a635dc6dc"