.home { padding: 80px 0px; text-align: right; color: $main-dark-color; background: #f2f2f3; &__title { float: right; text-transform: uppercase; text-decoration: underline; h1 { margin-top: 0px; } } &__description { float: left; padding: 30px 0px; font-family: $AkzidenzGroteskStd-Regular; span { font-family: $AksidenzGroteskStd-Bold; } } .home1 { float: right; width: 50%; .home__description { width: 80%; float: right; } } .home2 { float: left; width: 50%; } } @media all and(max-width: $desktop-sm) { .home { .home1, .home2 { padding: 0 20px; } } } @media all and(max-width: $tablet) { .home { .home1 { text-align: left; float: left; width: 100%; padding: 0 20px; .home__description { width: 100%; } } .home2 { float: right; width: 100%; padding: 0; img { width: 100%; } } } }