{% 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 %}