.about{ &-header-background{ display: flex; flex-shrink: 0; background: linear-gradient(to top, #f1f5fb, #f9fcff); &-content{ display: flex; flex-basis: 721px; padding: 196px 40px 160px; margin: 0 auto; h1 { display: flex; margin-top: 40px; font-size: 30px; font-weight: 500; color: #12183a; flex: 1; flex-direction: column; span { display: flex; font-size: 15px; margin-top: 10px; color: #898F9F; } } img { display: flex; flex: 0; width: 88px; height: 88px; border-radius: 50%; margin-top: 30px; margin-right: 30px; } } } &-content{ .content-style(); &-info { width: 100%; box-sizing: border-box; padding: 60px 150px; transition: all 0.4s ease-in-out; p { font-size: 1.55rem; margin-bottom: 20px; font-weight: 500; line-height: 1.2; margin-top: 20px; } } img { display: flex; width: 100%; height: 100%; } } } @media screen and (max-width: 800px) { .about{ &-content { &-info { padding: 40px 50px; } } } } @media screen and (max-width: 600px) { .about{ &-content { &-info { padding: 40px 20px; } } } }