diff --git a/assets/images/middle-banner-mobile01.png b/assets/images/middle-banner-01.png similarity index 100% rename from assets/images/middle-banner-mobile01.png rename to assets/images/middle-banner-01.png diff --git a/assets/images/middle-banner-mobile02.png b/assets/images/middle-banner-02.png similarity index 100% rename from assets/images/middle-banner-mobile02.png rename to assets/images/middle-banner-02.png diff --git a/assets/images/middle-banner-mobile03.png b/assets/images/middle-banner-03.png similarity index 100% rename from assets/images/middle-banner-mobile03.png rename to assets/images/middle-banner-03.png diff --git a/assets/styles.css/main.css b/assets/styles.css/main.css index 67dad33..89523ee 100644 --- a/assets/styles.css/main.css +++ b/assets/styles.css/main.css @@ -70,7 +70,7 @@ body { .top-cards { background: #FFFFFF; grid-template-columns: repeat(3, max-content); - padding: 90px 0 0; + padding: 90px 0 80px; display: grid; gap: 20px; justify-content: center; @@ -92,6 +92,19 @@ body { text-align: center; } +.middle-banner { + background-color: #E0E0E0; + width: 1920px; + max-height: 530px; + margin: auto; +} + +.middle-banner-image { + width: 100%; + max-width: 566px; + margin: 62px 18px 0; +} + @media screen and (max-width: 414px) { .main-banner-desktop { display: none; @@ -128,6 +141,22 @@ body { grid-template-columns: 1fr; padding: 36px 26px; } + + .middle-banner { + display: grid; + grid-template-columns: repeat(2, max-content); + } + + .middle-banner-image { + max-width: 177px; + height: 178px; + } + + .middle-banner-image-ex { + max-width: 368px; + height: 372px; + display: grid; + } } @media screen and (min-width: 415px) { @@ -139,12 +168,6 @@ body { @media screen and (min-width: 768px) and (max-width: 1023px) { .top-cards { grid-template-columns: 1fr; - padding: 36px 26px; - } -} - -@media screen and (min-width: 415px) and (max-width: 767px) { - .main-banner-desktop { - display: none; + padding: 30px 28px; } } \ No newline at end of file diff --git a/index.html b/index.html index 60350f4..77985a5 100644 --- a/index.html +++ b/index.html @@ -67,6 +67,15 @@

+ +
+
+ Primeiro banner do Meio + Segundo banner do meio + Terceiro banner do meio +
+
+ \ No newline at end of file