diff --git a/assets/css/style.css b/assets/css/style.css index 3292f26..b755dfe 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -117,6 +117,34 @@ body { .bottom-card-image { display: block; + margin-bottom: 14px; +} + +.bottom-infocard { + display: flex; + align-items: center; + padding: 142px 0 180px; +} + +.bottom-infocard-text { + max-width: 550px; + justify-content: center; +} + +.bottom-infocard-image { + margin-right: 40px; +} + +.bottom-card-title { + margin-bottom: 18px; + line-height: 1; + font-size: 32px; + font-weight: 600; +} + +.bottom-infocard-description { + line-height: 24px; + font-size: 16px; } @media screen and (max-width: 414px) { @@ -172,6 +200,21 @@ body { width: 100%; max-width: 240px; } + .bottom-infocard { + flex-direction: column; + padding: 80px 0 136px; + } + .bottom-infocard-image { + width: 100%; + margin: 0 0 50px; + max-width: 596px; + } + .bottom-infocard-text { + padding: 0 26px; + } + .bottom-infocard-tittle { + font-size: 24px; + } } @media screen and (min-width: 769px) and (max-width: 1200px) { @@ -191,4 +234,11 @@ body { max-width: 520px; margin-right: 70px; } + + .bottom-infocard-image { + max-width: 480px; + } + .bottom-infocard-text { + max-width: 400px; + } } diff --git a/assets/imagens/bottom-infocard-image.png b/assets/imagens/bottom-infocard-image.png new file mode 100644 index 0000000..21e1dae Binary files /dev/null and b/assets/imagens/bottom-infocard-image.png differ diff --git a/index.html b/index.html index e1e8ad8..5965403 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate sapien non libero faucibus + interdum. In eget tincidunt ipsum. + Quisque a tellus at lectus blandit tempor. Ut tristique auctor mi eget hendrerit. Curabitur + venenatis felis vitae sagittis venenatis. + Donec finibus turpis vitae lectus interdum rutrum vitae sed augue. +
+