<div class="parallax-img h-100" style="background-image: url('img/img_parallax.jpg'); height: 900px;"></div>

        <div class="h-50 bg-color-gradient center d-flex flex-column justify-content-center">
            <h1 class="white">parallax</h1>
            Scroll Up and Down this page to see the parallax scrolling effect.
            This div is just here to enable scrolling.
            Tip: Try to remove the background-attachment property to remove the scrolling effect.
        </div>

        <div class="parallax-img h-100"></div>



<!-- Use specific length if the page is very long example 400px -->

        <div class="parallax-img" style="background-image: url('img/img_parallax.jpg'); height: 400px;"></div>

        <div class="bg-color-gradient center d-flex flex-column justify-content-center" style="height: 500px;">
            <h1 class="white">parallax</h1>
            Scroll Up and Down this page to see the parallax scrolling effect.
            This div is just here to enable scrolling.
            Tip: Try to remove the background-attachment property to remove the scrolling effect.
        </div>

        <div class="parallax-img" style="height: 400px;"></div>