diff --git a/desafio-react-typescript/src/components/Header/components/HeaderBottom.module.scss b/desafio-react-typescript/src/components/Header/components/HeaderBottom.module.scss
index b585c29..4beaeff 100644
--- a/desafio-react-typescript/src/components/Header/components/HeaderBottom.module.scss
+++ b/desafio-react-typescript/src/components/Header/components/HeaderBottom.module.scss
@@ -8,8 +8,7 @@
 
   @include mq($lg, max) {
     position: absolute;
-    background-color: $white;
-    background: rgba(69, 69, 69, 0.7);
+    background-color: rgba(69, 69, 69, 0.7);
 
     top: 0;
     border: 0;
diff --git a/desafio-react-typescript/src/components/Main/Main.module.scss b/desafio-react-typescript/src/components/Main/Main.module.scss
index 3ce127a..4ec12d8 100644
--- a/desafio-react-typescript/src/components/Main/Main.module.scss
+++ b/desafio-react-typescript/src/components/Main/Main.module.scss
@@ -43,11 +43,15 @@
   }
 
   &__title {
-    @include fontStyle(400, 24px, 28px, $primary-1000);
+    @include fontStyle(400, 24px, 28px, $gray-900);
     letter-spacing: 0.1em;
 
     padding: 80px 0;
-    text-align: center; 
+    text-align: center;
+
+    @include mq($lg, max) {
+      padding-bottom: 40px;
+    }
 
     @include mq($xl, min) {
       @include fontStyleResponsive(48px, 56px);
diff --git a/desafio-react-typescript/src/components/Main/Main.tsx b/desafio-react-typescript/src/components/Main/Main.tsx
index de12c0e..752e77a 100644
--- a/desafio-react-typescript/src/components/Main/Main.tsx
+++ b/desafio-react-typescript/src/components/Main/Main.tsx
@@ -2,17 +2,26 @@ import React from "react";
 import home from "../../assets/svgs/home.svg";
 import arrowRight from "../../assets/svgs/arrow-right.svg";
 import styles from "./Main.module.scss";
+import Informacoes from "./components/Informacoes";
 
 const Main = () => {
   return (
-    <main className={styles["main"]}> 
+    <main className={styles["main"]}>
       <div className={styles["main__current-page"]}>
-        <a className={styles["main__home"]} href="/"><img src={home} alt="Casa" /></a>
-        <span className={styles["main__arrow-right"]}><img src={arrowRight} alt="" /></span>
-        <a className={styles["main__page"]} href="/">Institucional</a>
+        <a className={styles["main__home"]} href="/">
+          <img src={home} alt="Casa" />
+        </a>
+        <span className={styles["main__arrow-right"]}>
+          <img src={arrowRight} alt="" />
+        </span>
+        <a className={styles["main__page"]} href="/">
+          Institucional
+        </a>
       </div>
 
       <h1 className={styles["main__title"]}>INSTITUCIONAL</h1>
+
+      <Informacoes /> 
     </main>
   );
 };
diff --git a/desafio-react-typescript/src/components/Main/components/Form/FormCustom.tsx b/desafio-react-typescript/src/components/Main/components/Form/FormCustom.tsx
new file mode 100644
index 0000000..210336c
--- /dev/null
+++ b/desafio-react-typescript/src/components/Main/components/Form/FormCustom.tsx
@@ -0,0 +1,9 @@
+import React from 'react';
+
+const FormCustom = () => {
+    return (
+        <h1>Form</h1>
+    )
+}
+
+export default FormCustom;
\ No newline at end of file
diff --git a/desafio-react-typescript/src/components/Main/components/Informacoes.module.scss b/desafio-react-typescript/src/components/Main/components/Informacoes.module.scss
new file mode 100644
index 0000000..3df5182
--- /dev/null
+++ b/desafio-react-typescript/src/components/Main/components/Informacoes.module.scss
@@ -0,0 +1,80 @@
+@import "../../../styles/all.scss";
+
+.container {
+  display: flex;
+  gap: 30px;
+
+  @include mq($lg, max) {
+    display: block;
+  }
+  .content-list {
+    border-right: 1px solid $black;
+    width: 27.96296296%;
+
+    @include mq($lg, max) {
+      width: 100%;
+      border: none;
+      margin-bottom: 30px;
+    }
+
+    @include mq($xl, min) {
+      width: 25.652189%;
+    }
+
+    &__subject {
+      padding: 10px 16px;
+      @include fontStyle(400, 16px, 19px, $gray-500);
+
+      @include mq($xl, min) {
+        @include fontStyleResponsive(32px, 38px);
+      }
+    }
+
+    &__active {
+      background-color: $black;
+      @include fontStyle(700, 16px, 19px, $white);
+
+      @include mq($xl, min) {
+        @include fontStyleResponsive(32px, 38px);
+      }
+    }
+  }
+
+  .content-subject {
+    width: 69.2592592%;
+
+    @include mq($lg, max) {
+      width: 100%;
+    }
+
+    @include mq($xl, min) {
+      width: 73.04347826%;
+    }
+
+    &__title {
+      @include fontStyle(700, 24px, 28px, $gray-900);
+      margin-bottom: 12px;
+
+      @include mq($lg, max) {
+        text-align: center;
+      }
+
+      @include mq($xl, min) {
+        @include fontStyleResponsive(48px, 56px);
+      }
+    }
+
+    &__content {
+      @include fontStyle(400, 13px, 15px, $gray-500);
+      margin-bottom: 15px;
+
+      @include mq($lg, max) {
+        @include fontStyleResponsive(12px, 18px);
+      }
+
+      @include mq($xl, min) {
+        @include fontStyleResponsive(26px, 30px);
+      }
+    }
+  }
+}
diff --git a/desafio-react-typescript/src/components/Main/components/Informacoes.tsx b/desafio-react-typescript/src/components/Main/components/Informacoes.tsx
new file mode 100644
index 0000000..f5fd2a4
--- /dev/null
+++ b/desafio-react-typescript/src/components/Main/components/Informacoes.tsx
@@ -0,0 +1,59 @@
+import React from "react";
+import styles from "./Informacoes.module.scss";
+
+const Informacoes = () => {
+  return (
+    <div className={styles["container"]}>
+      <div className={styles["content-list"]}>
+        <ul className={styles["content-list__container"]}>
+          <li className={styles["content-list__subject"]}>Sobre</li>
+          <li className={styles["content-list__subject"]}>
+            Forma de Pagamento
+          </li>
+          <li className={styles["content-list__subject"]}>Entrega</li>
+          <li className={styles["content-list__subject"]}>Troca e Devolução</li>
+          <li className={styles["content-list__subject"]}>
+            Segurança e Privacidade
+          </li>
+          <li
+            className={`${styles["content-list__subject"]} ${styles["content-list__active"]}`}
+          >
+            Contato
+          </li>
+        </ul>
+      </div>
+      <div className={styles["content-subject"]}>
+        <h2 className={styles["content-subject__title"]}>Sobre</h2>
+        <p className={styles["content-subject__content"]}>
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
+          eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad
+          minim veniam, quis nostrud exercitation ullamco laboris nisi ut
+          aliquip ex ea commodo consequat. Duis aute irure dolor in
+          reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
+          pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
+          culpa qui officia deserunt mollit anim id est laborum.
+        </p>
+        <p className={styles["content-subject__content"]}>
+          Sed ut perspiciatis unde omnis iste natus error sit voluptatem
+          accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae
+          ab illo inventore veritatis et quasi architecto beatae vitae dicta
+          sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit
+          aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos
+          qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui
+          dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed
+          quia non numquam eius modi tempora incidunt ut labore et dolore magnam
+          aliquam quaerat voluptatem.
+        </p>
+        <p className={styles["content-subject__content"]}>
+          Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis
+          suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis
+          autem vel eum iure reprehenderit qui in ea voluptate velit esse quam
+          nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo
+          voluptas nulla pariatur?
+        </p>
+      </div>
+    </div>
+  );
+};
+
+export default Informacoes;
diff --git a/desafio-react-typescript/src/styles/global.scss b/desafio-react-typescript/src/styles/global.scss
index f6d6243..6a41bb6 100644
--- a/desafio-react-typescript/src/styles/global.scss
+++ b/desafio-react-typescript/src/styles/global.scss
@@ -1,4 +1,4 @@
-@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500&display=swap');
+@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap");
 
 * {
   margin: 0;
@@ -7,6 +7,11 @@
   font-family: "Roboto", sans-serif;
 }
 
+//APAGAR A LINHA DEPOIS
+body::-webkit-scrollbar {
+  display: none;
+}
+
 input,
 button {
   border: none;
diff --git a/desafio-react-typescript/src/styles/variaveis.scss b/desafio-react-typescript/src/styles/variaveis.scss
index f4df6a9..79c2cd6 100644
--- a/desafio-react-typescript/src/styles/variaveis.scss
+++ b/desafio-react-typescript/src/styles/variaveis.scss
@@ -2,18 +2,20 @@
 
 $white: #fff;
 $black: #000;
- 
-$primary-100: #5200FF;
+
+$primary-100: #5200ff;
 $primary-200: #303030;
-$primary-300: #5E5E5E;
+$primary-300: #5e5e5e;
 $primary-400: #919191;
-$primary-500: #C6C6C6;
-$primary-600: #C4C4C4;
-$primary-700: #F2F2F2;
-$primary-800: #F9F9F9;
-$primary-900: #FF0000;
-$primary-1000: #292929;
+$primary-500: #c6c6c6;
+$primary-600: #c4c4c4;
+$primary-700: #f2f2f2;
+$primary-800: #f9f9f9;
+$primary-900: #ff0000;
+
+$gray-500: #7d7d7d;
+$gray-900: #292929;
 //media Queries
 $sm: 375px;
 $lg: 1024px;
-$xl: 2500px;
\ No newline at end of file
+$xl: 2500px;