diff --git a/source/_includes/about-author.html.twig b/source/_includes/about-author.html.twig
index 84e8029a..f80e7e40 100644
--- a/source/_includes/about-author.html.twig
+++ b/source/_includes/about-author.html.twig
@@ -3,7 +3,7 @@
 
   <div class="flex mt-4 space-x-4">
     <div class="flex-shrink-0">
-        <img src="{{ avatar.url }}" alt="Picture of Oliver" class="w-16 h-16 border rounded-full border-gray">
+        <img src="{{ avatar.url }}" alt="Picture of Oliver" class="w-16 h-16 rounded-full border border-gray">
     </div>
 
     <div>
diff --git a/source/_includes/figure.html.twig b/source/_includes/figure.html.twig
index c8de55c1..71c49810 100644
--- a/source/_includes/figure.html.twig
+++ b/source/_includes/figure.html.twig
@@ -1,7 +1,7 @@
 <figure class="block">
     <img src="{{ image.src }}" alt="{{ image.alt }}" class="p-1 border">
     {% if caption %}
-        <figcaption class="mt-1 mb-0 italic text-sm text-center text-gray-800">
+        <figcaption class="mt-1 mb-0 text-sm italic text-center text-gray-800">
             {{ caption }}
         </figcaption>
     {% endif %}
diff --git a/source/_includes/footer.html.twig b/source/_includes/footer.html.twig
index e87f8a48..e6e6169e 100644
--- a/source/_includes/footer.html.twig
+++ b/source/_includes/footer.html.twig
@@ -1,7 +1,7 @@
 <footer class="mt-20">
     <nav class="flex flex-wrap justify-center -mb-3">
         {% for link in site.menus.footer %}
-            <a class="mx-3 mb-3 text-sm md:text-lg dark:text-white hover:text-gray-900 dark:hover:text-blue-400 link" href="{{ link.href }}">{{ link.title }}</a>
+            <a class="mx-3 mb-3 text-sm md:text-lg dark:text-white hover:text-gray-900 link dark:hover:text-blue-400" href="{{ link.href }}">{{ link.title }}</a>
         {% endfor %}
     </nav>
 </footer>
diff --git a/source/_includes/navbar.html.twig b/source/_includes/navbar.html.twig
index 1b79f439..04343b8e 100644
--- a/source/_includes/navbar.html.twig
+++ b/source/_includes/navbar.html.twig
@@ -1,11 +1,11 @@
 <div>
-    <div class="max-w-2xl px-4 py-4 mx-auto">
-        <div class="flex flex-col items-center justify-between md:flex-row">
+    <div class="py-4 px-4 mx-auto max-w-2xl">
+        <div class="flex flex-col justify-between items-center md:flex-row">
             <div>
                 <a href="/">
                     <svg
                       aria-hidden="true"
-                      class="w-16 h-16 text-blue-primary fill-current dark:text-blue-400 md:w-18 md:h-18"
+                      class="w-16 h-16 fill-current dark:text-blue-400 text-blue-primary md:w-18 md:h-18"
                       viewBox="0 0 706 504"
                       xmlns="http://www.w3.org/2000/svg"
                     >
@@ -18,7 +18,7 @@
             </div>
 
             <div>
-                <nav class="flex items-center mt-4 space-x-6 md:mt-0 md:flex-row">
+                <nav class="flex items-center mt-4 space-x-6 md:flex-row md:mt-0">
                     {% for item in site.menus.main %}
                         {% set is_active = page.url matches '#' ~ item.is_active ~ '#' %}
                         <a class="text-black dark:text-white border-b-3 py-2 hover:border-gray-300 {{ is_active ? 'border-blue-primary dark:border-blue-400' : 'border-transparent' }}" href="{{ item.href }}">{{ item.title }}</a>
diff --git a/source/_includes/post/post-teaser.html.twig b/source/_includes/post/post-teaser.html.twig
index d9ad99f0..ab0a7c09 100644
--- a/source/_includes/post/post-teaser.html.twig
+++ b/source/_includes/post/post-teaser.html.twig
@@ -1,6 +1,6 @@
 <article>
     <h2>
