Site URL: https://www.myontrackrealty.com/home-in-dallas-texas-testing
Hey guys, on this page right here, on mobile, it shows the slideshow at the bottom (testimonial slideshow) but the text won't show all the way and then strangely moves around on the following slides. I have this in CSS custom. In fact, I have this for the whole page for the desktop version of the slideshow and the mobile.
Any help on the mobile part getting fixed please?
/* slider with text overlay */
.sqs-block-gallery .sqs-gallery-block-slideshow {
max-height: 500px !important;
.sqs-gallery-design-stacked-slide {
max-height: 500px !important;
overflow: hidden;
img {
transition: Slide 300ms !important;
}
}
.meta {
background-color: transparent;
max-width: 100% !important;
transition: Slide 700ms !important;
-webkit-transition: Slide 700ms !important;
-moz-transition: Slide 700ms !important;
-ms-transition: Slide 700ms !important;
}
.meta-title {
text-align: center;
font-size: 20px;
text-transform: uppercase;
letter-spacing: 2px;
padding: 6px 20px;
color: #042663;
}
.meta-description p {
text-align: center;
color: #ffffff;
font-size: 22px;
letter-spacing: 1px;
padding-top: 4px;
max-width: 550px;
}
.meta-description a:link {
color: #9DB0D8;
text-align: center !important;
}
.sqs-gallery-design-stacked-slide:hover {
img {
-webkit-filter: blur(3px);
filter: blur(3px);
}
}
}
@media screen and (max-width:480px) {
/* Show description */
.sqs-gallery-block-slideshow .meta {
display: block !important;
}
/* Font size */
.sqs-gallery-block-slideshow .meta * {
font-size: 8px !important;
}
}
Thank you so much! This was perfect and it did it!
