From a01015d839a99bd092b0a4de3571a3bee3705cdb Mon Sep 17 00:00:00 2001
From: Mauricio Hernan Cabrera <mauriciohernancabrera@gmail.com>
Date: Thu, 3 Sep 2020 22:17:10 -0300
Subject: [PATCH 1/3] overflow responsive variants added

---
 src/utilities/layout.scss | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/utilities/layout.scss b/src/utilities/layout.scss
index 1b4da950f3..ae88877ab2 100644
--- a/src/utilities/layout.scss
+++ b/src/utilities/layout.scss
@@ -35,10 +35,14 @@
 .v-align-baseline    { vertical-align: baseline !important; }
 
 // Overflow utilities
-@each $overflow in (visible, hidden, auto, scroll) {
-  .overflow-#{$overflow} { overflow: $overflow !important; }
-  .overflow-x-#{$overflow} { overflow-x: $overflow !important; }
-  .overflow-y-#{$overflow} { overflow-y: $overflow !important; }
+@each $breakpoint, $variant in $responsive-variants {
+  @include breakpoint($breakpoint) {
+    @each $overflow in (visible, hidden, auto, scroll) {
+      .overflow#{$variant}-#{$overflow}   { overflow: $overflow !important; }
+      .overflow#{$variant}-x-#{$overflow} { overflow-x: $overflow !important; }
+      .overflow#{$variant}-y-#{$overflow} { overflow-y: $overflow !important; }
+    }
+  }
 }
 
 // Clear floats

From 658862d6a8da9eaf4c089fb92d8f5b3de98f396d Mon Sep 17 00:00:00 2001
From: Mauricio Hernan Cabrera <mauriciohernancabrera@gmail.com>
Date: Thu, 3 Sep 2020 22:23:34 -0300
Subject: [PATCH 2/3] doc added

---
 docs/content/utilities/layout.md | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/docs/content/utilities/layout.md b/docs/content/utilities/layout.md
index 6035a51993..a7bcde854d 100644
--- a/docs/content/utilities/layout.md
+++ b/docs/content/utilities/layout.md
@@ -118,6 +118,11 @@ Overflow utilities can also target x- and y-axes independently via:
 * `.overflow-y-scroll`
 * `.overflow-y-visible`
 
+### Overflow floats
+Overflow utilities can be applied or changed per [breakpoint](/objects/grid#breakpoints). 
+
+Each responsive overflow utility is applied to the specified breakpoint and up, using the following formula:  `overflow-[breakpoint]-[axis]-[property]`. For example: `overflow-x-scroll` or `overflow-md-x-visible`.
+
 ## Floats
 Use `.float-left` and `.float-right` to set floats, and `.clearfix` to clear.
 ```html live

From b56d46b5a7906342858643571c24fa92092f3809 Mon Sep 17 00:00:00 2001
From: Mauricio Hernan Cabrera <mauriciohernancabrera@gmail.com>
Date: Fri, 4 Sep 2020 21:30:14 -0300
Subject: [PATCH 3/3] Update docs/content/utilities/layout.md

Co-authored-by: simurai <simulus@gmail.com>
---
 docs/content/utilities/layout.md | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/docs/content/utilities/layout.md b/docs/content/utilities/layout.md
index a7bcde854d..a07c36be1f 100644
--- a/docs/content/utilities/layout.md
+++ b/docs/content/utilities/layout.md
@@ -118,10 +118,7 @@ Overflow utilities can also target x- and y-axes independently via:
 * `.overflow-y-scroll`
 * `.overflow-y-visible`
 
-### Overflow floats
-Overflow utilities can be applied or changed per [breakpoint](/objects/grid#breakpoints). 
-
-Each responsive overflow utility is applied to the specified breakpoint and up, using the following formula:  `overflow-[breakpoint]-[axis]-[property]`. For example: `overflow-x-scroll` or `overflow-md-x-visible`.
+Overflow utilities can be applied or changed per [breakpoint](/objects/grid#breakpoints). Each **responsive** overflow utility is applied to the specified breakpoint and up, using the following formula:  `overflow-[breakpoint]-[axis]-[property]`. For example: `overflow-x-scroll` or `overflow-md-x-visible`.
 
 ## Floats
 Use `.float-left` and `.float-right` to set floats, and `.clearfix` to clear.