diff --git a/components/ContentSection.tsx b/components/ContentSection.tsx
index a9028a8..6c5ab1e 100644
--- a/components/ContentSection.tsx
+++ b/components/ContentSection.tsx
@@ -18,65 +18,62 @@ const ContentSection = () => {
 
         {/* Section 1 */}
 
-    <div className="py-16 xl:py-36 px-4 sm:px-6 lg:px-8 overflow-hidden">
-      <div className="max-w-max lg:max-w-7xl mx-auto">
-        <div className="relative">
-          <div className="relative md:p-6">
-            <div className="lg:grid lg:grid-cols-2 lg:gap-6">
-              <div className="lg:max-w-none">
-                <h2 className="text-3xl mb-6 leading-tight font-semibold font-heading">
-                  What is Mango?
-                </h2>
-                <p className="mb-8 text-lg text-white text-opacity-50 leading-relaxed">
-                  Mango is a decentralized autonomous organization. Its purpose is
-                  to contribute maximum value for the defi ecosystem and its
-                  developer community to create commercially viable decentralized
-                  trading and lending products for traders.
-                </p>
+        <div className="py-16 xl:py-36 px-4 sm:px-6 lg:px-8 overflow-hidden">
+          <div className="max-w-max lg:max-w-7xl mx-auto">
+            <div className="relative">
+              <div className="relative md:p-6">
+                <div className="lg:grid lg:grid-cols-2 lg:gap-6">
+                  <div className="lg:max-w-none">
+                    <h2 className="text-3xl mb-6 leading-tight font-semibold font-heading">
+                      What is Mango?
+                    </h2>
+                    <p className="mb-8 text-lg text-white text-opacity-50 leading-relaxed">
+                      Mango is a decentralized autonomous organization. Its
+                      purpose is to contribute maximum value for the defi
+                      ecosystem and its developer community to create
+                      commercially viable decentralized trading and lending
+                      products for traders.
+                    </p>
 
-                <h2 className="text-3xl mb-6 leading-tight font-semibold font-heading">
-                  Why the{' '}
-                  <GradientText>
-                  Insurance fund
-                  </GradientText>
-                  ?
-                </h2>
-                <p className="mb-8 text-lg text-white text-opacity-50 leading-relaxed">
-                  Mango protocol is powered by lenders providing their capital for
-                  the community to use for trading and borrowing purposes. The
-                  insurance fund is the last line of defense for protecting our
-                  mango lenders.
-                </p>
-              </div>
+                    <h2 className="text-3xl mb-6 leading-tight font-semibold font-heading">
+                      Why the <GradientText>Insurance fund</GradientText>?
+                    </h2>
+                    <p className="mb-8 text-lg text-white text-opacity-50 leading-relaxed">
+                      Mango protocol is powered by lenders providing their
+                      capital for the community to use for trading and borrowing
+                      purposes. The insurance fund is the last line of defense
+                      for protecting our mango lenders.
+                    </p>
+                  </div>
 
-              <div className="mt-6 lg:mt-0">
-              <h2 className="text-3xl mb-6 leading-tight font-semibold font-heading">
-                What is the{' '}
-                <GradientText>$MNGO</GradientText>{' '}
-                token?
-              </h2>
-                <p className="mb-8 text-lg text-white text-opacity-50 leading-relaxed">
-                  We believe that substantial rewards to a strong developer
-                  community and liquidity incentives are the essential drivers for
-                  growth and therefore the foundation of the Mango DAO.
-                </p>
-                <p className="mb-8 text-lg text-white text-opacity-50 leading-relaxed">
-                  Mango Governance tokens ($MNGO) will serve as the incentive for
-                  those who can proove their work is useful to the DAO.
-                </p>
-                <Button>Check out the whitepaper</Button>
+                  <div className="mt-6 lg:mt-0">
+                    <h2 className="text-3xl mb-6 leading-tight font-semibold font-heading">
+                      What is the <GradientText>$MNGO</GradientText> token?
+                    </h2>
+                    <p className="mb-8 text-lg text-white text-opacity-50 leading-relaxed">
+                      We believe that substantial rewards to a strong developer
+                      community and liquidity incentives are the essential
+                      drivers for growth and therefore the foundation of the
+                      Mango DAO.
+                    </p>
+                    <p className="mb-8 text-lg text-white text-opacity-50 leading-relaxed">
+                      Mango Governance tokens ($MNGO) will serve as the
+                      incentive for those who can proove their work is useful to
+                      the DAO.
+                    </p>
+                    <Button>Check out the whitepaper</Button>
 
-                <p className="text-white leading-relaxed py-4">
-                  <span className="text-mango-yellow">$MNGO</span> were only provided
-                  to developers who helped to build out the protocol.
-                </p>
+                    <p className="text-white leading-relaxed py-4">
+                      <span className="text-mango-yellow">$MNGO</span> were only
+                      provided to developers who helped to build out the
+                      protocol.
+                    </p>
+                  </div>
+                </div>
               </div>
             </div>
           </div>
         </div>
-      </div>
-    </div>
-
 
         {/* Section 2 */}
         <div className="max-w-4xl mb-12 mx-auto text-center">
@@ -120,10 +117,7 @@ const ContentSection = () => {
                         Unrestricted
                       </span>{' '}
                       and{' '}
-                      <span className="text-mango-red italic">
-                        Restricted
-                      </span>
-                      .
+                      <span className="text-mango-red italic">Restricted</span>.
                     </p>
                     <div className="flex flex-wrap overflow-hiddenm mt-8">
                       <div className="w-full overflow-hidden lg:w-1/2 pr-4">
diff --git a/components/ContributionModal.tsx b/components/ContributionModal.tsx
index 34527f1..7cbea37 100644
--- a/components/ContributionModal.tsx
+++ b/components/ContributionModal.tsx
@@ -150,192 +150,191 @@ const ContributionModal = () => {
 
   return (
     <>
-    <div className="flex flex-wrap lg:flex-row justify-center">
+      <div className="flex flex-wrap lg:flex-row justify-center">
+        <div className="flex flex-col max-w-3xl bg-bkg-2 border border-bkg-3 p-7 rounded-lg shadow-md">
+          <div className="pb-4 text-center">
+            {!submitted && !submitting && !editContribution ? (
+              <>
+                <h2>This time has arrived.</h2>
+                <p>When ready, depost your USDC</p>
+              </>
+            ) : null}
 
-    <div className="flex flex-col max-w-3xl bg-bkg-2 border border-bkg-3 p-7 rounded-lg shadow-md">
-        <div className="pb-4 text-center">
-          {!submitted && !submitting && !editContribution ? (
-            <>
-              <h2>This time has arrived.</h2>
-              <p>When ready, depost your USDC</p>
-            </>
-          ) : null}
+            {!submitted && submitting ? (
+              <>
+                <h2>Approve the transaction</h2>
+                <p>Almost there...</p>
+              </>
+            ) : null}
 
-          {!submitted && submitting ? (
-            <>
-              <h2>Approve the transaction</h2>
-              <p>Almost there...</p>
-            </>
-          ) : null}
+            {submitted && !submitting ? (
+              <>
+                <h2>Your contribution amount</h2>
+                <p>Thanks for contributing...</p>
+              </>
+            ) : null}
 
-          {submitted && !submitting ? (
-            <>
-              <h2>Your contribution amount</h2>
-              <p>Thanks for contributing...</p>
-            </>
-          ) : null}
-
-          {editContribution && !submitting ? (
-            <>
-              <h2>Funds unlocked</h2>
-              <p>Increase or reduce your contribution...</p>
-            </>
-          ) : null}
-        </div>
-        {submitting ? (
-          <div className="flex h-64 items-center justify-center">
-            <Loading className="h-6 w-6 mb-3 text-primary-light" />
+            {editContribution && !submitting ? (
+              <>
+                <h2>Funds unlocked</h2>
+                <p>Increase or reduce your contribution...</p>
+              </>
+            ) : null}
           </div>
-        ) : (
-          <>
-            <div
-              className={`${
-                connected ? 'opacity-100' : 'opacity-30'
-              } pb-6 transiton-all duration-1000 w-full`}
-            >
-              <div className="flex justify-between pb-2">
-                <div className="flex items-center text-xs text-fgd-4">
-                  <WalletIcon className="w-4 h-4 mr-1 text-fgd-3 fill-current" />
-                  {connected ? (
-                    loading ? (
-                      <div className="bg-bkg-4 rounded w-10 h-4 animate-pulse" />
-                    ) : (
-                      <span className="font-display text-fgd-1 ml-1">
-                        {walletAmount}
-                      </span>
-                    )
-                  ) : (
-                    '----'
-                  )}
-                  <img
-                    alt=""
-                    width="16"
-                    height="16"
-                    src="/icons/usdc.svg"
-                    className={`ml-1`}
-                  />
-                </div>
-                <div className="flex">
-                  {submitted ? (
-                    <SmallButton
-                      className="ring-1 ring-secondary-1-light ring-inset hover:ring-secondary-1-dark hover:bg-transparent hover:text-secondary-1-dark font-normal rounded text-secondary-1-light text-xs py-0.5 px-1.5 mr-2"
-                      disabled={!connected}
-                      onClick={() => handleEditContribution()}
-                    >
-                      Unlock
-                    </SmallButton>
-                  ) : null}
-                  <SmallButton
-                    className={`${
-                      disableFormInputs && 'opacity-30'
-                    } bg-bkg-4 hover:bg-bkg-3 font-normal rounded text-fgd-3 text-xs py-0.5 px-1.5`}
-                    disabled={disableFormInputs}
-                    onClick={() => handleMax()}
-                  >
-                    Max
-                  </SmallButton>
-                </div>
-              </div>
-              <div className="flex items-center pb-4 relative">
-                {submitted ? (
-                  <LockClosedIcon className="absolute text-secondary-2-light h-4 w-4 mb-0.5 left-2 z-10" />
-                ) : null}
-                {editContribution ? (
-                  <LockOpenIcon className="absolute text-secondary-1-light h-4 w-4 mb-0.5 left-2 z-10" />
-                ) : null}
-                <Input
-                  className={(submitted || editContribution) && 'pl-7'}
-                  disabled={disableFormInputs}
-                  type="text"
-                  onChange={(e) => onChangeAmountInput(e.target.value)}
-                  value={loading ? '' : contributionAmount}
-                  suffix="USDC"
-                />
-              </div>
+          {submitting ? (
+            <div className="flex h-64 items-center justify-center">
+              <Loading className="h-6 w-6 mb-3 text-primary-light" />
+            </div>
+          ) : (
+            <>
               <div
                 className={`${
-                  !submitted ? 'opacity-100' : 'opacity-30'
-                } transiton-all duration-1000`}
+                  connected ? 'opacity-100' : 'opacity-30'
+                } pb-6 transiton-all duration-1000 w-full`}
               >
-                <div className="pb-12">
-                  <Slider
+                <div className="flex justify-between pb-2">
+                  <div className="flex items-center text-xs text-fgd-4">
+                    <WalletIcon className="w-4 h-4 mr-1 text-fgd-3 fill-current" />
+                    {connected ? (
+                      loading ? (
+                        <div className="bg-bkg-4 rounded w-10 h-4 animate-pulse" />
+                      ) : (
+                        <span className="font-display text-fgd-1 ml-1">
+                          {walletAmount}
+                        </span>
+                      )
+                    ) : (
+                      '----'
+                    )}
+                    <img
+                      alt=""
+                      width="16"
+                      height="16"
+                      src="/icons/usdc.svg"
+                      className={`ml-1`}
+                    />
+                  </div>
+                  <div className="flex">
+                    {submitted ? (
+                      <SmallButton
+                        className="ring-1 ring-secondary-1-light ring-inset hover:ring-secondary-1-dark hover:bg-transparent hover:text-secondary-1-dark font-normal rounded text-secondary-1-light text-xs py-0.5 px-1.5 mr-2"
+                        disabled={!connected}
+                        onClick={() => handleEditContribution()}
+                      >
+                        Unlock
+                      </SmallButton>
+                    ) : null}
+                    <SmallButton
+                      className={`${
+                        disableFormInputs && 'opacity-30'
+                      } bg-bkg-4 hover:bg-bkg-3 font-normal rounded text-fgd-3 text-xs py-0.5 px-1.5`}
+                      disabled={disableFormInputs}
+                      onClick={() => handleMax()}
+                    >
+                      Max
+                    </SmallButton>
+                  </div>
+                </div>
+                <div className="flex items-center pb-4 relative">
+                  {submitted ? (
+                    <LockClosedIcon className="absolute text-secondary-2-light h-4 w-4 mb-0.5 left-2 z-10" />
+                  ) : null}
+                  {editContribution ? (
+                    <LockOpenIcon className="absolute text-secondary-1-light h-4 w-4 mb-0.5 left-2 z-10" />
+                  ) : null}
+                  <Input
+                    className={(submitted || editContribution) && 'pl-7'}
                     disabled={disableFormInputs}
-                    value={(100 * contributionAmount) / totalBalance}
-                    onChange={(v) => onChangeSlider(v)}
-                    step={1}
-                    maxButtonTransition={maxButtonTransition}
+                    type="text"
+                    onChange={(e) => onChangeAmountInput(e.target.value)}
+                    value={loading ? '' : contributionAmount}
+                    suffix="USDC"
                   />
                 </div>
-                <div className="h-12 pb-4">
-                  {errorMessage && (
-                    <div className="flex items-center pt-1.5 text-secondary-2-light">
-                      <ExclamationCircleIcon className="h-4 w-4 mr-1.5" />
-                      {errorMessage}
-                    </div>
-                  )}
-                </div>
-                <Button
-                  onClick={() => handleSetContribution()}
-                  className="w-full py-2.5"
-                  disabled={disableSubmit}
+                <div
+                  className={`${
+                    !submitted ? 'opacity-100' : 'opacity-30'
+                  } transiton-all duration-1000`}
                 >
-                  <div className={`flex items-center justify-center`}>
-                    {dontAddMore
-                      ? 'Sorry you can’t add anymore 🥲'
-                      : 'Set Contribution'}
+                  <div className="pb-12">
+                    <Slider
+                      disabled={disableFormInputs}
+                      value={(100 * contributionAmount) / totalBalance}
+                      onChange={(v) => onChangeSlider(v)}
+                      step={1}
+                      maxButtonTransition={maxButtonTransition}
+                    />
                   </div>
-                </Button>
+                  <div className="h-12 pb-4">
+                    {errorMessage && (
+                      <div className="flex items-center pt-1.5 text-secondary-2-light">
+                        <ExclamationCircleIcon className="h-4 w-4 mr-1.5" />
+                        {errorMessage}
+                      </div>
+                    )}
+                  </div>
+                  <Button
+                    onClick={() => handleSetContribution()}
+                    className="w-full py-2.5"
+                    disabled={disableSubmit}
+                  >
+                    <div className={`flex items-center justify-center`}>
+                      {dontAddMore
+                        ? 'Sorry you can’t add anymore 🥲'
+                        : 'Set Contribution'}
+                    </div>
+                  </Button>
+                </div>
+              </div>
+              <div className="flex items-center justify-center">
+                <ConnectWalletButton onClick={handleConnectDisconnect} />
+              </div>
+            </>
+          )}
+        </div>
+
+        <div className="flex flex-col m-3 bg-gradient-to-br from-secondary-4-dark to-secondary-4-light border border-bkg-3 p-7 rounded-lg shadow-md">
+          <div className="border-b border-bkg-4 pb-4 text-center">
+            <p className="text-fgd-3">Estimated Token Price</p>
+            <div className="flex items-center justify-center pt-0.5">
+              <img
+                alt=""
+                width="20"
+                height="20"
+                src="/icons/usdc.svg"
+                className={`mr-2`}
+              />
+              <div className="font-bold text-fgd-1 text-xl">
+                {priceFormat.format(vaults.estimatedPrice)}
               </div>
             </div>
-            <div className="flex items-center justify-center">
-              <ConnectWalletButton onClick={handleConnectDisconnect} />
-            </div>
-          </>
-        )}
-      </div>
-
-      <div className="flex flex-col m-3 bg-gradient-to-br from-secondary-4-dark to-secondary-4-light border border-bkg-3 p-7 rounded-lg shadow-md">
-        <div className="border-b border-bkg-4 pb-4 text-center">
-          <p className="text-fgd-3">Estimated Token Price</p>
-          <div className="flex items-center justify-center pt-0.5">
-            <img
-              alt=""
-              width="20"
-              height="20"
-              src="/icons/usdc.svg"
-              className={`mr-2`}
-            />
-            <div className="font-bold text-fgd-1 text-xl">
-              {priceFormat.format(vaults.estimatedPrice)}
+          </div>
+          <div className="border-b border-bkg-4 py-4 text-center">
+            <p className="text-fgd-3">Total USDC Deposited</p>
+            <div className="flex items-center justify-center pt-0.5">
+              <div className="font-bold text-fgd-1 text-base">
+                {vaults.usdcBalance}
+              </div>
             </div>
           </div>
-        </div>
-        <div className="border-b border-bkg-4 py-4 text-center">
-          <p className="text-fgd-3">Total USDC Deposited</p>
-          <div className="flex items-center justify-center pt-0.5">
-            <div className="font-bold text-fgd-1 text-base">
-              {vaults.usdcBalance}
+          <div className="border-b border-bkg-4 py-4 text-center">
+            <p className="text-fgd-3">Locked MNGO in Pool</p>
+            <div className="flex items-center justify-center pt-0.5">
+              <img className="h-5 mr-2 w-auto" src="/logo.svg" alt="mango" />
+              <div className="font-bold text-fgd-1 text-base">
+                {vaults.mangoBalance}
+              </div>
             </div>
           </div>
-        </div>
-        <div className="border-b border-bkg-4 py-4 text-center">
-          <p className="text-fgd-3">Locked MNGO in Pool</p>
-          <div className="flex items-center justify-center pt-0.5">
-            <img className="h-5 mr-2 w-auto" src="/logo.svg" alt="mango" />
-            <div className="font-bold text-fgd-1 text-base">
-              {vaults.mangoBalance}
-            </div>
+          <div className="border-b border-bkg-4 py-4 text-center">
+            <p className="text-fgd-3">Deposits Close</p>
+            <PoolCountdown date={endDeposits} className="justify-center pt-1" />
           </div>
-        </div>
-        <div className="border-b border-bkg-4 py-4 text-center">
-          <p className="text-fgd-3">Deposits Close</p>
-          <PoolCountdown date={endDeposits} className="justify-center pt-1" />
-        </div>
-        <div className="pt-4 text-center">
-          <p className="text-fgd-3">Withdrawals Close</p>
-          <PoolCountdown date={endIdo} className="justify-center pt-1" />
-        </div>
-        {/* <p>
+          <div className="pt-4 text-center">
+            <p className="text-fgd-3">Withdrawals Close</p>
+            <PoolCountdown date={endIdo} className="justify-center pt-1" />
+          </div>
+          {/* <p>
           Start: {startIdo?.fromNow()} ({startIdo?.format()})
         </p>
         <p>
@@ -346,9 +345,8 @@ const ContributionModal = () => {
         </p>
         <p>Current USDC in Pool: {vaults.usdc?.balance || 'N/A'}</p>
         <p>Locked MNGO in Pool: {vaults.mango?.balance || 'N/A'}</p> */}
+        </div>
       </div>
-
-    </div>
     </>
   )
 }
diff --git a/components/ModalSection.tsx b/components/ModalSection.tsx
index 9d7571c..88468c1 100644
--- a/components/ModalSection.tsx
+++ b/components/ModalSection.tsx
@@ -1,20 +1,20 @@
-import ContributionModal from "./ContributionModal"
+import ContributionModal from './ContributionModal'
 
 const ModalSection = () => {
   return (
-        <>
-        <div className="max-w-5xl mx-auto text-center">
-          <h2 className="mb-8 text-4xl lg:text-5xl text-white font-bold font-heading">
-            It is still the early days.
-          </h2>
-          <p className="mb-8 text-2xl text-white text-opacity-50">
-            This is the first moment for non-developers to participate in
-            helping build the Mango protocol by supporting the inception of the
-            protocols Insurance Fund.
-          </p>
-        </div>
-        <ContributionModal />
-        </>
+    <>
+      <div className="max-w-5xl mx-auto text-center">
+        <h2 className="mb-8 text-4xl lg:text-5xl text-white font-bold font-heading">
+          It is still the early days.
+        </h2>
+        <p className="mb-8 text-2xl text-white text-opacity-50">
+          This is the first moment for non-developers to participate in helping
+          build the Mango protocol by supporting the inception of the protocols
+          Insurance Fund.
+        </p>
+      </div>
+      <ContributionModal />
+    </>
   )
 }
 
diff --git a/components/PoolCountdown.tsx b/components/PoolCountdown.tsx
index b426bbe..0faf029 100644
--- a/components/PoolCountdown.tsx
+++ b/components/PoolCountdown.tsx
@@ -15,9 +15,7 @@ const PoolCountdown = (props: { className?: string; date: moment.Moment }) => {
       return <p className="text-mango-red">{message}</p>
     } else {
       return (
-        <div
-          className={`${props.className} font-bold text-white flex `}
-        >
+        <div className={`${props.className} font-bold text-white flex `}>
           <ClockIcon className="w-10 h-10 mr-2" />
           <span className="text-3xl">
             {/* <span className="bg-bkg-1 border border-bkg-4 mx-0.5 px-1.5 py-1 rounded"> */}
diff --git a/components/PoolInfoCards.tsx b/components/PoolInfoCards.tsx
index dc6de04..748112f 100644
--- a/components/PoolInfoCards.tsx
+++ b/components/PoolInfoCards.tsx
@@ -25,13 +25,13 @@ const PoolInfoCards = () => {
   return (
     <div className="max-w-3xl flex flex-col mx-auto px-6 mb-16 z-10">
       <div className="flex flex-col lg:flex-row">
-      <Card title="Deposits closing in">
-        <PoolCountdown date={endDeposits} />
-      </Card>
+        <Card title="Deposits closing in">
+          <PoolCountdown date={endDeposits} />
+        </Card>
 
-      <Card title="Sale event ends in">
-        <PoolCountdown date={endIdo} />
-      </Card>
+        <Card title="Sale event ends in">
+          <PoolCountdown date={endIdo} />
+        </Card>
       </div>
       <Card title="Total contributions">
         <div className="flex">
@@ -48,30 +48,30 @@ const PoolInfoCards = () => {
         </div>
       </Card>
       <div className="flex flex-wrap">
-      <Card title="Total $MNGO for sale">
-        <div className="flex">
-          <img className="h-7 mr-2 w-auto" src="/logo.svg" alt="MNGO" />
-          <div className="font-bold text-fgd-1 text-2xl">
-            {vaults.mangoBalance}
+        <Card title="Total $MNGO for sale">
+          <div className="flex">
+            <img className="h-7 mr-2 w-auto" src="/logo.svg" alt="MNGO" />
+            <div className="font-bold text-fgd-1 text-2xl">
+              {vaults.mangoBalance}
+            </div>
           </div>
-        </div>
-      </Card>
-      <Card title="Estimated token price">
-        <div className="flex">
-          <img
-            alt="USDC"
-            width="25"
-            height="25"
-            src="/icons/usdc.svg"
-            className={`mr-2`}
-          />{' '}
-          <div className="font-bold text-fgd-1 text-2xl">
-            {vaults.estimatedPrice
-              ? numberFormat.format(vaults.estimatedPrice)
-              : 'N/A'}
+        </Card>
+        <Card title="Estimated token price">
+          <div className="flex">
+            <img
+              alt="USDC"
+              width="25"
+              height="25"
+              src="/icons/usdc.svg"
+              className={`mr-2`}
+            />{' '}
+            <div className="font-bold text-fgd-1 text-2xl">
+              {vaults.estimatedPrice
+                ? numberFormat.format(vaults.estimatedPrice)
+                : 'N/A'}
+            </div>
           </div>
-        </div>
-      </Card>
+        </Card>
       </div>
     </div>
   )