From d16e70228b842140889163ab9cd4e415da419180 Mon Sep 17 00:00:00 2001
From: steven <sarmiento.steven@gmail.com>
Date: Tue, 27 Jul 2021 15:30:22 -0700
Subject: [PATCH] mobile responsive fixes and tightening up sections so they're
 closer

---
 components/ContentSectionRisks.tsx | 8 ++++----
 components/ContentSectionSale.tsx  | 6 +++---
 components/ModalSection.tsx        | 2 +-
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/components/ContentSectionRisks.tsx b/components/ContentSectionRisks.tsx
index e678b58..d48033e 100644
--- a/components/ContentSectionRisks.tsx
+++ b/components/ContentSectionRisks.tsx
@@ -3,8 +3,8 @@ const ContentSectionRisks = () => {
     <>
 {/* Section 3 */} 
       <div className="bg-bkg-2 transform -skew-y-3">
-        <div className="max-w-7xl mx-auto px-8 py-48 my-16 transform skew-y-3">
-            <div className="max-w-4xl mx-auto text-center pt-12 pb-16">
+        <div className="max-w-7xl mx-auto px-8 py-32 transform skew-y-3">
+            <div className="max-w-4xl mx-auto text-center pb-16">
                       <h2 className="mb-4 text-3xl md:text-4xl lg:text-4xl text-white font-bold font-heading">
                         Transparency builds trust
                       </h2>
@@ -16,7 +16,7 @@ const ContentSectionRisks = () => {
                   </div>
 
                   <div className="grid grid-cols-1 md:grid-cols-7 lg:grid-cols-7 grid-rows-2 gap-6 mb-16 mx-auto">
-                    <div className="col-span-1 md:col-span-3 lg:col-span-3 p-5 bg-bkg-3 border border-bkg-4 rounded-xl h-650 md:h-auto lg:h-auto w-auto z-10 shadow-md bg-risk-two md:bg-risk-one lg:bg-risk-one bg-contain bg-right-bottom bg-no-repeat">
+                    <div className="col-span-1 md:col-span-3 lg:col-span-3 p-5 bg-bkg-3 border border-bkg-4 rounded-xl h-auto w-auto z-10 shadow-md bg-risk-two md:bg-risk-one lg:bg-risk-one bg-contain bg-right-bottom bg-no-repeat">
                       <h3 className="text-white font-semibold text-xl tracking-wide my-2">
                       Unaudited smart contracts.  
                       </h3>
@@ -31,7 +31,7 @@ const ContentSectionRisks = () => {
                       </p>
                       </div>
                   </div>
-                  <div className="col-span-1 md:col-span-4 lg:col-span-4 row-span-2 p-5 bg-bkg-3 border border-bkg-4 rounded-xl h-650 md:h-auto lg:h-auto w-auto z-10 shadow-md bg-risk-three bg-contain bg-bottom bg-no-repeat">
+                  <div className="col-span-1 md:col-span-4 lg:col-span-4 row-span-2 p-5 bg-bkg-3 border border-bkg-4 rounded-xl h-auto w-auto z-10 shadow-md bg-risk-three bg-contain bg-bottom bg-no-repeat">
                       <h3 className="text-white font-semibold text-xl tracking-wide my-2">
                       New token sale mechanism 
                       </h3>
diff --git a/components/ContentSectionSale.tsx b/components/ContentSectionSale.tsx
index b188b04..99463a6 100644
--- a/components/ContentSectionSale.tsx
+++ b/components/ContentSectionSale.tsx
@@ -2,9 +2,9 @@ const ContentSectionSale = () => {
   return (
     <>
 {/* Section 2 */}                  
-<div className="pt-16 pb-16 mb-16 -mt-16 z-0">
+<div className="pb-16 mb-16 z-0">
       <div className="max-w-7xl mx-auto px-8 py-16">
-        <div className="max-w-4xl mb-24 mx-auto text-center mt-16 pt-16">
+        <div className="max-w-4xl mb-24 mx-auto text-center">
           <h2 className="mb-4 text-3xl md:text-4xl lg:text-4xl text-white font-bold font-heading">
             How the token sale works
           </h2>
@@ -108,7 +108,7 @@ const ContentSectionSale = () => {
               </div>
             </div>
             <div className="col-span-3 lg:col-span-2">
-              <div className="bg-bkg-3 border border-bkg-4 bg-feature-three bg-contain lg:bg-cover bg-bottom bg-no-repeat h-575 md:h-650 lg:h-650 w-full shadow-md rounded-xl overflow-hidden mx-auto">
+              <div className="bg-bkg-3 border border-bkg-4 bg-feature-three bg-contain lg:bg-cover bg-bottom bg-no-repeat h-650 w-full shadow-md rounded-xl overflow-hidden mx-auto">
                 <div className="py-4 px-8 mt-3">
                   <div className="flex flex-col mb-8">
                   <h2 className="text-white font-semibold text-xl tracking-wide mb-2">
diff --git a/components/ModalSection.tsx b/components/ModalSection.tsx
index 1f8a41f..4e1544d 100644
--- a/components/ModalSection.tsx
+++ b/components/ModalSection.tsx
@@ -4,7 +4,7 @@ import StatsModal from './StatsModal'
 const ModalSection = () => {
   return (
     <>
-      <div className="pt-48 pb-48 px-4">
+      <div className="pt-32 pb-48 px-4">
         <div className="max-w-5xl mx-auto text-center mb-12">
           <h2 className="mb-4 text-3xl md:text-4xl lg:text-4xl text-white font-bold font-heading">
             Ready to contribute?