Hero video player

    <!--::Begin Page hero Media Player::-->
    <section class="position-relative bg-gradient-blur">
        <div class="container position-relative pt-12 pb-0">
            <div class="row pt-lg-5">
                <div class="col-lg-10 text-center mx-lg-auto">
                    <!--:Heading:-->
                    <h1 class="display-2 mb-4">Hero video player</h1>
                    <!--:Subheading:-->
                    <p class="mb-5 lead">Building a stunning website is easy</p>
                    <div class="mb-7">
                        <a href="#!" class="btn btn-lg px-4 px-lg-5 rounded-pill btn-primary">Get started
                            today</a>
                    </div>
                    <!--:Video Player:-->
                    <div class="position-relative overflow-hidden">
                        <div class="player" data-plyr-provider="vimeo" data-plyr-embed-id="167338879"></div>
                    </div>
                </div>
            </div>
        </div>
        <!--:Divider Shape:-->
        <svg class="position-absolute start-0 bottom-0" style="color: var(--bs-body-bg);"
            preserveAspectRatio="none" width="100%" height="96" viewBox="0 0 1460 120" fill="none"
            xmlns="http://www.w3.org/2000/svg">
            <path
                d="M122 22.8261L0 0V120H1460V0L1338 22.8261C1217 44.1304 973 88.2609 730 88.2609C487 88.2609 243 44.1304 122 22.8261Z"
                fill="currentColor"></path>
        </svg>
    </section>
    <!--::/End Page hero Media Player::-->