phone design in progress

Author: anastascho

src/css/footer.css

@@ -63,10 +63,20 @@ footer.footer {
   font-size: 1rem;
 }
 
-@media screen and (max-width: 800px) {
+@media screen and (max-width: 768px) {
   .sections-footer {
-    font-size: 0.5rem;
     line-height: unset;
     padding: 1rem;
+    /* max-width: 80%; */
   }
+
+  .sections-footer-container {
+    flex-direction: column-reverse;
+    gap: 0.25rem;
+    align-items: center;
+  }
+
+  /* .sections-footer-container-left {
+    max-width: 80%;
+  } */
 }

src/css/sections.css

@@ -302,30 +302,47 @@
     display: none;
   }
 
-  .sectionWhite-heading-blue > p {
+  /* .sectionWhite-heading-blue > p {
     font-size: 1.25rem;
   }
 
   .get-started-button {
     padding: 0.5rem 2rem;
     font-size: 0.5rem;
-  }
+  } */
 }
 
-@media screen and (max-width: 640px) {
-  .tile {
-    width: 100%;
+@media screen and (max-width: 768px) {
+  .sections-page .sectionbody {
+    /* max-width: 80% !important; */
+    text-align: center;
+  }
+
+  .sectionbody .tile {
+    width: 80%;
+    margin: 0 auto;
+    padding: 2rem;
+  }
+
+  .sectionbody .sectionTitle {
+    position: relative;
+    margin: 0 auto;
   }
 
   .sectionWhite-heading-blue > p {
-    font-size: 1rem;
+    font-size: 1.75rem;
   }
 
   .sectionbody .sectionWhite .content {
     flex-direction: column;
   }
 
+  .sectionbody .sectionBlue .content,
+  .sectionbody .sectionPurple .content {
+    grid-gap: unset;
+  }
+
   .sectionWhite-heading {
-    font-size: 1.5rem;
+    font-size: 1.75rem;
   }
 }