@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap'); *{ margin: 0; padding: 0; } html, body{ box-sizing: border-box; font-family: 'Inter', sans-serif; color: black; } .header{ background: black; display: flex; justify-content: center; padding: 28px 0; } .imgLogoM3{ display: block; } .main-banner{ width: 100%; display: block; } /*---------------------------------------------------------------------------------------*/ .top-infocard{ display: flex; align-items: center; justify-content: center; margin-top: 80px; margin-bottom: 95px; } .top-infocard-text{ max-width: 766px; margin-right: 124px; } .top-infocard-subtitle{ font-weight: 400; font-size: 32px; text-transform: uppercase; } .top-infocard-title{ font-weight: 500; font-size: 48px; text-transform: uppercase; } .top-infocard-description{ font-weight: 400; font-size: 16px; margin-top: 24px; } /*-------------------------------------------------------------------*/ @media screen and (max-width: 1024px) { .main-banner-desktop{ display: none; } .top-infocard{ flex-direction: column; margin-top: 54px; margin-left: 31px; margin-right: 26px; } .top-infocard-text{ margin: 0 0 68px; } .top-infocard-subtitle{ font-weight: 400; font-size: 20px; } .top-infocard-title{ font-weight: 500; font-size: 28px; } .top-infocard-description{ font-weight: 400; font-size: 16px; margin-top: 19px; } .top-infocard-img{ margin: 0 86px 0 86px; max-width: 240px; } } @media screen and (min-width: 1025px) { .main-banner-mobile{ display: none; } } @media screen and (min-width: 1026px) and (max-width: 1220px){ .top-infocard-text{ max-width: 550px; margin-right: 70px; } } @media screen and (min-width: 2500px) { .top-infocard-subtitle{ font-weight: 400; font-size: 60px; } .top-infocard-title{ font-weight: 500; font-size: 96px; } .top-infocard-description{ font-weight: 400; font-size: 32px; } .top-infocard-text{ max-width: 45%; margin-right: 70px; } }