Site URL: http://www.planetcreative.co
Hello!
I've used CSS to create a hover effect for desktop over poster images using this CSS:
@media only screen and (min-width:834px) {
.design-layout-poster .image-card-wrapper {
visibility: hidden;
opacity: 0;
transition-duration: 1s;
}
.design-layout-poster:hover .image-card-wrapper {
visibility: visible;
opacity: 1;
background-color: hsla(231, 35%, 52%, 1)
}
}
.image-block-poster-text-alignment-left .sqs-block-image .design-layout-poster .image-card > * {
text-align: center !important;
}
I'm trying to remove the text on mobile (it is just centered text with no hover effect on mobile). Can someone please help me write code for removing that centered text on the mobile version? Thank you!