MarcelloMartins/challenge-landing-page-marcello-martins
1
0
Fork 0
forked from M3-Academy/challenge-landing-page
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: made responsive second image cards

Browse Source
This commit is contained in:
Marcello Rodrigues Martins 2022-10-12 11:14:56 -03:00
parent 264300afad
commit 6c1c45ec6d
1 changed files with 27 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
styles/styles.css
View File

@ -15,6 +15,7 @@ header {
body { body {
font-family: 'Inter', sans-serif; font-family: 'Inter', sans-serif;
color: #000000;
} }
.banner-1-desktop { .banner-1-desktop {
@ -134,18 +135,19 @@ body {
.section-cards-second { .section-cards-second {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
gap: 21px; gap: 16px;
display: flex; display: flex;
} }
.image-card-second { .image-card-second {
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23); box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23);
max-width: 18%; max-width: 432px;
max-height: 332px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin-top: 179px; margin-top: 162px;
} }
.image-card-image-second { .image-card-image-second {
@ -154,9 +156,13 @@ body {
} }
.image-card-paragraph-second { .image-card-paragraph-second {
padding-top: 27px; font-family: 'Inter';
padding: 26px; font-style: normal;
max-width: 300px; color: #000000;
padding-top: 14px;
padding-bottom: 64px;
padding: 32px;
max-width: 368px;
text-align: center; text-align: center;
font-weight: 400; font-weight: 400;
font-size: 16px; font-size: 16px;
@ -219,4 +225,19 @@ body {
.midle-card-section > img { .midle-card-section > img {
max-width: 100%; max-width: 100%;
} }
.section-cards-second {
display: flex;
flex-direction: column;
margin-top: 112px;
}
.image-card-second {
max-width: 84.54%;
margin-top: 0%;
padding-top: 35px;
padding-left: 26px;
padding-right: 26px;
padding-bottom: 27px;
}
} }