.featured-page-2 { position: relative; .featured-page { width: 41%; display: inline-block; margin-right: 114px; padding-bottom: 180px; position: relative; p { font-weight: 400; @include font-size(1.7); display: inline; line-height: 1.9; opacity: 0.8; } &:before { content: attr(data-line); position: absolute; top: -41px; left: 65px; right: 0; bottom: 0; width: 0; height: 0; z-index: -1; opacity: 0.05; @include font-size(40); font-weight: 100; color: $color__black; } } .featured-page__continue { text-transform: uppercase; font-weight: 600; @include font-size(1.7); margin-left: 10px; letter-spacing: 0.05em; &:after { content: '\f0da'; @include fa-icon(); margin-left: 8px; } } .featured-page__title { margin-top: 200px; margin-bottom: 15px; } img { width: 49%; object-fit: cover; border: 7px solid #fff; box-shadow: 1px 0 36px rgba(0,0,0,0.15); margin-top: -160px; } } @media (max-width: 1279px) { .featured-page-2 { img { width: 42%; } } } @media (max-width: 991px) { .featured-page-2 { .featured-page { width: 98%; margin-left: 2%; display: block; margin-bottom: 40px; &:before { display: none; } } .featured-page__title { margin-top: 100px; h3 { padding-top: 0px; } } img { width: 94%; margin-left: 2%; margin-bottom: 100px; } } } @media (max-width: 480px) { .featured-page-2 { .featured-page__title { margin-top: 30px; } h3 { @include font-size(3.2); } .featured-page__title { padding-top: 10px; } .page-2__continue { @include font-size(1.5); } } .featured-page-2.featured-page-2 { p { @include font-size(1.4); } } }