diff --git a/web/themes/custom/opdavies/assets/css/components/block.pcss b/web/themes/custom/opdavies/assets/css/components/block.pcss
new file mode 100644
index 0000000..0727ec0
--- /dev/null
+++ b/web/themes/custom/opdavies/assets/css/components/block.pcss
@@ -0,0 +1,4 @@
+.sidebar .block {
+  @apply p-6 rounded;
+  @apply dark:bg-gray-750
+}
diff --git a/web/themes/custom/opdavies/assets/css/custom-components.pcss b/web/themes/custom/opdavies/assets/css/custom-components.pcss
index c9d3f0b..86ad2b5 100644
--- a/web/themes/custom/opdavies/assets/css/custom-components.pcss
+++ b/web/themes/custom/opdavies/assets/css/custom-components.pcss
@@ -1,3 +1,4 @@
+@import './components/block.pcss';
 @import './components/button.pcss';
 @import './components/container.pcss';
 @import './components/lead.pcss';
diff --git a/web/themes/custom/opdavies/templates/block/block.html.twig b/web/themes/custom/opdavies/templates/block/block.html.twig
index 75f0065..50e954f 100644
--- a/web/themes/custom/opdavies/templates/block/block.html.twig
+++ b/web/themes/custom/opdavies/templates/block/block.html.twig
@@ -25,7 +25,7 @@
  * @see template_preprocess_block()
  */
 #}
-<section{{ attributes.addClass('mt-6 first:mt-0') }}>
+<section{{ attributes.addClass('[ block ] [ mt-6 first:mt-0 ]') }}>
   {{ title_prefix }}
   {% if label %}
     <h2{{ title_attributes.addClass('mb-3') }}>
diff --git a/web/themes/custom/opdavies/templates/layout/page.html.twig b/web/themes/custom/opdavies/templates/layout/page.html.twig
index e290871..c49c410 100644
--- a/web/themes/custom/opdavies/templates/layout/page.html.twig
+++ b/web/themes/custom/opdavies/templates/layout/page.html.twig
@@ -45,7 +45,7 @@
  * @ingroup themeable
  */
 #}
-<div class="antialiased font-sans text-gray-800 leading-relaxed">
+<div class="[ antialiased font-sans leading-relaxed ] [ text-gray-800 ] [ dark:text-gray-100 dark:bg-gray-700 ]">
   <div class="min-h-screen flex flex-col">
     <div id="nav" class="bg-blue-500 border-b-3 border-blue-700">
       <div class="container">
@@ -98,7 +98,7 @@
           </div>{# /.layout-content #}
 
           {% if page.sidebar_second %}
-            <aside role="complementary" class="col-span-12 md:col-span-4">
+            <aside role="complementary" class="sidebar col-span-12 md:col-span-4">
               {{ page.sidebar_second }}
             </aside>
           {% endif %}