diff --git a/themes/red/assets/css/site.css b/themes/red/assets/css/site.css
index 41083c8..6366a8d 100644
--- a/themes/red/assets/css/site.css
+++ b/themes/red/assets/css/site.css
@@ -62,6 +62,10 @@
         visibility: hidden;
         height: 0;
     }
+
+    #character-container {
+        grid-template-columns: 50% 50%;
+    }
 }
 
 @media (min-width: 1100px) {
@@ -866,3 +870,7 @@ model-viewer {
 .project-contribution {
     background-color: #586449;
 }
+
+#character-container {
+    display: grid;
+}
diff --git a/themes/red/layouts/_default/listchar.html b/themes/red/layouts/_default/listchar.html
index 33b00d8..39e4315 100644
--- a/themes/red/layouts/_default/listchar.html
+++ b/themes/red/layouts/_default/listchar.html
@@ -8,7 +8,7 @@
     {{ $.Scratch.Set "header-type" "h3" }}
     {{ $.Scratch.Set "header-name" "Original" }}
     {{ partial "fake-heading.html" $ }}
-    <div class="generic-con" style="display: grid; grid-template-columns: 50% 50%;">
+    <div class="generic-con" id="character-container">
 
     {{ range $name, $taxonomy := (index .Site.Taxonomies .Params.listtag) }}
         {{ $original := false }}
@@ -30,7 +30,7 @@
             {{ $.Scratch.Set "header-name" "Others" }}
             {{ partial "fake-heading.html" $ }}
         </summary>
-        <div class="generic-con"  style="display: grid; grid-template-columns: 50% 50%;">
+        <div class="generic-con" id="character-container">
         {{ range $name, $taxonomy := (index .Site.Taxonomies .Params.listtag) }}
             {{ $original := false }}
             {{ if $taxonomy.Page.Params.original }}