.sticky-testimonials {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
position: relative;
}
.sticky-column {
height: 100%;
}
.sticky-content{
height: 100vh;
position: sticky;
top:0;
}
.sticky-content .title-box{
position: relative;
top: 50%;
transform: translateY(-25%);
width: 80%;
padding: 0 10%;
text-align: left;
}
.sticky-content .title-box h3{
color: var(--wp--preset--color--neutral-light);
}
.testimonials-column {
overflow: auto;
scroll-snap-type: y mandatory;
-webkit-overflow-scrolling: touch;
padding: 2rem 0;
}
.testimonial {
height: 100vh;
padding: 2rem;
display: flex;
flex-direction: column;
justify-content: center;
align-items: left;
scroll-snap-align: start;
}
.testimonial-content {
margin-bottom: 1rem;
font-size: 1.1em;
line-height: 1.6;
max-width: 80%;
text-align: left;
}
.testimonial-author {
font-weight: 500;
font-size: var(--wp--preset--font-size--medium);
color: var(--wp--preset--color--neutral-dark);
}
@media (max-width: 850px) {
.sticky-testimonials {
grid-template-columns: 1fr;
}
.sticky-content {
position: relative;
}
.sticky-content .title-box{
position: relative;
top: 50%;
transform: translateY(-25%);
width: 90%;
padding: 0 5%;
text-align: left;
}
.testimonials-column {
height: auto;
max-height: auto;
}
.testimonial {
height: auto;
}
}