
.sliding-text {
    padding: 0;
    display: flex;
    flex-direction: column;
    height: calc(var(--wp--preset--font-size--xx-large) + 1em);
    overflow: hidden;
    margin-top: .25em;
 }
 
 .sliding-text span {
    font-family: var(--wp--preset--font-family--heading);
    font-size: var(--wp--preset--font-size--xx-large);
    font-weight: 300;
    animation: slideText 6s infinite;
    line-height: 1.3;
 }
 
 @keyframes slideText {
    25% {transform: translateY(-100%);}
    50% {transform: translateY(-200%);}
    75% {transform: translateY(-300%);}
    100% {transform: translateY(-400%);}
 }

 @media only screen and (max-width: 521px) {

    .sliding-text {
        height: var(--wp--preset--font-size--xx-large);
     }
     
    .sliding-text span {
        font-size: calc(var(--wp--preset--font-size--xx-large) - .5em);
    }

    .hero-banner-with-video .introduction {
        padding: 1em;
    }
}
