CodePen

HTML

            
              %span.cats
            
          
!

CSS

            
              .cats {
  display: block;
  width: 400px;
  height: 200px;
  background: url('http://lorempixel.com/400/200/cats') no-repeat;
}

.cats:after {
  content: " ";
  width: 400px;
  height: 200px;
  position: fixed;
  z-index: 1;
  @include background-image(linear-gradient(left top, rgba(239,255,145,0.2) 0%,rgba(108,166,128,0.7) 100%));
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................