*{ margin: 0; padding: 0; box-sizing: border-box; } body{ font-family: 'Inter', sans-serif; color: #000000; } .page-header{ display: flex; justify-content: center; background: #000000; padding: 29px 0; } .header-logo{ display: block; } .main-banner{ width: 100%; display: block; } .top-infocard{ display:flex; justify-content: center; align-items: center; margin-top: 73px; } .top-infocard-text{ width: 100%; max-width: 766px; } .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: 24px; } .top-infocard-description{ font-weight: 400; font-size: 16px; line-height: 24px; margin-top: 28px; } .top-infocard-image{ display: flex; justify-content: center; margin: 73px 0 178px; } /*MEDIAS*/ @media screen and (max-width:414px) { .main-banner-desktop{ display: none; } .top-infocard-subtitle{ font-size: 20px; line-height: 24px; } .top-infocard-title{ font-size: 28px; line-height: 34px; } .top-infocard-description{ font-size: 16px; line-height: 24px; margin: 0 28px; text-align: center; } .top-infocard-image{ margin: 65px 0 90px; } .top-infocard-img{ width: 239px; height: 239px; } } @media screen and (min-width: 415px) and (max-width: 899px) { .top-infocard-subtitle{ font-size: 20px; line-height: 24px; } .top-infocard-title{ font-size: 28px; line-height: 34px; } .top-infocard-description{ font-size: 16px; line-height: 24px; margin: 0 28px; text-align: center; } .top-infocard-image{ margin: 73px 0 90px; } } @media screen and (min-width: 3000px) and (max-width: 4000px) { .header-logo{ width: 470px; height: 88px; } .main-banner{ display: block; } .top-infocard-text{ width: 1915px; height: 418px; max-width: 100%; margin-top: 152px; } .top-infocard-subtitle{ font-size: 66px; line-height: 70px; } .top-infocard-title{ font-size: 100px; line-height: 120px; } .top-infocard-description{ font-size: 40px; line-height: 44px; margin: 28px; text-align: center; } .top-infocard-image{ margin: 73px 0 90px; } .top-infocard-img{ width: 656px; height: 656px; margin-top: 152px; } } @media screen and (min-width: 415px){ .main-banner-mobile{ display: none; } }