diff --git a/_assets/css/main.css b/_assets/css/main.css
index 42ee35e..ee1b2fa 100644
--- a/_assets/css/main.css
+++ b/_assets/css/main.css
@@ -1,3 +1,4 @@
+/* Reset */
 * {
   margin: 0;
   padding: 0;
@@ -21,14 +22,16 @@ body {
 }
 
 .top-banner-image-desktop,
-.top-banner-image-mobile {
+.top-banner-image-mobile  {
   width: 100%;
 }
 
+
 .infocard {
   margin: 73px 25%;
   justify-content: center;
 }
+
 .infocard-title {
   text-align: center;
   font-weight: 500;
@@ -61,22 +64,20 @@ body {
 }
 
 .pc-icon-image {
-  width: 315px;
+  width: 100%;
+  max-width: 315px;
 }
 
 .cards-wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, max-content);
-  gap: 21px;
+  gap: 16px;
   justify-content: center;
-  padding-top: 179px;
-  padding-bottom: 74px;
   text-align: center;
+  margin: 129px 72px 74px 72px;
+  display: flex;
 }
 
 .card {
   max-width: 350px;
-  display: flex;
   flex-direction: column;
   align-items: center;
   padding: 0 26px 28px;
@@ -88,6 +89,7 @@ body {
   margin-top: 35px;
   margin-bottom: 15px;
 }
+
 .card-description {
   font-weight: 400;
   font-size: 16px;
@@ -96,45 +98,50 @@ body {
 }
 
 .fig-container {
-  background-color: #E0E0E0;
-  
+  display: flex;
+  background-color: #E0E0E0;  
 }
 
-.fig-wrapper {
-  height: 530px;
-display: flex;
-justify-content: center;
-align-items: center;
-gap: 39px;
-
-
+.figure-wrapper {
+  margin-left: 72px;
+  margin-right: 72px;
 }
 
 .fig-image {
+  width: 100%;
+  max-width: 566px;
+}
 
+.flex-img {
+  max-width: 100%;
+  display: block; 
+}
 
-  width: 29%;
-  
+.flex {
+/*   background-color: #E0E0E0; */
+  display: flex;
+  flex-wrap: nowrap;
+  max-width: 80%;
+  margin: 0 auto;
+}
+
+.flex > div {
+  flex: 1 1 566px;
+  margin: 0 20px;
 }
 
 
-
-
-
-
-
-
-.cards-wrapper2 {
-
+/* bloco 4 cards */
+.cards-wrapper2 {  
   gap: 16px;
   justify-content: center;
   text-align: center;
-  margin: 179px 72px 74px 72px;
+  margin: 129px 72px 74px 72px;
   display: flex;
 }
 
 .card2 {
-
+  max-width: 350px;
   flex-direction: column;
   align-items: center;
   padding: 0 26px 28px;
@@ -154,8 +161,10 @@ gap: 39px;
   margin-top: 27px;
 }
 
+
+/* bloco Article */
 .article {
-  margin-top: 108px;  
+  margin-top: 108px;
 }
 
 .article-title {
@@ -171,26 +180,28 @@ gap: 39px;
   font-size: 16px;
   line-height: 24px;
   margin: 0 auto 50px auto;
-  
 }
 
 
-
-
-
-
-
+/* bloco bottom banner */
 .bottom-banner {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
-.bottom-banner-image-desktop,
-.bottom-banner-image-mobile {
+.bottom-banner-desktop {
+  max-width: 1360px;
+  width: 71%;
+}
+
+.bottom-banner-mobile {
   width: 100%;
+
 }
 
+
+/* bloco footer */
 .page-footer {
   margin-top: 116px;
   display: flex;
@@ -206,7 +217,6 @@ gap: 39px;
 }
 
 .footer-text {
-  color: #ffffff;
   text-align: center;
   margin: 17px 0 38px;
   font-size: 10px;
@@ -221,164 +231,308 @@ gap: 39px;
 
 
 
-
-
-
-
 @media screen and (max-width: 414px) {
-  .top-banner-image-desktop,
-  .bottom-banner-desktop {
-    display: none;
+    .top-banner-image-desktop,
+    .bottom-banner-desktop {
+        display: none;
+    }
+
+    .column-reverse {
+      display: flex;
+      flex-direction: column-reverse;
+    }
+
+    .infocard-subtitle {
+      font-size: 20px;    
+    }
+
+    .infocard-title {
+      font-size: 28px;
+      line-height: 12px;
+    }
+
+    .infocard-description {
+      text-align: center;
+      justify-content: center;
+      padding-top: 19px;    
+    }
+
+    .infocard {    
+      margin: 73px 27px 0;
+    }
+
+    .cards-wrapper {
+      display: block;    
+      margin: 90px 32px 80px 32px;
+    }
+
+    .card {
+      width: 350px;
+      margin-top: 16px;
+      align-items: center;
+    }
+
+    .pc-icon-image {
+      max-width: 239px;
+    }
+
+    .cards-wrapper2 {
+      display: block;    
+      margin: 80px 0 98px 0;
+    }
+
+    .card2 {
+      width: 350px;
+      margin: 7% 0 0 6%;
+      justify-content: center;
+      align-items: center;
+    }
+
+    .article-description {
+      text-align: center;
+      justify-content: center;
+      margin: 0 auto 0 auto;
+      margin: 0 32px 0 32px;
+    }
+
+    .page-footer {
+      margin-top: 87px;
+    }
+
+    .article {
+      margin-top: 50px;
+    }
+
+    .footer-text {
+      max-width: 261px;
+      text-align: center;
+    }
+
+
+    /* imagens pequenas e invertidas grid */
+    .img-small1 {
+      grid-area: foto1;
+    }
+    .img-small2 {
+      grid-area: foto2;
+    }
+    .img-big3 {
+      grid-area: foto3;
+      width: 368px;
+    }
+
+    .grid2 {
+      display: grid;
+      grid-template-columns: auto auto ;
+      grid-template-rows: auto;
+      direction: rtl;      
+      grid-template-areas: 
+      "foto2 foto1"
+      "foto3 foto3"
+      ;}
+
+    .img-small1 {
+      grid-area: foto1;
+    }
+    .img-small2 {
+      grid-area: foto2;
+    }
+    .img-big3 {
+      grid-area: foto3;
+      width: 368px;
+    }
+
+    .flex  {
+      background-color: #E0E0E0;
+      height: 574px;
+      margin-bottom: 112px;
+
+    }
+}
+
+
+
+
+
+/* Tablet e Mobile - 415px to 1024px */
+@media only screen and (min-device-width: 415px) and (max-device-width: 1024px){
+  .top-banner-image-mobile,
+  .bottom-banner-mobile {
+      display: none;
   }
 
-  .infocard {
-    margin: 73px 6%;
-  }
+
 
   .infocard-subtitle {
-    font-size: 20px;
-    line-height: 24px;
+    font-size: 20px;    
   }
 
   .infocard-title {
     font-size: 28px;
-    line-height: 34px;
+    line-height: 12px;
   }
+
   .infocard-description {
-    padding-top: 19px;
-    font-size: 16px;
-    line-height: 24px;
     text-align: center;
+    justify-content: center;
+    padding-top: 19px;    
   }
 
-  .pc-icon {
-    margin-top: 65px 0 91px;
-  }
-
-  .pc-icon-image {
-    width: 58%;
+  .infocard {    
+    margin: 73px 27px 0;
   }
 
   .cards-wrapper {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    padding-top: 91px;
-    padding-bottom: 80px;
+    display: grid;    
+    margin: 90px 32px 80px 32px;
   }
 
   .card {
-    padding: 35px 26px 28px;
-    background: #ffffff;
-    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23);
-  }
-
-  .card-description {
-    font-weight: 400;
-    font-size: 16px;
-    line-height: 24px;
-    margin-top: 27px;
-  }
-
-  .imageblock-wrapper {
-    background-color: #e0e0e0;
-    display: flex;
-    flex-direction: column;
+    width: 350px;
+    margin-top: 16px;
     align-items: center;
   }
 
-  .imageblock-image {
+  .pc-icon-image {
+    max-width: 239px;
+  }
+
+
+  .cards-wrapper2 {
+    display: grid;    
+    margin: 80px 0 98px 0;
+  }
+
+  .card2 {
+    width: 350px;
+    margin: 7% 0 0 6%;
+    justify-content: center;
     align-items: center;
+  }
+
+  .article-description {
+    text-align: center;
+    justify-content: center;
+    margin: 0 auto 0 auto;
+    margin: 0 32px 0 32px;
+  }
+
+  .page-footer {
+    margin-top: 87px;
+  }
+
+  .article {
+    margin-top: 50px;
+  }
+
+  .footer-text {
+    max-width: 261px;
+    text-align: center;
+  }
+
+
+  /* imagens pequenas e invertidas grid */
+  .img-small1 {
+    grid-area: foto1;
+  }
+  .img-small2 {
+    grid-area: foto2;
+  }
+  .img-big3 {
+    grid-area: foto3;
+    width: 368px;
+  }
+
+  .grid2 {
     display: grid;
-    grid-template-columns: repeat(2, 1fr);
+    grid-template-columns: auto auto ;
+    grid-template-rows: auto;
+    direction: rtl;      
+    grid-template-areas: 
+    "foto2 foto1"
+    "foto3 foto3"
+    ;}
+
+  .img-small1 {
+    grid-area: foto1;
+  }
+  .img-small2 {
+    grid-area: foto2;
+  }
+  .img-big3 {
+    grid-area: foto3;
+    width: 368px;
   }
 
-  .image2 .image1 {
-    grid-row: span 2;
-    width: 43%;
+  .flex-img {
+    max-width: 100%;
+    display: block; 
   }
-}
-
-
-
-
-
-
-
-
-
-
-
-
-@media screen and (min-width: 415px) and (max-width: 1200px) {
-  .top-banner-image-mobile,
-  .bottom-banner-mobile {
-    display: none;
-  }
-
-  .infocard {
-    margin: 73px 6%;
-  }
-
-  .infocard-subtitle {
-    font-size: 20px;
-    line-height: 24px;
-  }
-
-  .infocard-title {
-    font-size: 28px;
-    line-height: 34px;
-  }
-  .infocard-description {
-    padding-top: 19px;
-    font-size: 16px;
-    line-height: 24px;
-    text-align: center;
-  }
-  .pc-icon {
-    margin-top: 65px 0 91px;
-  }
-
-  .pc-icon-image {
-    width: 58%;
-  }
-
-  .cards-wrapper {
+  
+  .flex {
+  /*   background-color: #E0E0E0; */
     display: flex;
-    flex-direction: column;
-    align-items: center;
-    padding-top: 91px;
-    padding-bottom: 80px;
+    flex-wrap: nowrap;
+    max-width: 80%;
+    margin: 0 auto;
+  }
+  
+  .flex > div {
+    flex: 1 1 566px;
+    margin: 0 20px;
   }
 
-  .card {
-    padding: 35px 26px 28px;
-    background: #ffffff;
-    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23);
-  }
-
-  .card-description {
-    font-weight: 400;
+  .article-description {
+    max-width: 550px;
+    text-align: center;
     font-size: 16px;
     line-height: 24px;
-    margin-top: 27px;
+    margin: 0 auto 50px auto;
   }
 }
 
 
 
+/* Desktop - 1025px to 2500px */
+@media only screen and (min-device-width: 1025px) and (max-device-width: 2500px) {
 
-
-
-
-
-
-
-
-
-@media screen and (min-width: 1024px) and (max-width: 2500px) {
   .top-banner-image-mobile,
   .bottom-banner-mobile {
     display: none;
   }
+
+  .cards-wrapper2 {
+    margin: 179px 72px 74px 72px;
+  }
 }
+
+
+
+/* Desktop 4k - 2501px above */
+@media only screen and (min-device-width: 2501px) {
+
+  .top-banner-image-mobile,
+  .bottom-banner-mobile {
+    display: none;
+  }
+
+  .infocard-description {
+    font-size: 32px;
+    line-height: 36px;
+  }
+
+  .cards-wrapper2 {
+    margin: 179px 370px 74px 370px;
+  }
+
+  .fig-wrapper {
+    padding-top: 62px;
+  }
+
+  .article-description {
+    font-size: 32px;
+    line-height: 36px;
+    max-width: 850px;
+  }
+
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index 5ced229..9f55eab 100644
--- a/index.html
+++ b/index.html
@@ -44,6 +44,7 @@
 
       <!-- Bloco Infocard | Desktop and Mobile -->
       <section class="block-main">
+        
         <div class="infocard">
           <h2 class="infocard-subtitle">Lorem ipsum</h2>
           <h1 class="infocard-title">dolor sit amet</h1>
@@ -104,19 +105,23 @@
       </div>
 
 
-        <div class="fig-container">
-          <figure class="fig-wrapper">
-            <img class="fig-image" src="./_assets/images/image1.png" alt="Imagem 1">
-            <img class="fig-image" src="./_assets/images/image2.png" alt="Imagem 2">
-            <img class="fig-image" src="./_assets/images/image3.png" alt="Imagem 3">
-          </figure>
 
+      <section class="flex grid2">
+        <div>
+          <img class="flex-img img-small1" src="./_assets/images/image1.png" alt="Imagem 1">
         </div>
-
-
+        <div>
+          <img class="flex-img img-small2" src="./_assets/images/image2.png" alt="Imagem 2">
+        </div>
+        <div>
+          <img class="flex-img img-big3" src="./_assets/images/image3.png" alt="Imagem 3">
+        </div>
+      </section>
 
 
       
+
+
       <!-- Cards2 | Desktop and Mobile -->
       <div class="cards-wrapper2">
         <figure class="card2">
@@ -164,7 +169,7 @@
         <figure class="card2">
           <img
             class="card-image2"
-            src="./_assets/images/card2-image3.svg"
+            src="./_assets/images/card2-image4.svg"
             alt="Card Image 4"
           />
           <figcaption class="card-description2">
@@ -176,6 +181,9 @@
         </figure>
       </div>
 
+
+
+      <section class="column-reverse">
       <article class="article">
         <h1 class="article-title">Lorem ipsum dolor sit amet</h1>
         <p class="article-description">
@@ -201,6 +209,10 @@
         />
       </figure>
 
+    </section>
+
+
+
       <!-- Footer | Desktop and Mobile -->
       <footer class="page-footer">
         <ul class="page-footer-icon">