Talon: Portfolio; style 2 overlay


#1

Hi, is there a way to reduce the overlay effect, or ideally have the overlay only cover the lower half of the portfolio item block? https://www.facetlifesciences.com/draft-services/
Thanks!


#2

Hello there,

If I got it right, I’d have to add this CSS code to Appearance > Customize > Additional CSS from dashboard.

    .portfolio-section.style2 .portfolio-item > a::before {
      background-color: transparent; 
      background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.98) 98%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
      background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(0,0,0,0.98) 98%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(0,0,0,0.98) 98%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#000000',GradientType=0 ); /* IE6-9 */ 
      height: 27%;
      top: auto;
      bottom: 0;
    }

Regards,
Kharis


#3

This is so much better! Really very nice! Thanks!


#4

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis