diff --git a/assets/css/style.css b/assets/css/style.css index b2318b8..a4c63e5 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -30,10 +30,8 @@ body { flex-direction: column; align-items: center; padding: 74px 0 180px; -} - -.top-inforcard-text { max-width: 40%; + margin: 0 auto 0; } .top-infocard-subtitle { @@ -59,10 +57,12 @@ body { font-style: normal; font-weight: 400; font-size: 16px; - line-height: 150%; - margin-bottom: 74px; + line-height: 24px; text-align: center; } +.top-infocard-text { + margin-bottom: 74px; +} .top-cards { display: grid; @@ -136,7 +136,7 @@ body { flex-direction: column; align-items: center; background: #ffffff; - box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23); + box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15); } .bottom-card-image { @@ -218,11 +218,11 @@ body { .top-infocard { padding: 73px 32px 90px; margin: 0 auto 0; - } - .top-inforcard-text { - margin-bottom: 65px; max-width: 100%; } + .top-infocard-text { + margin-bottom: 65px; + } .top-infocard-subtitle { font-size: 20px; @@ -272,6 +272,7 @@ body { .bottom-card-description { font-size: 14px; } + .bottom-infocard { flex-direction: column-reverse; margin: 0; @@ -307,3 +308,87 @@ body { display: none; } } + +@media screen and (min-width: 2500px) { + .page-header { + padding: 56px 0; + } + .header-logo { + width: 200%; + } + .top-infocard-text { + margin-bottom: 0; + } + .top-infocard-subtitle { + font-size: 64px; + line-height: 78px; + } + .top-infocard-title { + font-size: 96px; + line-height: 116px; + } + .top-infocard-description { + font-size: 32px; + line-height: 48px; + margin-bottom: 100px; + } + + .top-infocard-image { + height: 600px; + margin: 20px 0 84px; + } + .top-card-description { + font-size: 40px; + line-height: 40px; + margin: 50px 30px; + } + .top-card-image { + height: 200px; + margin-top: 100px; + } + .bottom-card-description { + font-size: 33px; + line-height: 52px; + margin: 25px 100px 73px; + } + .bottom-card-image { + height: 200px; + margin-top: 70px; + } + .bottom-banner-desktop { + width: 2500px; + } + + .bottom-infocard { + margin-bottom: 210px; + padding: 200px 280px 0px; + } + .bottom-infocard-text { + width: 1174px; + } + + .bottom-infocard-subtitle { + font-size: 75px; + margin-bottom: 40px; + line-height: 80px; + } + + .bottom-infocard-description { + font-size: 40px; + margin-top: 20px; + line-height: 50px; + } + + .page-footer { + padding: 74px 0 74px; + } + + .rede-social-imagem { + height: 66px; + margin-bottom: 12px; + } + + .footer-text { + font-size: 20px; + } +} diff --git a/index.html b/index.html index bda0665..320bc71 100644 --- a/index.html +++ b/index.html @@ -35,7 +35,7 @@
-
+

Lorem ipsum

dolor sit amet

@@ -45,7 +45,7 @@ dui.

-
+
Banner do Infocard do Topo
@@ -164,29 +164,31 @@ alt="Banner do Infocard de Baixo Mobile">
- + + \ No newline at end of file