.header { position: relative; padding-top: 60px; // space for absolute menu // background background: url('../img/photo1.jpg') no-repeat center bottom; background-size: cover; // color overlay &:before { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; bottom: 0; right: 0; //background: $brand-main-brown; background: linear-gradient(to top left, $brand-main-blue 0%, $brand-main-brown 100%); opacity: .7; z-index: 0; } } .header__title { position: relative; z-index: 1; color: #fff; text-align: center; margin: 0; padding: ($spacer * 4) 0; }