diff --git a/_assets/css/main.css b/_assets/css/main.css index 42ee35e..29e500b 100644 --- a/_assets/css/main.css +++ b/_assets/css/main.css @@ -96,34 +96,25 @@ body { } .fig-container { - background-color: #E0E0E0; - + background-color: #E0E0E0; + max-height: 530px; + } .fig-wrapper { - height: 530px; -display: flex; -justify-content: center; -align-items: center; -gap: 39px; - - + max-height: 530px; + display: flex; + justify-content: center; + align-items: center; + gap: 39px; + padding: 0; } .fig-image { - - - width: 29%; - + max-width: 566px; + width: 29%; } - - - - - - - .cards-wrapper2 { gap: 16px; @@ -174,21 +165,15 @@ gap: 39px; } - - - - - - .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 { - width: 100%; +.bottom-banner-desktop { + max-width: 1360px; + width: 71%; } .page-footer { @@ -222,12 +207,12 @@ gap: 39px; +/* Tablet e Mobile - 280px to 1024px */ +@media only screen + and (min-device-width: 280px) + and (max-device-width: 1024px) { - - -@media screen and (max-width: 414px) { - .top-banner-image-desktop, - .bottom-banner-desktop { + .top-banner-image-desktop { display: none; } @@ -297,7 +282,8 @@ gap: 39px; grid-row: span 2; width: 43%; } -} + +}; @@ -309,61 +295,17 @@ gap: 39px; +/* Desktop - 1025px to 2500px */ +@media only screen + and (min-device-width: 1025px) + and (max-device-width: 2500px) { -@media screen and (min-width: 415px) and (max-width: 1200px) { - .top-banner-image-mobile, - .bottom-banner-mobile { - display: none; - } + .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 { - display: flex; - flex-direction: column; - align-items: center; - padding-top: 91px; - padding-bottom: 80px; - } - - .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; - } -} +}; @@ -373,12 +315,12 @@ gap: 39px; +/* Desktop 4k - 2501px above */ +@media only screen + and (min-device-width: 2501px) { - - -@media screen and (min-width: 1024px) and (max-width: 2500px) { - .top-banner-image-mobile, - .bottom-banner-mobile { - display: none; - } -} + .top-banner-image-mobile, + .bottom-banner-mobile { + display: none; + } +}; \ No newline at end of file diff --git a/index.html b/index.html index 5ced229..191f42b 100644 --- a/index.html +++ b/index.html @@ -105,6 +105,7 @@
+
Imagem 1 Imagem 2