* { margin: 0; padding: 0; box-sizing: border-box; } header { align-items: center; height: 101px; display: flex; justify-content: center; background: black; width: 100%; } body { font-family: 'Inter', sans-serif; } .banner-1-desktop { width: 100%; } .banner-1-mobile { width: 100%; display: none; } .first-section h2 { text-transform: uppercase; font-size: 32px; line-height: 39px; font-weight: 400; } .first-section h1 { text-transform: uppercase; font-weight: 500; font-size: 48px; line-height: 58px; } .first-section p { margin-top: 28px; text-align: left; font-weight: 400; font-size: 16px; line-height: 24px; } .text-1 { width: 50%; } .first-section { margin-top: 74px; text-align: center; display: flex; justify-content: center; align-items: center; } .image-computer{ width: 18%; } .image-section { display: flex; justify-content: center; margin-top: 74px; } .section-cards { justify-content: center; align-items: center; gap: 21px; display: flex; grid-template-columns: 1fr 1fr 1fr; } .image-card { box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23); max-width: 18%; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 179px; } .image-card-image { display: block; margin-top: 36px; } .image-card-paragraph { padding-top: 27px; padding: 26px; max-width: 300px; text-align: center; font-weight: 400; font-size: 16px; line-height: 24px; } @media screen and (max-width: 1024px) { .section-cards { display: flex; flex-direction: column; margin-top: 90px; } .image-card { max-width: 84.54%; margin-top: 0%; padding-top: 35px; padding-left: 26px; padding-right: 26px; padding-bottom: 27px; } .image-computer { width: 57.73%; } } @media screen and (max-width: 1024px) { .banner-1-desktop { display: none; } .banner-1-mobile { display: unset; } .text-1 { width: 86.47%; } .first-section p { text-align: center; } }