111 update the light blue sections top and bottom padding (#117)

adriandelisle · web-flow · commit d78e1f2851ef · 2021-02-26T10:38:04.000-08:00
diff --git a/sections/logo-section/index.js b/sections/logo-section/index.js
@@ -10,9 +10,13 @@ import { TABLET_LARGE_SIZE, MOBILE_SIZE } from 'styles/constants'
 const { h2 } = Heading.VARIANT
 
 const StyledSection = styled.section`
-  padding: 80px 0;
+  padding: 140px 0;
   background: #e8edf4;
 
+  @media only screen and (max-width: ${TABLET_LARGE_SIZE}) {
+    padding: 80px 0;
+  }
+
   @media only screen and (max-width: ${MOBILE_SIZE}) {
     padding: 64px 0px;
   }
diff --git a/styles/Home.module.css b/styles/Home.module.css
@@ -233,7 +233,7 @@ a.heroLink {
 
 /* About styles */
 .about {
-  padding: 100px 0px;
+  padding: 140px 0px;
 }
 .about .flexSection {
   flex-direction: row;
@@ -255,6 +255,9 @@ a.heroLink {
 }
 
 @media only screen and (max-width: 1023px) {
+  .about {
+    padding: 120px 0px;
+  }
   .about .flexSection {
     flex-direction: column;
     align-items: center;
@@ -270,6 +273,9 @@ a.heroLink {
 }
 
 @media only screen and (max-width: 449px) {
+  .about {
+    padding: 84px 0px;
+  }
   .about .aboutDescription {
     font-size: 1rem;
     line-height: 1.625rem;
