From 965296bea6370339d1f894d669fa53abcaaa5224 Mon Sep 17 00:00:00 2001
From: rayelliott <gitea@rayelliott.dev>
Date: Tue, 31 Mar 2020 17:33:56 +0000
Subject: [PATCH] add .l-section-header style

---
 src/css/imports/layout.scss | 54 ++++++++++++++++++++++++++++++++-----
 1 file changed, 48 insertions(+), 6 deletions(-)

diff --git a/src/css/imports/layout.scss b/src/css/imports/layout.scss
index b295382..e75c0fd 100644
--- a/src/css/imports/layout.scss
+++ b/src/css/imports/layout.scss
@@ -3,21 +3,47 @@
   max-width: 70rem;
   margin-left: auto;
   margin-right: auto;
-}
 
-.l-section-pad {
-  padding: 24px 8px;
+  padding-left: 8px;
+  padding-right: 8px;
 
   @media (min-width: $bp-s) {
-    padding: 32px;
+    padding-left: 32px;
+    padding-right: 32px;
   }
 
   @media (min-width: $bp-m) {
-    padding: 64px;
+    padding-left: 64px;
+    padding-right: 64px;
   }
 
   @media (min-width: $bp-l) {
-    padding: 96px 0;
+    padding-left: 96px;
+    padding-right: 96px;
+  }
+
+  &--wide {
+    max-width: 110rem;
+  }
+}
+
+.l-section-pad {
+  padding-top: 24px;
+  padding-bottom: 24px;
+
+  @media (min-width: $bp-s) {
+    padding-top: 32px;
+    padding-bottom: 32px;
+  }
+
+  @media (min-width: $bp-m) {
+    padding-top: 64px;
+    padding-bottom: 64px;
+  }
+
+  @media (min-width: $bp-l) {
+    padding-top: 96px;
+    padding-bottom: 96px;
   }
 
   // reduce padding bottom
@@ -30,6 +56,13 @@
   }
 }
 
+.l-section-header {
+  font-size: 2.875rem;
+  line-height: 1.2;
+  text-align: center;
+  margin-bottom: 3.75rem;
+}
+
 // #position
 
 .l-absolute {
@@ -88,6 +121,15 @@
   flex-wrap: wrap;
 }
 
+.l-flex-list-col {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  padding-left: 0;
+  list-style: none;
+  margin: 0;
+}
+
 .l-flex-list-row {
   display: flex;
   flex-direction: row;