*{ margin: 0; padding: 0; box-sizing: border-box; } body{ font-family: 'Inter', sans-serif; color: #000; } .header{ background-color: #000; display: flex; justify-content: center; padding: 29px 0px; } .banner-desktop{ width: 100%; } .banner-desktop-img{ width: 100%; display: block; } .top-infocard{ display: flex; align-items: center; justify-content: center; flex-direction: column; max-width: 100%; padding-top: 4%; margin-bottom: 9.4%; } .top-infocard-text{ width: 40.25%; margin-bottom: 4.42%; } .top-infocard-subtitle{ font-weight: 400; display: flex; justify-content: center; font-size: 32px; } .top-infocard-title{ display: flex; justify-content: center; margin-bottom: 3.66%; font-weight: 500; font-size: 48px; } .top-infocard-description{ font-size: 16px; line-height: 24px; } .top-infocard-image{ width: 16.6%; } .top-cards{ display: flex; justify-content: center; align-self: center; margin-bottom: 4.2%; gap: 2%; } .card-imgs{ width: 37.6%; } .top-card-images{ display: flex; justify-content: center; padding-bottom: 10%; } .top-card{ box-shadow: 0 4px 20px rgba(0, 0, 0, 0.23); width: 18.4%; padding: 2%; } .top-card-description{ text-align: center; } .middle-banners{ background-color: #E0E0E0; } .middle-banners-content{ display: flex; justify-content: center; position: relative; top: 6.4vmin; } .banner-list{ display: flex; list-style: none; } .banner-list-space{ margin-right: 4vmin } .middle-banners-imgs{ width: 100%; } .image-height{ width: 57.8vmin; }