Responsive patron grid

bcnfs · Apr 26, 2021 · 99629fa · 99629fa
1 parent c021159
commit 99629fa
Showing 1 changed file with 15 additions and 6 deletions.
diff --git a/_sass/_front.scss b/_sass/_front.scss
@@ -40,13 +40,12 @@ a:active {
     margin-bottom: 30px;
 }
 .patrons {
-    margin-bottom: 40px;
+    display: grid;
+    grid-template-columns: 1fr;
+    grid-row-gap: 2rem;
 }
 .patronLogo {
-    padding-left: 15px;
-    padding-right: 15px;
-    max-width: 20%;
-    max-height: 7em;
+    max-height: 9rem;
 }
 .closingText {
     font-size: 22px;
@@ -71,6 +70,16 @@ a:active {
     background: rgb(255, 255, 165);
 }
 
+
+@media screen and (min-width: $screen-md-min) {
+    .patrons {
+        margin: 0 auto;
+        margin-bottom: 4rem;
+        grid-template-columns: repeat(4, 1fr);
+        max-width: 800px;
+    }
+}
+
 @media screen and (min-width: $screen-lg-min) {
     .container {
         width: 970px;
@@ -84,4 +93,4 @@ a:active {
     .logoImg {
         margin-bottom: 0;
     }
-}
+}