{% if page.jumbotron.slider %} <div class=“jumbotron jumbotron-fluid background_image slider {% if page.jumbotron.class %}{{page.jumbotron.class}}{% endif %}”>

<div id="jumbotron-slider" class="owl-carousel owl-theme full-width-slider">
    {% for slide in page.jumbotron.slider %}
    <div class="item d-flex align-items-center owl-slide {% if forloop.first %}active{% endif %}">
         {% if slide.image %}
            {% assign image_path = slide.image %}
            {% picture header_slider_image {{image_path}} %}
        {% endif %}
        <div class="container {% if page.jumbotron.inner_class %}{{page.jumbotron.inner_class}}{% endif %}">
            <div class="inner_content_wrapper">
            {% if slide.inner-image %}
                <img class="d-inline-block lazyload"
                    src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
                    data-src="{{slide.inner-image}}" alt="Slide {{forloop.index}} inner image" />
            {% endif %}
            {% if slide.title %}
                <h1 class=" {% if slide.title-class %}{{slide.title-class}}{% endif %}">
                    {{slide.title}}</h1>
            {% endif %}
            {% if slide.description %}
                <p class="lead {% if slide.desciption-class %} {{slide.description-class}}{% endif %}">
                    {{slide.description}}
                </p>
            {% endif %}
            {% if slide.buttons %}
                <p class="lead">
                    {% for button in slide.buttons %}
                    <a href="{{button.url}}" class="btn btn-primary {% if button.class %}{{button.class}}{% endif %}">
                        {{button.title}} {% if button.icon %}<i class="{{button.icon}}"></i>{% endif %}
                    </a>
                    {% endfor %}
                </p>
            {% endif %}
            </div>
        </div>
    </div>
    {% endfor %}
</div>

</div> {% else %} <div class=“jumbotron d-flex align-items-center jumbotron-fluid {% if page.jumbotron.video %}video{% endif %} {% if page.jumbotron.image %}background_image{% endif%} {% if page.jumbotron.class %}{{page.jumbotron.class}}{% endif %}”>

{% if page.jumbotron.image %}
    {% assign image_path = page.jumbotron.image %}
    {% picture header_image {{image_path}} %}
{% endif %}
{% if page.jumbotron.video %}
    <video autoplay muted preload="none" poster="{{page.jumbotron.video.poster}}" playsinline loop id="jumbotronVideo">
        {% if page.jumbotron.video.source.mp4 %}
        <source src="{{page.jumbotron.video.source.mp4}}" type="video/mp4">
        {% endif %}
        {% if page.jumbotron.video.source.ogg %}
        <source src="{{page.jumbotron.video.source.ogg}}" type="video/ogg">
        {% endif %}
        {% if page.jumbotron.video.source.webm %}
        <source src="{{page.jumbotron.video.source.webm}}" type="video/webm">
        {% endif %}
    </video>
{% endif %}
<div class="container {% if page.jumbotron.inner_class %}{{page.jumbotron.inner_class}}{% endif %}">
        <div class="inner_content_wrapper">
        <h1 class="">{{page.jumbotron.title}}</h1>
        {% if page.jumbotron.description %}
        <p class="lead">
            {{page.jumbotron.description }}
        </p>
        {% endif %}
        {% if page.jumbotron.buttons %}
        <p class="lead">
            {% for button in page.jumbotron.buttons %}
                {% include flow/button.html object=button %}
            {% endfor %}
        </p>
        {% endif %}
    </div>
</div>

</div> {% endif %}