you'll need to use this CSS instead:
html.no-touchevents .lay-text-on-element-dark-gradient,
html.no-touchevents .lay-text-on-element-overlay{
opacity: 0;
transition: opacity 300ms ease;
}
html.no-touchevents .col:hover .lay-text-on-element-dark-gradient,
html.no-touchevents .col:hover .lay-text-on-element-overlay{
opacity: 1;
}
if you want this without the fade animation:
html.no-touchevents .lay-text-on-element-dark-gradient,
html.no-touchevents .lay-text-on-element-overlay{
opacity: 0;
}
html.no-touchevents .col:hover .lay-text-on-element-dark-gradient,
html.no-touchevents .col:hover .lay-text-on-element-overlay{
opacity: 1;
}
there is no mouseover image functionality for images and no easy way to do this with custom css, but i wrote it down as an idea