<!--Parallax elements hero-->
<section class="position-relative overflow-hidden vh-100 d-flex align-items-center bg-gradient-blur">
<!--Parallax-image-->
<div class="position-absolute rotate-3 end-0 top-50 me-5 me-lg-12 width-12x h-auto">
 <img src="assets/img/960x1140/4.jpg" data-rellax-speed="4" data-rellax-percentage=".85" class="img-fluid rounded-5 bg-warning rellax">
</div>

<!--Parallax-image-->
<div class="position-absolute rotate-n3 start-0 bottom-0 mb-12 ms-4 ms-lg-7 width-13x h-auto">
 <img src="assets/img/960x1140/2.jpg" data-rellax-speed="-4" data-rellax-percentage=".85" class="img-fluid rounded-5 bg-warning rellax">
</div>
    <div class="container position-relative py-5">
        <div class="row">
            <div class="col-xl-7 col-lg-10 mx-auto text-center">
                <!--Hero heading-->
                <h1 class="display-3 mb-4">Parallax elements hero example
                <!--Hero Subheading-->
                <p class="lead mb-5">Build a stunning website that attract visitors

                <!--Hero action button-->
                <a href="#next" class="btn btn-primary btn-lg">
                    Get started
                </a>
      </div>
   </div>
  <!--/.row-->
 </div>
 <!--/.content-->
</section>