body{ font-family: 'Inter', sans-serif; background-color: #BFE3FF; } .main{ background-image:url('../img/Intro_img.jpg'); background-repeat: no-repeat; background-size:cover; height: 100vh; width: 100%; display: flex; align-items: center; margin-top: 124px; } .intro_wrapper{ display: flex; justify-content: right; min-height: 240px; } .intro_block{ width: 553px; } .intro_title{ font-size: 60px; font-weight: 700; margin: 0 0 29px 0; } .intro_text{ font-size: 20px; margin: 0; } .footer{ background-color: #D7DDE1; height: 57px; display:flex; align-items: center; } .footer_wrapper{ display: flex; align-items: center; justify-content: space-between; } .nav_foot{ margin-right: 8px; text-decoration: none; } .mail_line_phone{ font-size: 20px; font-weight: 400; color: #000000; text-decoration: none; margin-left: 31px; margin-bottom: -5px; transition: color .2s ease; } .mail_line_phone:first-child{ margin-left: 0; } .mail_line_phone:hover{ color:gray; } @media (max-width:768px){ .intro_wrapper{ justify-content: center; } .intro_block{ width: 400px; color: #D3C9AE; } .intro_title{ font-size: 45px; } .intro_text{ font-size: 16px; } .footer{ height: 80px; } .footer_wrapper{ display: block; } .nav_mail_line_phone{ margin-top: 10px; } } @media (max-width:473px){ .nav_mail_line_phone{ margin-top: 10px; } .mail_line_phone{ font-size: 16px; } } @media (max-width:450px){ .intro_title{ font-size: 30px; } .intro_text{ font-size: 10px; } } @media (max-width:397px){ .intro_block{ width: 300px; color: #D3C9AE; } .intro_title{ font-size: 35px; } .intro_text{ font-size: 13px; } .mail_line_phone{ margin-left: 0; } } @media (max-width:334px){ .mail_line_phone{ display: flex; flex-direction: column; } #line{ display: none; } } @media (max-width:300px){ .intro_block{ width: 200px; color: #D3C9AE; } .intro_title{ font-size: 35px; } .intro_text{ font-size: 13px; } } @media (max-width:240px){ .intro_block{ width: 200px; color: #D3C9AE; } .intro_title{ font-size: 35px; } .intro_text{ font-size: 13px; } } @media (max-height:450px){ .intro_block{ margin-top: 50px; } .intro_title{ font-size: 30px; } .intro_text{ font-size: 10px; } }