CodePen

HTML

            
              %span.cats
            
          
!

CSS

            
              @import "compass/css3";

.cats {
  margin: 0 auto;
  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%));
}
            
          
!

JavaScript

            
              
            
          
!
999px
Loading ..................