diff --git a/server/templates/collection_element.htm b/server/templates/collection_element.htm
index 3770ee8..8e483e5 100644
--- a/server/templates/collection_element.htm
+++ b/server/templates/collection_element.htm
@@ -1,16 +1,11 @@
+{% import "macros.htm" as macros %}
 <!DOCTYPE html>
 <html>
     {% set title = collection.title %}
     <head>
         <meta charset="utf-8"/>
         <title>{{ title }}</title>
-        <style>
-            table tr th, table tr td {
-                margin: 0;
-                padding: .2em;
-                border: solid black 1px;
-            }
-        </style>
+        {{ macros.shared_style() }}
     </head>
     <body>
         <a href="/collection">&lt;- back to list</a>
diff --git a/server/templates/collection_list.htm b/server/templates/collection_list.htm
index 41c5b4d..1206a08 100644
--- a/server/templates/collection_list.htm
+++ b/server/templates/collection_list.htm
@@ -1,16 +1,11 @@
+{% import "macros.htm" as macros %}
 <!DOCTYPE html>
 <html>
     {% set title = collection_list | length | string + " Collections known" %}
     <head>
         <meta charset="utf-8"/>
         <title>{{ title }}</title>
-        <style>
-            table tr th, table tr td {
-                margin: 0;
-                padding: .2em;
-                border: solid black 1px;
-            }
-        </style>
+        {{ macros.shared_style() }}
     </head>
     <body>
         <h1>{{ title }}</h1>
diff --git a/server/templates/macros.htm b/server/templates/macros.htm
new file mode 100644
index 0000000..bea2e47
--- /dev/null
+++ b/server/templates/macros.htm
@@ -0,0 +1,19 @@
+{% macro shared_style() %}
+    <style>
+        table tr th, table tr td {
+            margin: 0;
+            padding: .2em;
+            border: solid black 1px;
+        }
+        a:link { text-decoration: none; }
+        a:visited { text-decoration: none; }
+        a:hover { text-decoration: none; }
+        a:active { text-decoration: none; }
+        .button {
+            padding: .1rem .2rem;
+            margin: 0 .1rem;
+            background-color: lightcoral;
+            border-radius: .3rem;
+        }
+    </style>
+{% endmacro %}
diff --git a/server/templates/media_element.htm b/server/templates/media_element.htm
index f2b3c14..4a456ee 100644
--- a/server/templates/media_element.htm
+++ b/server/templates/media_element.htm
@@ -1,16 +1,11 @@
+{% import "macros.htm" as macros %}
 <!DOCTYPE html>
 <html>
     {% set title = element.title %}
     <head>
         <meta charset="utf-8"/>
         <title>{{ title }}</title>
-        <style>
-            table tr th, table tr td {
-                margin: 0;
-                padding: .2em;
-                border: solid black 1px;
-            }
-        </style>
+        {{ macros.shared_style() }}
     </head>
     <body>
         <a href="/media">&lt;- back to list</a>
diff --git a/server/templates/media_list.htm b/server/templates/media_list.htm
index c22b64f..5b73d73 100644
--- a/server/templates/media_list.htm
+++ b/server/templates/media_list.htm
@@ -1,26 +1,11 @@
+{% import "macros.htm" as macros %}
 <!DOCTYPE html>
 <html>
     {% set title = media_list | length | string + " Videos known" %}
     <head>
         <meta charset="utf-8"/>
         <title>{{ title }}</title>
-        <style>
-            table tr th, table tr td {
-                margin: 0;
-                padding: .2em;
-                border: solid black 1px;
-            }
-            a:link { text-decoration: none; }
-            a:visited { text-decoration: none; }
-            a:hover { text-decoration: none; }
-            a:active { text-decoration: none; }
-            .button {
-                padding: .1rem .2rem;
-                margin: 0 .1rem;
-                background-color: lightcoral;
-                border-radius: .3rem;
-            }
-        </style>
+        {{ macros.shared_style() }}
     </head>
     <body>
         <h1>{{ title }}</h1>
