.wp-block-verse {
    white-space: pre !important;

    height: auto !important;
    max-height: none !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    overflow-wrap: normal !important;
    word-break: normal !important;

    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.wp-block-verse::-webkit-scrollbar {
    display: none;
}
@media (max-width: 768px) {

    .scroll-poem.wp-block-verse {
        position: relative;

        white-space: pre !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;

        height: auto !important;
        max-height: none !important;

        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
.scroll-poem.wp-block-verse {
    position: relative;
}

.scroll-poem.wp-block-verse::before {
    content: "swipe →";
    position: absolute;
    top: 0.4rem;
    right: 0.6rem;

    font-size: 0.7rem;
    opacity: 0.4;
    pointer-events: none;
}

.scroll-poem.wp-block-verse::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 2.5rem;
    height: 100%;
    pointer-events: none;
	z-index:2;
    background: linear-gradient(to right, rgba(255,255,255,0), rgba(244,239,230,1));
}
}

@media (max-width: 768px) {


    .scroll-poem-wrapper {
        position: relative;
        max-width: 100%;
    }

    .scroll-poem-wrapper .wp-block-verse {
        white-space: pre !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        display: block;
        max-width: 100%;

        height: auto !important;
        max-height: none !important;

        -webkit-overflow-scrolling: touch;

        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .scroll-poem-wrapper .wp-block-verse::-webkit-scrollbar {
        display: none;
    }

    .scroll-poem-wrapper::before {
        content: "swipe →";
        position: absolute;
        top: 0.4rem;
        right: 0.6rem;

        font-size: 0.75rem;
        opacity: 0.5;
        font-style: italic;

        pointer-events: none;
        z-index: 20;
    }

    .scroll-poem-wrapper::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;

        width: 2rem;
        height: 100%;

        pointer-events: none;
        z-index: 10;

        background: linear-gradient(
            to right,
            rgba(255,255,255,0),
            rgba(244,239,230,1)
        );
    }
}
}