Social Grid overlay on mobile

[Mike Mancini]

I have a problem on mobile when scrolling through the Social Grid/Instagram section. Every time you touch the screen to scroll the SG overlay comes on and the pic looks awful. I need to turn off the overlay (keep the text and instagram icon) on mobile only. BTW the theme is awesome!

-Thanks

[Kyle – SUPPORT]

Hi

Try adding this to your custom css:

@media only screen and (max-width: 767px) { 
.blog-grid-items .instagram-item:hover .inst-overlay {
  background: transparent!important;
}
}

– Kyle

[Mike Mancini]

Hi Kyle,

That seems to work but I am getting a caution in custom css (see pics).

-Thanks

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Ignore that, it’s just the editor. It’s not recommend to use !important when you don’t need to, however in this case you need it

– Kyle

[Mike Mancini]

Thanks Kyle! Also why the double }} at end?

[Kyle – SUPPORT]

One’s to close the media query and the other is to close the CSS rule

– Kyle

[Mike Mancini]

-Thanks

[Kyle – SUPPORT]

No problem