Background
Image / Video
Background parallax
Heading
HTML
<div class="bg-parallax have-overlay position-relative d-flex align-items-end"
style="background-image: url('static/image/bg.jpg');min-height: 300px;">
<div class="position-relative z-1 p-5">
<h3 class="text-white">Heading</h3>
</div>
</div>
Background image
HTML
<div class="bg-image have-overlay position-relative d-flex align-items-end"
style="background-image: url('static/image/bg.jpg');min-height: 300px;">
<div class="position-relative z-1 p-5">
<h3 class="text-white">Heading</h3>
</div>
</div>
Background Video
HTML
<div class="position-relative have-overlay" data-vbg="#" style="min-height: 300px;">
<div class="position-absolute start-0 bottom-0 z-1 p-5">
<h3 class="text-white">Heading</h3>
</div>
</div>