.atlantis { .template { &-hero { &-pattern { width: 50rem; height: auto; position: absolute; bottom: -7rem; left: -7rem; z-index: 6; } &-dashboard1, &-dashboard2{ border-radius: 1.12rem; } } } } @media only screen and (max-width: 1200px) { .atlantis { .template{ &-hero { &-pattern { width: 45rem; bottom: -5.75rem; left: -9.5rem; } } } } } @media only screen and (max-width: 768px) { .atlantis { .template{ &-hero { &-pattern { width: 50rem; bottom: 16.75rem; left: -10.5rem; } } } } }