From c6a69e9a66422498f9f171cb06548541a6664d52 Mon Sep 17 00:00:00 2001
From: Victor Souza <victorsouza11@gmail.com>
Date: Mon, 10 Oct 2022 12:23:45 -0300
Subject: [PATCH] Adicionando cards e textos no parte principal do projeto

---
 assests/middle-card-01.png | Bin 0 -> 939 bytes
 assests/middle-card-02.png | Bin 0 -> 2071 bytes
 assests/middle-card-03.png | Bin 0 -> 3027 bytes
 index.html                 |  28 +++++++++++++++++-----
 main.css                   |  48 ++++++++++++++++++++++++++++---------
 5 files changed, 59 insertions(+), 17 deletions(-)
 create mode 100644 assests/middle-card-01.png
 create mode 100644 assests/middle-card-02.png
 create mode 100644 assests/middle-card-03.png

diff --git a/assests/middle-card-01.png b/assests/middle-card-01.png
new file mode 100644
index 0000000000000000000000000000000000000000..c2cdc08c0bc5e4669219f8c7e68c17071085bda2
GIT binary patch
literal 939
zcmeAS@N?(olHy`uVBq!ia0vp^=|CLJ!3HFoR!KSmDb50q$YKTtZeb8+WSBKa0w~B>
z9OUlAu<o49OCX0O-O<;Pfnj4m_n$;o1_ovaPZ!6K3dXl{9P=(ah_ubW%N3gQO8ScQ
zDWP)4r1om27n~<}UrY-<!+A@3iMfWk#|_5V33`c-i<+kKYE6|gUhLyAtLJUuW0m?z
z|0l;y?MXkj{@*LlS9>B_)`+a^+SipW%9{MHFt@MVU8}=)dFYSUYo<ky6TN)+W_>uu
z#nmIT+;Ec#n-<^K=02a>uTTHjdc6IN)NIe<H-F7lqaVr$i9YZ9yL{oVkGEd^2|RX<
z%}MNFz|o05^6%G8n;g|E-=f3(dxv_IUy3PTt4?#{R~xR@15TC)0{9H3F!MZRaK^)o
zI@f!3oBG)bv&TP<Ts$T-MO^pzzk;_OX|uodnj9`on9=-k(#eucKb5+YBeD02b^bkh
zq{n}2iHwpv-|@-3-<H_+b0%x9=eqi~^SF$9P~85flbtU)@$K!B@v}L0{i#6pnTMwy
z-ro^?{MhHN&ikIVJJ;R2rzt7l9bfu#*|Q6mrPW<qf4%vs_D+RO%WmfJ-D&QDp8Ky{
ztV`YY*W`SB=$F|lIg3wk)k{C)c>ZIyYmtS(>)t3Ge*KeY&&b?lKK?xI|CxnJk~y<x
z*rmP|-@7K!sa9L@S%Bl4nLbye*4#dy_3Xmw4EIwPZ-1I4Q<Xj8u*$bL2OUqg?7X^c
zwcyuZtFAl#{a3AU`Tw3>7m|Y{_b;B=v)}M>ZMV3vvHO-Z%aXNr8~@bD>baJ0T0806
zO55U!TwaM&jBP~?3uO{C*pZksa_9R!?0!FUi$?%U_;>N&>2Y%>+i=O>HT@ZKx%=YX
z_ra2KKVqsTu6=HA<r;A0lG5V!{@K4PPI9We@!HLkQscN`-rU<761m&=)=xaX`&ZM_
z=`x(n+h6f(O=Uftio;4I+cB6QS1C?da5wrn`_Zhs5ql&=r#nh`oL*8YyXVQB`pO~=
z=`$~q_J4gP|MAB?;pwKRK0!6>*!N>DDgTZn-JQ{q&S#)!IXOCR;!&eg>-D<s%cDi>
qL-vGhR8G0~Lipj{uJcY|?fYNMlWUGHNp=C|Ee20lKbLh*2~7Zh{ilim

literal 0
HcmV?d00001

diff --git a/assests/middle-card-02.png b/assests/middle-card-02.png
new file mode 100644
index 0000000000000000000000000000000000000000..97f8ad470df974e5b113b37aa8f421d577ffe137
GIT binary patch
literal 2071
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
B;hq2h

literal 0
HcmV?d00001

diff --git a/assests/middle-card-03.png b/assests/middle-card-03.png
new file mode 100644
index 0000000000000000000000000000000000000000..a5e458faed7989a70c5e1d53c1d119b3dccad04f
GIT binary patch
literal 3027
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
V4)TYZ*pL7K002ovPDHLkV1gctz6$^V

literal 0
HcmV?d00001

diff --git a/index.html b/index.html
index 2ad789c..25a9fe9 100644
--- a/index.html
+++ b/index.html
@@ -22,15 +22,31 @@
         <img class="main-banner main-banner-mobile" src="./assests/main-banner-mobile.png" alt="Banner do topo Mobile">
       </figure>
     </div>
-    <section class="top-information">
-      <div class="top-text">
-        <h2 class="top-information-subtitle">Lorem ipsum</h2>
-        <h1 class="top-information-title">dolor sit amet</h1>
-        <p class="top-information-description">
-          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit. Nulla suscipit magna dui. 
+    <section class="middle-information">
+      <div class="middle-text">
+        <h2 class="middle-information-subtitle">Lorem ipsum</h2>
+        <h1 class="middle-information-title">dolor sit amet</h1>
+        <p class="middle-information-description">
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit. Nulla suscipit magna dui. 
         </p>
       </div>
+      <figure>
+        <img class="main-image-desktop" src="./assests/main-image-desktop.png" alt="Imagem da main Desktop">
+        <img class="main-image-mobile"src="./assests/main-image-mobile.png" alt="Imagem da main Mobile">
+      </figure>
+      <div class="middle-cards">
+        <figure>
+            <img src="./assests/middle-card-01.png" alt="Imagem do primeiro card do meio">
+            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. </p>
+        </figure>
+     </div>
     </section>
+
+    
+   
+    <div>
+    
+    </div>
     
     
   </main>
diff --git a/main.css b/main.css
index 50771a2..817027f 100644
--- a/main.css
+++ b/main.css
@@ -9,7 +9,7 @@
 body {
   font-family: 'inter', sans-serif;
 }
-/* estilazação do fundo */
+/* estilização do fundo */
 .head-logo {
   display: flex;
   flex-direction: column;
@@ -27,31 +27,32 @@ body {
   display: block;
 }
 
-.top-information {
+.middle-information {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
+  padding: 74px 0 180px;
 }
 
 /* estilização para caixa do texto ( não coloquei em 40% para quebrar no paragrafo do figma */
-.top-text {
-  display:flex;
+.middle-text {
+  display:flex; 
   flex-direction: column;
   align-items: center;
-  width: 766px; 
-  padding: 74px 0 580px;
+  width: 40%; 
+  margin-bottom: 74px;
 }
 
 
-.top-information-subtitle {
+.middle-information-subtitle {
   font-weight: 400;
   font-size: 32px;
   line-height: 39px;
   text-transform: uppercase;
 }
 
-.top-information-title {
+.middle-information-title {
   font-weight: 500;
   font-size: 48px;
   line-height: 58px;
@@ -60,13 +61,38 @@ body {
 }
 
 @media screen and (max-width: 414px) {
-  .main-banner-desktop {
+  .main-banner-desktop, .main-image-desktop {
       display: none;
   }
 }
 
 @media screen and (min-width:415px ) {
-  .main-banner-mobile {
+  .main-banner-mobile, .main-image-mobile {
     display: none;
   }
-}
\ No newline at end of file
+}
+
+  @media screen and (max-width:1024px) {
+  
+    .middle-text {
+    width: 100%;
+    max-width: 112%;
+    text-align: center;
+  }
+
+  .middle-information {
+    padding: 74px 28px 90px;
+  }
+
+  .middle-information-subtitle {
+    font-size: 20px;
+    line-height: 24px;
+  }
+
+  .middle-information-title {
+    font-size: 28px;
+    line-height: 34px;
+  }
+
+}
+