.svgMask { position: relative; .rang { position: absolute; top: 0; left: 0; width: 100%; height: 250px; z-index: 10; svg { width: 100%; height: inherit; text { text-anchor: middle; } .svgDemo { &_rect { fill: darken( #fff, 60%); } &_tit { letter-spacing: -2px; font-size: 6em; font-weight: 800; } &_subtit { letter-spacing: 8px; font-size: 1.2em; font-weight: 300; text-transform: uppercase; } } .down { fill: #000; mask: url(#svgDemo) } } } .intro { position: relative; background: url('./img/amazon_view.jpg'); background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; min-height: 100vh; } }