{% macro VSL(title, videoHasCustomPlay, image_placeholder, image_placeholderAlt, videoID, className, mutedAndAutoPlay, videoSrc, path = global.path) %}
    <section id="testimonials" class="vsl">
        <div class="container">
            {% if title != '' %}
                <h3 class="vsl__title">{{title}}</h3>
            {% endif %}

            <div class='video {% if videoHasCustomPlay == "true" %}custom-play{% endif %}'>
                <picture>
                    <source type="image/webp" src="{{path}}/{{image_placeholder}}.webp?format=webp">
                    <source type="image" src="{{path}}/{{image_placeholder}}?format=webp">
                    <img class="video__placeholder" src="{{path}}/{{image_placeholder}}?format=webp" alt="{{image_placeholderAlt}}">
                </picture>
                <video-js id='{{videoID}}' class='video-js vjs-big-play-centered {% if className != "" %} {{className}}  {% endif %}'
                poster='{{path}}/{{image_placeholder}}'
                data-setup='{ "controls": true, "preload": "auto" {% if mutedAndAutoPlay == "true" %} , "muted": true, "autoplay":  true {% endif %}}'>
                    <source src="{{path}}/{{videoSrc}}" type='video/mp4'>
                </video-js>
            </div>
        </div>
    </section>
{% endmacro %}