@charset "UTF-8"; *{ margin: 0; padding: 0; box-sizing: border-box; } body{ font-family: 'Inter', sans-serif; color: black; } .page-header{ display: flex; justify-content: center; background-color: black; padding: 28px 0; } .header-logo{ display: block; } .main-banner-desktop{ width: 100%; } .top-infocard{ display: flex; align-items: center; justify-content: center; padding: 80px 0 96px; } .infocard-image{ display: flex; align-items: center; justify-content: center; padding: 80px 0 96px; } .top-infocard-text{ max-width: 766px; margin-right: 124px; } .top-infocard-subtitle{ display: flex; justify-content: center; font-weight: 400; font-size: 32px; line-height: 39px; text-transform: uppercase; } .top-infocard-title{ display: flex; justify-content: center; font-weight: 500; font-size: 48px; line-height: 58px; text-transform: uppercase; margin-bottom: 28px; } .top-infocard-description{ display: flex; justify-content: center; font-size: 16px; line-height: 24px; padding: 0px 0px 73px; } @media screen and (max-width: 414px) { .main-banner-desktop{ display: none; } .main-banner-mobile{ width: 100%; } } @media screen and (max-width: 768px) { .top-infocard{ padding: 84px 28px 158px; flex-direction: column; } .top-infocard-text{ margin: 0 0 68px; } .top-infocard-subtitle{ font-size: 20px; } .top-infocard-title{ font-size: 28px; } .top-infocard-image{ width: 100%; max-width: 240px; } } @media screen and (min-width: 415px) { .main-banner-mobile{ display: none; } }