diff --git a/html/themes/custom/common_design_subtheme/components/gho-interactive-content/gho-interactive-content.css b/html/themes/custom/common_design_subtheme/components/gho-interactive-content/gho-interactive-content.css
index 61c9b2578..8ac323e4d 100644
--- a/html/themes/custom/common_design_subtheme/components/gho-interactive-content/gho-interactive-content.css
+++ b/html/themes/custom/common_design_subtheme/components/gho-interactive-content/gho-interactive-content.css
@@ -161,3 +161,39 @@
     flex-basis: calc(50% - 1rem);
   }
 }
+
+/**
+ * Support for 4-col interactive content.
+ */
+ .layout--fourcol--interactive-content {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.layout--fourcol--interactive-content > .layout__region {
+  flex: 0 1 100%;
+}
+
+@media screen and (min-width: 768) {
+  .layout--fourcol--interactive-content {
+    gap: 1rem;
+  }
+
+  .layout--fourcol--interactive-content.layout--fourcol--interactive-content--25-25-25-25
+    > .layout__region {
+    flex: 0 1 50%;
+    flex-basis: calc(50% - 1rem);
+  }
+}
+
+@media screen and (min-width: 1024px) {
+  .layout--fourcol--interactive-content {
+    gap: 1rem;
+  }
+
+  .layout--fourcol--interactive-content.layout--fourcol--interactive-content--25-25-25-25
+    > .layout__region {
+    flex: 0 1 25%;
+    flex-basis: calc(25% - 1rem);
+  }
+}