-        <a class="text-blue-primary dark:text-blue-400" href="{{ post.url }}">
+        <a class="dark:text-blue-400 text-blue-primary" href="{{ post.url }}">
             {{ post.title }}
         </a>
     </h2>
diff --git a/source/_includes/test-driven-drupal-subscribe-form.html.twig b/source/_includes/test-driven-drupal-subscribe-form.html.twig
index 68b31fa1..4f8182bd 100644
--- a/source/_includes/test-driven-drupal-subscribe-form.html.twig
+++ b/source/_includes/test-driven-drupal-subscribe-form.html.twig
@@ -9,8 +9,8 @@ and be notified of any updates.</strong></p>
             </div>
 
             <div class="flex overflow-hidden">
-                <input type="email" value="" name="EMAIL" class="required email block w-full border border-gray p-3 pl-5 rounded-l-full" placeholder="enter your email" aria-label="Email">
-                <button type="submit" name="subscribe" class="block w-auto border border-gray border-l-0 py-3 pl-5 pr-6 rounded-r-full bg-blue-600 text-white">Subscribe</button>
+                <input type="email" value="" name="EMAIL" class="block p-3 pl-5 w-full rounded-l-full border required email border-gray" placeholder="enter your email" aria-label="Email">
+                <button type="submit" name="subscribe" class="block py-3 pr-6 pl-5 w-auto text-white bg-blue-600 rounded-r-full border border-l-0 border-gray">Subscribe</button>
             </div>
         </div>
     </form>
diff --git a/source/_layouts/base.html.twig b/source/_layouts/base.html.twig
index 0feedcce..14c688a0 100644
--- a/source/_layouts/base.html.twig
+++ b/source/_layouts/base.html.twig
@@ -1,12 +1,12 @@
 {% extends 'app' %}
 
 {% block body %}
-    <div class="min-h-screen font-sans text-base font-light text-gray-900 md:text-xl dark:bg-gray-900 dark:text-white">
+    <div class="min-h-screen font-sans text-base font-light text-gray-900 md:text-xl dark:text-white dark:bg-gray-900">
         <a class="sr-only focus:not-sr-only" href="#main-content">Skip to main content</a>
 
         {% include 'navbar' %}
 
-        <div class="max-w-2xl px-4 py-10 mx-auto md:py-16">
+        <div class="py-10 px-4 mx-auto max-w-2xl md:py-16">
             <div id="main-content">
                 <h1 class="text-xl font-bold md:text-2xl">
                     {% block page_title %}
diff --git a/source/_pages/recommendations.html.twig b/source/_pages/recommendations.html.twig
index 8f634a69..e9a50d5a 100644
--- a/source/_pages/recommendations.html.twig
+++ b/source/_pages/recommendations.html.twig
@@ -128,14 +128,14 @@ recommendations:
             <header>{{ recommendation.tagline }}</header>
 
             <div class="mt-4">
-                <div class="flex flex-col-reverse md:flex-row space-y-3 space-y-reverse md:space-y-0 md:space-x-6">
+                <div class="flex flex-col-reverse space-y-3 space-y-reverse md:flex-row md:space-y-0 md:space-x-6">
                     <div class="markdown">
                         {{ recommendation.text|raw }}
                     </div>
 
                     {% if recommendation.image.path %}
                         <div class="flex-shrink-0">
-                            <img class="w-16 md:w-24 border border-gray rounded-full bg-white" src="{{ recommendation.image.path }}">
+                            <img class="w-16 bg-white rounded-full border md:w-24 border-gray" src="{{ recommendation.image.path }}">
                         </div>
                     {% endif %}
                 </div>
diff --git a/source/_pages/talks.html.twig b/source/_pages/talks.html.twig
index ef35e7b6..b18a42c4 100644
--- a/source/_pages/talks.html.twig
+++ b/source/_pages/talks.html.twig
@@ -11,7 +11,7 @@ use:
         {% for talk in data.talks|sort((a, b) => get_last_event_date_for_talk(a) < get_last_event_date_for_talk(b)) %}
             <article>
                 <h2>
-                    <a class="text-blue-primary dark:text-blue-400" href="{{ talk.url }}">
+                    <a class="dark:text-blue-400 text-blue-primary" href="{{ talk.url }}">
                         {{ talk.title }}
                     </a>
                 </h2>