diff --git a/assets/styles.css/main.css b/assets/styles.css/main.css index c25e058..c6caefa 100644 --- a/assets/styles.css/main.css +++ b/assets/styles.css/main.css @@ -63,8 +63,8 @@ body { } .top-infocard-image { - padding: 4% 0 5% 0; - width: 16.5vw; + padding: 8% 0 8% 0; + width: 16vw; align-items: center; } @@ -76,7 +76,7 @@ body { .top-cards { background: #FFFFFF; grid-template-columns: repeat(3, max-content); - padding: 7% 4% 6%; + padding: 6% 4% 6%; display: grid; gap: 48px; justify-content: center; @@ -92,7 +92,7 @@ body { } .top-card-description { - max-width: 15.625vw; + max-width: 15.5vw; font-size: 16px; line-height: 24px; text-align: center; @@ -110,7 +110,6 @@ body { display: grid; grid-template-columns: repeat(3, 1fr); padding: 0 72px; - margin-bottom: 62px; position: absolute; top: 62px; gap: 2.03125vw; @@ -128,12 +127,13 @@ body { background: #FFFFFF; grid-template-columns: repeat(4, 4fr); display: grid; - gap: 16px; justify-content: center; text-align: center; margin: 0 4%; - max-width: 92.5%; + width: 92.5vw; padding-top: 7%; + max-width: 100%; + gap: 16px; } .bottom-card-group { @@ -142,6 +142,8 @@ body { display: flex; background: #FFFFFF; box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15); + width: 22v.5w; + gap: 16px; } .bottom-card-image { @@ -313,6 +315,7 @@ body { .bottom-card-group { grid-template-columns: 1fr; + width: 100%; } .bottom-card { @@ -361,6 +364,14 @@ body { } } -@media screen and (min-width: 768px) and (max-width: 1023px) { - +@media screen and (min-width: 2000px) { + .middle-banner-desktop { + width: 0%; + } + + .middle-banner-group { + padding: 0 15%; + top: 35%; + margin: 0; } +} \ No newline at end of file