forked from M3-Academy/challenge-landing-page
feat: made responsive second image cards
This commit is contained in:
parent
264300afad
commit
6c1c45ec6d
@ -15,6 +15,7 @@ header {
|
||||
|
||||
body {
|
||||
font-family: 'Inter', sans-serif;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.banner-1-desktop {
|
||||
@ -134,18 +135,19 @@ body {
|
||||
.section-cards-second {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 21px;
|
||||
gap: 16px;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.image-card-second {
|
||||
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23);
|
||||
max-width: 18%;
|
||||
max-width: 432px;
|
||||
max-height: 332px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 179px;
|
||||
margin-top: 162px;
|
||||
}
|
||||
|
||||
.image-card-image-second {
|
||||
@ -154,9 +156,13 @@ body {
|
||||
}
|
||||
|
||||
.image-card-paragraph-second {
|
||||
padding-top: 27px;
|
||||
padding: 26px;
|
||||
max-width: 300px;
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
color: #000000;
|
||||
padding-top: 14px;
|
||||
padding-bottom: 64px;
|
||||
padding: 32px;
|
||||
max-width: 368px;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
@ -219,4 +225,19 @@ body {
|
||||
.midle-card-section > img {
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user