Hi Marco - I found this bit of code on Stack Overflow that worked for me: http://stackoverflow.com/questions/16…

Here’s a sample page I threw it up on: http://unbounce.quinnomori.com/gradie…

And here’s the code that I put in my css panel in Unbounce:

#lp-pom-block-8{ <br /> background: -moz-linear-gradient(top, rgba(255,255,255,255) 0%, rgba(0,0,0,0) 59%, rgba(0,0,0,0.65) 100%), url('https://dl.dropboxusercontent.com/u/5049340/office%402x.png') no-repeat; <br /> background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,255)), color-stop(59%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.65))), url('https://dl.dropboxusercontent.com/u/5049340/office%402x.png') no-repeat; <br /> background: -webkit-linear-gradient(top, rgba(255,255,255,255) 0%,rgba(0,0,0,0) 59%,rgba(0,0,0,0.65) 100%), url('https://dl.dropboxusercontent.com/u/5049340/office%402x.png') no-repeat; <br /> background: -o-linear-gradient(top, rgba(255,255,255,255) 0%,rgba(0,0,0,0) 59%,rgba(0,0,0,0.65) 100%), url('https://dl.dropboxusercontent.com/u/5049340/office%402x.png') no-repeat; <br /> background: -ms-linear-gradient(top, rgba(255,255,255,255) 0%,rgba(0,0,0,0) 59%,rgba(0,0,0,0.65) 100%), url('https://dl.dropboxusercontent.com/u/5049340/office%402x.png') no-repeat; <br /> background: linear-gradient(to bottom, rgba(255,255,255,255) 0%,rgba(0,0,0,0) 59%,rgba(0,0,0,0.65) 100%), url('https://dl.dropboxusercontent.com/u/5049340/office%402x.png') no-repeat; <br /> } <br /> </style>   

You’ll need to adjust the rgba settings to match those hex colours you wanted to use and tweak the gradient fade % values, but this should work.

The reason there’s so many different background calls is for cross browser compatibility–gradient support isn’t very consistent yet.