diff --git a/css/styles.css b/css/styles.css
index 9cd6ad5cad9ee485530c1b41ebccb40e6d6f5572..840a61eb1b1f876cbae355d7f3dfa8c7d4e8c7d3 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -1718,23 +1718,32 @@ svg:not(:root) {
     padding: 0;
     width: 100%; }
 
-.layout--fivecol-section .layout-builder__region {
-  display: inline-block; }
-
-.layout--fivecol-section .layout__region--first {
-  width: 23%; }
-
-.layout--fivecol-section .layout__region--second {
-  width: 18%; }
-
-.layout--fivecol-section .layout__region--third {
-  width: 18%; }
-
-.layout--fivecol-section .layout__region--fourth {
-  width: 18%; }
-
-.layout--fivecol-section .layout__region--fifth {
-  width: 20%; }
+.layout--uwfivecol {
+  display: grid; }
+  .layout--uwfivecol.even-split {
+    grid-template-columns: 20% 20% 20% 20% 20%; }
+  .layout--uwfivecol.larger-left {
+    grid-template-columns: 40% 15% 15% 15% 15%; }
+  .layout--uwfivecol.larger-second {
+    grid-template-columns: 15% 40% 15% 15% 15%; }
+  .layout--uwfivecol.larger-third {
+    grid-template-columns: 15% 15% 40% 15% 15%; }
+  .layout--uwfivecol.larger-fourth {
+    grid-template-columns: 15% 15% 15% 40% 15%; }
+  .layout--uwfivecol.larger-right {
+    grid-template-columns: 15% 15% 15% 15% 40%; }
+  .layout--uwfivecol.legacy-23-19-19-19-20 {
+    grid-template-columns: 23% 19% 19% 19% 20%; }
+  .layout--uwfivecol .layout__region--first {
+    grid-column: 1 / 2; }
+  .layout--uwfivecol .layout__region--second {
+    grid-column: 2 / 3; }
+  .layout--uwfivecol .layout__region--third {
+    grid-column: 3 / 4; }
+  .layout--uwfivecol .layout__region--fourth {
+    grid-column: 4 / 5; }
+  .layout--uwfivecol .layout__region--fifth {
+    grid-column: 5 / 6; }
 
 .layout--uwfourcol {
   display: grid; }
diff --git a/source/_patterns/03-layouts/layout/layout--fivecol/_layout--fivecol.scss b/source/_patterns/03-layouts/layout/layout--fivecol/_layout--fivecol.scss
index 216bc07fe65a0c245a69526f14c57d233ba2a166..753d0b10b3b3f1a8a0fd6f1d67b6f1eda779bada 100644
--- a/source/_patterns/03-layouts/layout/layout--fivecol/_layout--fivecol.scss
+++ b/source/_patterns/03-layouts/layout/layout--fivecol/_layout--fivecol.scss
@@ -1,25 +1,51 @@
-.layout--fivecol-section {
-  .layout-builder__region {
-    display: inline-block;
+.layout--uwfivecol {
+  display: grid;
+
+  &.even-split {
+    grid-template-columns: 20% 20% 20% 20% 20%;
+  }
+
+  &.larger-left {
+    grid-template-columns: 40% 15% 15% 15% 15%;
+  }
+
+  &.larger-second {
+    grid-template-columns: 15% 40% 15% 15% 15%;
+  }
+
+  &.larger-third {
+    grid-template-columns: 15% 15% 40% 15% 15%;
+  }
+
+  &.larger-fourth {
+    grid-template-columns: 15% 15% 15% 40% 15%;
+  }
+
+  &.larger-right {
+    grid-template-columns: 15% 15% 15% 15% 40%;
+  }
+
+  &.legacy-23-19-19-19-20 {
+    grid-template-columns: 23% 19% 19% 19% 20%;
   }
 
   .layout__region--first {
-    width: 23%;
+    grid-column: 1 / 2;
   }
 
   .layout__region--second {
-    width: 18%
+    grid-column: 2 / 3;
   }
 
   .layout__region--third {
-    width: 18%;
+    grid-column: 3 / 4;
   }
 
   .layout__region--fourth {
-    width: 18%;
+    grid-column: 4 / 5;
   }
 
   .layout__region--fifth {
-    width: 20%;
+    grid-column: 5 / 6;
   }
 }
\ No newline at end of file
diff --git a/source/_patterns/03-layouts/layout/layout--fivecol/layout--fivecol.twig b/source/_patterns/03-layouts/layout/layout--fivecol/layout--fivecol.twig
index 02734c65107c31e35585ddab542d9848cba8efe7..c36ba12ebc9c744a6a98e5678acfd888170f8b63 100644
--- a/source/_patterns/03-layouts/layout/layout--fivecol/layout--fivecol.twig
+++ b/source/_patterns/03-layouts/layout/layout--fivecol/layout--fivecol.twig
@@ -1,7 +1,7 @@
 {%
   set classes = [
   'layout',
-  'layout--uwfourcol',
+  'layout--uwfivecol',
   column_class,
 ]
 %}