diff --git a/themes/wporg-5ftf/css/style-editor.css b/themes/wporg-5ftf/css/style-editor.css
index 64010e8..7c6d925 100644
--- a/themes/wporg-5ftf/css/style-editor.css
+++ b/themes/wporg-5ftf/css/style-editor.css
@@ -446,52 +446,41 @@ input.download-button.button-hero:active[type="submit"],
   background-color: #FFFFFF;
 }
 
-.parallelogram-container {
-  width: 80%;
-  margin-left: 10%;
-  margin-right: 10%;
-}
-
-@media screen and (min-width: 768px) {
-  .parallelogram-container > .wp-block-group__inner-container {
-    display: flex;
-  }
-}
-
-.parallelogram-container .wp-block-group__inner-container .is-style-wporg-parallelogram:last-child .wp-block-group__inner-container {
-  /*
-		 * Adjust for the overlapping parralelograms, so that the text in this one appears to be more aligned to
-		 * its container.
-		 */
-  position: relative;
-  left: 10px;
-}
-
-/*
- * Not just doing `@extend .parallelogram` b/c want to split between breakpoints, which that doesn't do.
- */
-.is-style-wporg-parallelogram {
+.is-style-wporg-parallelogram .wp-block-column {
+  background: black;
   color: #fff;
-  margin: 0 auto;
+  margin: 0;
   opacity: 0.9;
-  padding: 4.7rem 0;
+  padding: 4.7rem 3rem;
   text-align: center;
+  mix-blend-mode: multiply;
+}
+
+.is-style-wporg-parallelogram .wp-block-column:nth-of-type(2n+1) {
+  background: #1E8CBE;
+}
+
+.is-style-wporg-parallelogram .wp-block-column:nth-of-type(2n) {
+  background: #826EB4;
 }
 
 @media screen and (min-width: 768px) {
-  .is-style-wporg-parallelogram {
+  .is-style-wporg-parallelogram .wp-block-column {
     transform: skew(-15deg);
   }
-  .is-style-wporg-parallelogram:first-child {
+  .is-style-wporg-parallelogram .wp-block-column:first-child {
     position: relative;
     top: 40px;
+    left: 30px;
     z-index: 2;
   }
-  .is-style-wporg-parallelogram:last-child {
+  .is-style-wporg-parallelogram .wp-block-column:last-child {
+    position: relative;
     z-index: 1;
-    padding-left: 40px;
+    right: 30px;
+    padding-left: 4rem;
   }
-  .is-style-wporg-parallelogram:before {
+  .is-style-wporg-parallelogram .wp-block-column:before {
     font-size: ms(12);
     height: 64px;
     position: relative;
@@ -499,12 +488,27 @@ input.download-button.button-hero:active[type="submit"],
     transform: skew(15deg);
     width: 64px;
   }
-  .is-style-wporg-parallelogram > * {
+  .is-style-wporg-parallelogram .wp-block-column > * {
     transform: skew(15deg);
   }
-  .is-style-wporg-parallelogram > .wp-block-group__inner-container {
-    width: 60%;
-    margin: 0 auto;
+}
+
+@media screen and (min-width: 600px) and (max-width: 767px) {
+  .is-style-wporg-parallelogram .wp-block-column {
+    padding: 3rem 2rem;
+    flex-basis: calc(50% + 0.5rem);
+  }
+  .is-style-wporg-parallelogram .wp-block-column:nth-of-type(n+2) {
+    margin-left: -1rem;
+  }
+}
+
+@media screen and (max-width: 599px) {
+  .is-style-wporg-parallelogram .wp-block-column {
+    padding: 2rem;
+  }
+  .is-style-wporg-parallelogram .wp-block-column:nth-of-type(n+2) {
+    margin-top: -1rem;
   }
 }
 
@@ -539,4 +543,21 @@ p.is-style-wporg-tldr {
   }
 }
 
+@media screen and (min-width: 768px) {
+  .block-editor-block-list__block-edit .is-style-wporg-parallelogram .wp-block-column {
+    transform: skew(0);
+  }
+  .block-editor-block-list__block-edit .is-style-wporg-parallelogram .wp-block-column:last-child {
+    position: static;
+    z-index: auto;
+    top: auto;
+    left: auto;
+    right: auto;
+    padding-left: 0;
+  }
+  .block-editor-block-list__block-edit .is-style-wporg-parallelogram .wp-block-column > * {
+    transform: skew(0);
+  }
+}
+
 /*# sourceMappingURL=style-editor.css.map */
\ No newline at end of file
diff --git a/themes/wporg-5ftf/css/style-editor.scss b/themes/wporg-5ftf/css/style-editor.scss
index b02c43a..9ff208e 100644
--- a/themes/wporg-5ftf/css/style-editor.scss
+++ b/themes/wporg-5ftf/css/style-editor.scss
@@ -3,7 +3,6 @@
  * appear on the front end.
  */
 
-
 @import "settings/colors";
 @import "../../pub/wporg/css/settings/structure";
 @import "settings/structure";
@@ -15,7 +14,29 @@
 @import "objects/pullquote";
 @import "utilities/utilities";
 
+// Un-parallelogram the columns in the editor– `skew` doesn't play well with the nesting of editor components.
+.block-editor-block-list__block-edit {
+	.is-style-wporg-parallelogram {
+		.wp-block-column {
+			@include breakpoint( $breakpoint-tablet ) {
+				transform: skew(0);
 
+				&:last-child {
+					position: static;
+					z-index: auto;
+					top: auto;
+					left: auto;
+					right: auto;
+					padding-left: 0;
+				}
+
+				> * {
+					transform: skew(0);
+				}
+			}
+		}
+	}
+}
 
 
 // font-family and face, etc?
\ No newline at end of file