diff --git a/assets/styles/style.css b/assets/styles/style.css index 808e89a..b8d3c40 100644 --- a/assets/styles/style.css +++ b/assets/styles/style.css @@ -52,6 +52,34 @@ html, body{ /*-------------------------------------------------------------------*/ +.section-background{ + display: flex; + background:#F0F0F0; + justify-content: center; + gap: 20px; + padding: 74px 0; +} +.section-cards{ + display: flex; + flex-direction: column; + flex-wrap: wrap; + align-items: center; + background: #FFFFFF; + box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23); + max-width: 350px; + padding: 26px 26px 34px; +} +.section-img-cards{ + display: block; + margin-bottom: 26px; +} +.section-p-card{ + max-width: 300px; + font-weight: 400; + font-size: 16px; + line-height: 24px; + text-align: center; +} @media screen and (max-width: 1024px) { .main-banner-desktop{ @@ -84,6 +112,7 @@ html, body{ margin: 0 86px 0 86px; max-width: 240px; } + /*------------------------------------------------------------------*/ } diff --git a/index.html b/index.html index faed8c3..a76c94c 100644 --- a/index.html +++ b/index.html @@ -45,18 +45,21 @@ -
-
- Imagem pequena de uma loja -

+
+ +
+ Imagem pequena de uma loja +

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.

-
- Imagem pequena de uma sacolinha +
+ Imagem pequena de uma sacolinha +

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.

-
- Imagem pequena de uma mão com uma cedula +
+ Imagem pequena de uma mão com uma cedula +

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.