feat: add a parte do escrito institucional

adilson-fernando/src/components/Main/Main.tsx

@@ -2,13 +2,22 @@ import React from "react";
 
 import "../../styles/Global.scss";
 import "../../styles/Variaveis.scss";
+import Newsletter from "./Newsletter";
+import Whatsapp from "../Whatsapp";
 
-import "../../styles/Main.module.scss";
+import styles from  "../../styles/Main.module.scss";
+
+import casinhaInstitucional from "../../assets/images/casinhaInstitucional.png";
 
 const Main = () => {
   return (
-    <main>
-      
+    <main className={styles["main"]}>
+      <a className={styles["link-casinha"]} href="/">
+        <img className={styles["img-casinha"]} src={casinhaInstitucional} alt="Icone Casinha + Institucional" />
+      </a>
+      <h1 className={styles["main-titulo"]}>INSTITUCIONAL</h1>
+
+      <Newsletter/>
     </main>
   );
 };

adilson-fernando/src/components/Main/Newsletter.tsx

@@ -0,0 +1,16 @@
+import React from "react";
+
+import "../../styles/Global.scss";
+import "../../styles/Variaveis.scss";
+
+import styles from  "../../styles/Newsletter.module.scss";
+
+const Newsletter = () =>{
+    return (
+        <h1>
+            hello world
+        </h1>
+    );
+};
+
+export default Newsletter;

adilson-fernando/src/components/Whatsapp.tsx

@@ -0,0 +1,14 @@
+import React from "react";
+
+import "../styles/Global.scss";
+import "../styles/Variaveis.scss";
+
+import styles from  "../styles/Whatsapp.module.scss";
+
+const Whatsapp = () =>{
+    return (
+        <h1></h1>
+    );
+};
+
+export default Whatsapp;

adilson-fernando/src/pages/Home.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 
 import Header from "../components/Header/Header";
+import Whatsapp from "../components/Whatsapp";
 import Footer from "../components/Footer/Footer";
 import Main from "../components/Main/Main";
 
@@ -8,6 +9,7 @@ const Home = () => {
   return (
     <div>
       <Header />
+      <Whatsapp />
       <Main />
       <Footer />
     </div>

adilson-fernando/src/styles/Main.module.scss

@@ -0,0 +1,42 @@
+main {
+  display: flex;
+  flex-direction: column;
+  .link-casinha {
+    margin-left: 7.813%;
+    padding-bottom: 80px;
+    margin-top: 29px;
+    width: 8.985%;
+    min-width: 115px;
+    @media (min-width: 2500px) {
+      width: 8.56%;
+      margin-left: 4%;
+    }
+    @media (max-width: 1024px) {
+      width: 8.56%;
+      margin-left: 16px;
+    }
+    .img-casinha {
+      width: 100%;
+    }
+  }
+  .main-titulo {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-family: "Roboto", sans-serif;
+    font-style: normal;
+    font-weight: 400;
+    font-size: 24px;
+    line-height: 28px;
+    letter-spacing: 0.1em;
+    color: #292929;
+    margin-bottom: 80px;
+    @media (min-width: 2500px) {
+      font-size: 48px;
+      line-height: 56px;
+    }
+    @media (max-width: 1024px) {
+      margin-bottom: 40px;
+    }
+  }
+}