<li class="pi-draggable active" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3">
        <div class="container">
            <div class="row">
                <div class="col-md-6 p-4">
                    <h4> <b>#1</b> </h4>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot.</p>
                </div>
                <div class="col-md-6 p-4">
                    <h4> <b>#2</b> </h4>
                    <p>Which was created for the bliss of souls like mine. I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke.</p>
                </div>
                <div class="col-md-6 p-4">
                    <h4> <b>#3</b> </h4>
                    <p>At the present moment; and yet I feel that I never was a greater artist than now. When, while the lovely valley teems with vapour around me, and the meridian sun strikes the upper surface of the impenetrable foliage.</p>
                </div>
                <div class="col-md-6 p-4">
                    <h4> <b>#4</b> </h4>
                    <p>My trees, and but a few stray gleams steal into the inner sanctuary, I throw myself down among the tall grass by the trickling stream; and, as I lie close to the earth, a thousand unknown plants are noticed by me. </p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3 text-center">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-md-6 p-4">
                    <h4> <b>#1</b> </h4>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <h4> <b>#2</b> </h4>
                    <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend.</p>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <h4> <b>#3</b> </h4>
                    <p>So absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke.</p>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <h4> <b>#4</b> </h4>
                    <p>At the present moment and yet I feel that I never was a greater artist than now. When, while the lovely valley teems with vapour around me.</p>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <h4> <b>#5</b> </h4>
                    <p>And the meridian sun strikes the upper surface of the impenetrable foliage of my trees, and but a few stray gleams steal into the inner sanctuary.</p>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <h4> <b>#6</b> </h4>
                    <p>I throw myself down among the tall grass by the trickling stream; and, as I lie close to the earth, a thousand unknown plants are noticed by me.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3">
        <div class="container">
            <div class="row">
                <div class="col-lg-3 col-md-6 p-4">
                    <h4> <b>#1</b> </h4>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings.</p>
                </div>
                <div class="col-lg-3 col-md-6 p-4">
                    <h4> <b>#2</b> </h4>
                    <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss.</p>
                </div>
                <div class="col-lg-3 col-md-6 p-4">
                    <h4> <b>#3</b> </h4>
                    <p>So absorbed in the exquisite sense of mere tranquil existence.</p>
                </div>
                <div class="col-lg-3 col-md-6 p-4">
                    <h4> <b>#4</b> </h4>
                    <p>At the present moment and yet I feel that I never was a greater artist than now.</p>
                </div>
                <div class="col-lg-3 col-md-6 p-4">
                    <h4> <b>#5</b> </h4>
                    <p>And the meridian sun strikes the upper surface of the impenetrable foliage.</p>
                </div>
                <div class="col-lg-3 col-md-6 p-4">
                    <h4> <b>#6</b> </h4>
                    <p>I throw myself down among the tall grass by the trickling stream.</p>
                </div>
                <div class="col-lg-3 col-md-6 p-4">
                    <h4> <b>#7</b> </h4>
                    <p>And, as I lie close to the earth, a thousand unknown plants are noticed by me.</p>
                </div>
                <div class="col-lg-3 col-md-6 p-4">
                    <h4> <b>#8</b> </h4>
                    <p>When I hear the buzz of the little world among the stalks, and grow familiar.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3 text-center">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-5 col-md-6 p-4"> <i class="d-block fa fa-circle fa-3x mb-2 text-muted"></i>
                    <h4> <b>One</b> </h4>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                </div>
                <div class="col-lg-5 col-md-6 p-4"> <i class="d-block fa fa-circle-o fa-3x mb-2 text-muted"></i>
                    <h4> <b>Two</b> </h4>
                    <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3 text-center">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <h1>Mirror of the infinite</h1>
                </div>
            </div>
            <div class="row justify-content-center">
                <div class="col-md-4 p-4"> <i class="d-block fa fa-circle fa-3x mb-2 text-muted"></i>
                    <h4> <b>One</b> </h4>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                </div>
                <div class="col-md-4 col-6 p-4"> <i class="d-block fa fa-stop-circle-o fa-3x mb-2 text-muted"></i>
                    <h4> <b>Two</b> </h4>
                    <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend.</p>
                </div>
                <div class="col-md-4 col-6 p-4"> <i class="d-block fa fa-circle-o fa-3x mb-2 text-muted"></i>
                    <h4> <b>Three</b> </h4>
                    <p>I feel that I never was a greater artist than now. When, while the lovely valley teems with vapour around me.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3 text-center">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <h1>A thousand unknown plants</h1>
                </div>
            </div>
            <div class="row justify-content-center">
                <div class="col-lg-3 col-6 p-4"> <i class="d-block fa fa-circle fa-3x mb-2 text-muted"></i>
                    <h4> <b>One</b> </h4>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy.</p>
                </div>
                <div class="col-lg-3 col-6 p-4"> <i class="d-block fa fa-stop-circle-o fa-3x mb-2 text-muted"></i>
                    <h4> <b>Two</b> </h4>
                    <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine.</p>
                </div>
                <div class="col-lg-3 col-6 p-4"> <i class="d-block fa fa-stop-circle fa-3x mb-2 text-muted"></i>
                    <h4> <b>Three</b> </h4>
                    <p>I feel that I never was a greater artist than now. When, while the lovely valley teems with vapour around me.</p>
                </div>
                <div class="col-lg-3 col-6 p-4"> <i class="d-block fa fa-circle-o fa-3x mb-2 text-muted"></i>
                    <h4> <b>Four</b> </h4>
                    <p>Oh, would I could describe these conceptions, could impress upon paper all that is living so full.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3 text-center">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-3 col-6 p-4"> <i class="d-block fa fa-circle fa-3x mb-2 text-muted"></i>
                    <p class="lead">A wonderful serenity has taken possession.</p> <a class="btn btn-primary" href="#">Read</a> </div>
                <div class="col-lg-3 col-6 p-4"> <i class="d-block fa fa-stop-circle fa-3x mb-2 text-muted"></i>
                    <p class="lead">I am alone, and feel the charm of existence.</p> <a class="btn btn-primary" href="#">Read</a> </div>
                <div class="col-lg-3 col-6 p-4"> <i class="d-block fa fa-circle-o fa-3x mb-2 text-muted"></i>
                    <p class="lead">The lovely valley teems with vapour.</p> <a class="btn btn-primary" href="#">Read</a> </div>
                <div class="col-lg-3 col-6 p-4"> <i class="d-block fa fa-stop-circle-o fa-3x mb-2 text-muted"></i>
                    <p class="lead">Oh, would I could describe these.</p> <a class="btn btn-primary" href="#">Read</a> </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <h1>A wonderful serenity</h1>
                </div>
            </div>
            <div class="row justify-content-center">
                <div class="col-lg-4 col-md-6 p-4">
                    <div class="row">
                        <div class="col-3 p-0 d-flex align-items-center"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#1</b> </p>
                            <p class="mb-0">A wonderful serenity has taken possession of my entire soul.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <div class="row">
                        <div class="col-3 p-0 d-flex align-items-center"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-4.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#2</b> </p>
                            <p class="mb-0">I am alone, and feel the charm of existence in this spot.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <div class="row">
                        <div class="col-3 p-0 d-flex align-items-center"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#3</b> </p>
                            <p class="mb-0">I should be incapable of drawing a single stroke.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <div class="row">
                        <div class="col-3 p-0 d-flex align-items-center"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#4</b> </p>
                            <p class="mb-0">I throw myself down among the tall grass by the trickling stream.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <div class="row">
                        <div class="col-3 p-0 d-flex align-items-center"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#5</b> </p>
                            <p class="mb-0">I lie close to the earth, a thousand unknown plants.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 p-4">
                    <div class="row">
                        <div class="col-3 p-0 d-flex align-items-center"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-4.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#6</b> </p>
                            <p class="mb-0">When I hear the buzz of the little world among the stalks.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <h1>O my friend</h1>
                </div>
            </div>
            <div class="row justify-content-center">
                <div class="col-lg-3 col-md-6 p-3">
                    <div class="row">
                        <div class="col-3 p-0"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#1</b> </p>
                            <p class="mb-0">A wonderful serenity has taken possession of my entire soul.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 p-3">
                    <div class="row">
                        <div class="col-3 p-0"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-4.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#2</b> </p>
                            <p class="mb-0">I am alone, and feel the charm of existence in this spot.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 p-3">
                    <div class="row">
                        <div class="col-3 p-0"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#3</b> </p>
                            <p class="mb-0">I should be incapable of drawing a single stroke.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 p-3">
                    <div class="row">
                        <div class="col-3 p-0"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#4</b> </p>
                            <p class="mb-0">I throw myself down among the tall grass by the trickling stream.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 p-3">
                    <div class="row">
                        <div class="col-3 p-0"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#5</b> </p>
                            <p class="mb-0">I lie close to the earth, a thousand unknown plants.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 p-3">
                    <div class="row">
                        <div class="col-3 p-0"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-4.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#6</b> </p>
                            <p class="mb-0">When I hear the buzz of the little world among the stalks.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 p-3">
                    <div class="row">
                        <div class="col-3 p-0"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#7</b> </p>
                            <p class="mb-0">I feel the presence of the Almighty, who formed us in his own image.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 p-3">
                    <div class="row">
                        <div class="col-3 p-0"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg"> </div>
                        <div class="col-9">
                            <p class="lead mb-1"> <b>#8</b> </p>
                            <p class="mb-0">Oh, would I could describe these conceptions.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-4">
        <div class="container">
            <div class="row">
                <div class="col-md-4 col-6 p-3">
                    <h2 class="my-3"> <b>One&nbsp;</b> </h2>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                </div>
                <div class="col-md-4 col-6 p-3">
                    <h2 class="my-3"> <b>Two</b> </h2>
                    <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend.</p>
                </div>
                <div class="col-md-4 col-6 p-3">
                    <h2 class="my-3"> <b>Three</b> </h2>
                    <p>So absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-4">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 p-3 col-md-6">
                    <div class="card">
                        <div class="card-body p-4">
                            <h2> <b>One</b> </h2>
                            <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                            <p class="mb-0 lead"> <a href="#">Read more</a> </p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 p-3 col-md-6">
                    <div class="card">
                        <div class="card-body p-4">
                            <h2> <b>Two</b> </h2>
                            <p>I should be incapable of drawing a single stroke at the present moment; and yet I feel that I never was a greater artist than now.</p>
                            <p class="mb-0 lead"> <a href="#">Read more</a> </p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 p-3">
                    <div class="card">
                        <div class="card-body p-4">
                            <h2> <b>Three</b> </h2>
                            <p>I throw myself down among the tall grass by the trickling stream; and, as I lie close to the earth, a thousand unknown plants are noticed by me.</p>
                            <p class="mb-0 lead"> <a href="#">Read more</a> </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-4 text-center">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 p-3">
                    <div class="card">
                        <div class="card-body p-4"> <img class="img-fluid d-block mb-3 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg" width="150">
                            <h1>One</h1>
                            <p class="mb-0">A wonderful serenity has taken possession of my entire soul.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 p-3 col-md-6">
                    <div class="card">
                        <div class="card-body p-4"> <img class="img-fluid d-block mb-3 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg" width="150">
                            <h1>Two</h1>
                            <p class="mb-0">So absorbed in the exquisite sense of mere tranquil existence.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 p-3 col-md-6">
                    <div class="card">
                        <div class="card-body p-4"> <img class="img-fluid d-block mb-3 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg" width="150">
                            <h1>Three</h1>
                            <p class="mb-0">I should be incapable of drawing a single stroke.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3">
        <div class="container">
            <div class="row">
                <div class="col-md-4 col-6 p-3"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/cover-bubble-dark.svg">
                    <h2 class="my-3"><b>One&nbsp;</b> </h2>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                </div>
                <div class="col-md-4 col-6 p-3"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/cover-moon.svg">
                    <h2 class="my-3"> <b>Two</b> </h2>
                    <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend.</p>
                </div>
                <div class="col-md-4 col-6 p-3"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/cover-bubble-light.svg">
                    <h2 class="my-3"> <b>Three</b> </h2>
                    <p>So absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="pt-5 text-center">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <h1>I am so happy, my dear friend</h1>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 col-md-4 p-4">
                    <h4> <b>One</b> </h4>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                </div>
                <div class="col-lg-4 col-md-4 p-4">
                    <h4> <b>Two</b> </h4>
                    <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend.</p>
                </div>
                <div class="col-lg-4 col-md-4 p-4">
                    <h4> <b>Three</b> </h4>
                    <p>So absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5 text-white" style="background-image: linear-gradient(to bottom, rgba(0, 0, 0, .75), rgba(0, 0, 0, .75)), url(<?php echo SITE_PATH; ?>assets/images/cover-bubble-dark.svg);  background-position: center center, center center;  background-size: cover, cover;  background-repeat: repeat, repeat;">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <h1 class="text-light mb-4">I lie close to the earth</h1>
                </div>
            </div>
            <div class="row text-dark">
                <div class="col-lg-4 p-3">
                    <div class="card text-center">
                        <div class="card-body p-4">
                            <h3>One</h3>
                            <p class="my-3 lead">Among the tall grass by the trickling stream; and, as I lie close to the earth.</p> <a class="btn btn-link" href="#">Read more</a> </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 p-3">
                    <div class="card text-center">
                        <div class="card-body p-4">
                            <h3>Two</h3>
                            <p class="my-3 lead">I am alone, and feel the charm of existence in this spot, which was created.</p> <a class="btn btn-link" href="#">Read more</a> </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 p-3">
                    <div class="card text-center">
                        <div class="card-body p-4">
                            <h3>Three</h3>
                            <p class="my-3 lead">A wonderful serenity has taken possession of my entire soul, like these sweets.</p> <a class="btn btn-link" href="#">Read more</a> </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="pt-5 pb-3 text-center">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1 class="mb-3">O my friend</h1>
                    <p class="lead"> <b>
                            <a href="#">See all features</a>...</b> <br> </p>
                </div>
            </div>
            <div class="row">
                <div class="col-md-3 col-6 p-4"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg" width="1500">
                    <h4 class="mt-3 mb-0"> <b>One&nbsp;</b> </h4>
                </div>
                <div class="col-md-3 col-6 p-4"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-4.svg" width="1500">
                    <h4 class="mt-3 mb-0"> <b>Two</b> </h4>
                </div>
                <div class="col-md-3 col-6 p-4"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg" width="1500">
                    <h4 class="mt-3 mb-0"> <b>Three</b> </h4>
                </div>
                <div class="col-md-3 col-6 p-4"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg" width="1500">
                    <h4 class="mt-3 mb-0"> <b>Four</b> </h4>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="col-md-10">
                    <h2>A wonderful serenity</h2>
                    <p class="lead">Has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. <br> </p>
                    <p class="lead">
                        <a href="#">
                            <b>See all features</b>
                        </a> <br> </p>
                    <div class="row text-center">
                        <div class="col-md-3 col-6 p-3"> <img class="img-fluid d-block mb-3 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg" width="150">
                            <p class="mb-0 lead"> <b>One</b> </p>
                        </div>
                        <div class="col-md-3 col-6 p-3"> <img class="img-fluid d-block mb-3 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-4.svg" width="150">
                            <p class="mb-0 lead"> <b>Two</b> </p>
                        </div>
                        <div class="col-md-3 col-6 p-3"> <img class="img-fluid d-block mb-3 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg" width="150">
                            <p class="mb-0 lead"> <b>Three</b> </p>
                        </div>
                        <div class="col-md-3 col-6 p-3"> <img class="img-fluid d-block mb-3 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg" width="150">
                            <p class="mb-0 lead"> <b>Four</b> </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3">
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-6 p-3 d-flex align-items-center">
                    <h2>I am not alone, and feel the charm of existence in this spot.</h2>
                </div>
                <div class="col-md-6 col-6 p-3 text-center">
                    <div class="row">
                        <div class="col-md-4 p-2"> <img class="img-fluid d-block mb-2 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg" width="100">
                            <p class="mb-0 lead"> <a href="#">One</a> </p>
                        </div>
                        <div class="col-md-4 p-2"> <img class="img-fluid d-block mb-2 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg" width="100">
                            <p class="mb-0 lead"> <a href="#">Two</a> </p>
                        </div>
                        <div class="col-4 p-2"> <img class="img-fluid d-block mb-2 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg" width="100">
                            <p class="mb-0 lead"> <a href="#">Three</a> </p>
                        </div>
                        <div class="col-4 p-2"> <img class="img-fluid d-block mb-2 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg" width="100">
                            <p class="mb-0 lead"> <a href="#">Four</a> </p>
                        </div>
                        <div class="col-4 p-2"> <img class="img-fluid d-block mb-2 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-4.svg" width="100">
                            <p class="mb-0 lead"> <a href="#">Five</a> </p>
                        </div>
                        <div class="col-4 p-2"> <img class="img-fluid d-block mb-2 mx-auto rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg" width="100">
                            <p class="mb-0 lead"> <a href="#">Six</a> </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1>O my friend</h1>
                    <p class="lead mb-4">A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine.
                        I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke at the present moment.</p>
                </div>
            </div>
            <div class="row d-flex justify-content-between">
                <div class="col-md-6 col-lg-5 p-4"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg" width="1500">
                    <h4 class="my-3"> <b>#1</b> </h4>
                    <p>When, while the lovely valley teems with vapour around me, and the meridian sun strikes the upper surface of the impenetrable foliage of my trees, and but a few stray gleams steal into the inner sanctuary.</p>
                </div>
                <div class="col-md-6 col-lg-5 p-4"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg" width="1500">
                    <h4 class="my-3"> <b>#2</b> </h4>
                    <p>I throw myself down among the tall grass by the trickling stream; and, as I lie close to the earth, a thousand unknown plants are noticed by me: when I hear the buzz of the little world among the stalks, and grow familiar.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1>A wonderful serenity</h1>
                    <p class="lead mb-4">Has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine.</p>
                </div>
            </div>
            <div class="row d-flex justify-content-between">
                <div class="col-md-4 col-lg-3 p-4"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg" width="1500">
                    <h4 class="my-3"> <b>One&nbsp;</b> </h4>
                    <p>I should be incapable of drawing a single stroke at the present moment; and yet I feel that I never was a greater artist than now.</p>
                </div>
                <div class="col-md-4 col-lg-3 p-4"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg" width="1500">
                    <h4 class="my-3"> <b>Two</b> </h4>
                    <p>I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents.</p>
                </div>
                <div class="col-md-4 col-lg-3 p-4"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg" width="1500">
                    <h4 class="my-3"> <b>Three</b> </h4>
                    <p>I throw myself down among the tall grass by the trickling stream; and, as I lie close to the earth, a thousand unknown plants are noticed by me.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1 class="text-center mb-4">I lie close to the earth</h1>
                    <div class="row">
                        <div class="col-lg-5 col-md-6 p-md-4 col-3"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg" width="1500"> </div>
                        <div class="col-md-6 offset-lg-1 d-flex flex-column justify-content-center py-4">
                            <h2 class="my-3"> <b>One</b> </h2>
                            <p class="lead">A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine.</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6 d-flex flex-column justify-content-center order-2 order-md-1 py-4">
                            <h2 class="my-3"> <b>Two</b> </h2>
                            <p class="lead">I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke at the present moment; and yet I feel that I never was a greater artist.</p>
                        </div>
                        <div class="col-lg-5 col-md-6 p-md-4 col-3 offset-lg-1 order-1 order-md-2"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg" width="1500"> </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-5 col-md-6 p-md-4 col-3"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg" width="1500"> </div>
                        <div class="col-md-6 offset-lg-1 d-flex flex-column justify-content-center py-4">
                            <h2 class="my-3"> <b>Three</b> </h2>
                            <p class="lead">When, while the lovely valley teems with vapour around me, and the meridian sun strikes the upper surface of the impenetrable foliage of my trees, and but a few stray gleams steal into the inner sanctuary.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5 text-center">
        <div class="container">
            <div class="row">
                <div class="text-center mx-auto col-lg-8">
                    <h2>A thousand unknown plants</h2>
                    <div class="row justify-content-center">
                        <div class="col-6 py-3"> <i class="d-block fa fa-circle mb-2 text-muted fa-4x"></i>
                            <h4> <b>One</b> </h4>
                        </div>
                        <div class="col-6 py-3"> <i class="d-block fa fa-circle-o mb-2 text-muted fa-4x"></i>
                            <h4> <b>Two</b> </h4>
                        </div>
                    </div> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/cover-bubble-light.svg">
                    <p class="mt-2"> <i>A wonderful serenity has taken possession of my entire soul.</i> </p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3 text-center">
        <div class="container">
            <div class="row">
                <div class="col-md-10 text-center mx-auto">
                    <h2 class="mb-4">I enjoy with my whole heart</h2> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/cover-moon.svg">
                    <div class="row justify-content-center">
                        <div class="col-4 p-4"> <i class="d-block fa fa-circle fa-3x mb-2 text-muted"></i>
                            <h4> <b>One</b> </h4>
                        </div>
                        <div class="col-4 p-4"> <i class="d-block fa fa-stop-circle fa-3x mb-2 text-muted"></i>
                            <h4> <b>Two</b> </h4>
                        </div>
                        <div class="col-4 p-4"> <i class="d-block fa fa-circle-o fa-3x mb-2 text-muted"></i>
                            <h4> <b>Three</b> </h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5 text-center">
        <div class="container">
            <div class="row">
                <div class="col-md-10 text-center mx-auto">
                    <h2 class="mb-0">O my friend</h2>
                    <div class="row justify-content-center">
                        <div class="col-lg-4 p-4"> <i class="d-block fa fa-circle mb-2 text-muted fa-2x"></i>
                            <h4> <b>One</b> </h4>
                            <p class="mb-0">Oh, would I could describe these conceptions, could impress upon paper all that is living so full.</p>
                        </div>
                        <div class="col-lg-4 col-md-6 p-4"> <i class="d-block fa fa-stop-circle mb-2 text-muted fa-2x"></i>
                            <h4> <b>Two</b> </h4>
                            <p>I feel that I never was a greater artist than now. When, while the lovely valley teems with vapour.</p>
                        </div>
                        <div class="col-lg-4 col-md-6 p-4"> <i class="d-block fa fa-circle-o mb-2 text-muted fa-2x"></i>
                            <h4> <b>Three</b> </h4>
                            <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings.</p>
                        </div>
                    </div> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/cover-moon.svg"> </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="pt-5">
        <div class="container">
            <div class="row">
                <div class="mx-auto col-md-12 px-4">
                    <h2>I am so happy, my dear friend</h2>
                    <p class="lead mb-4">So absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke at the present moment.</p> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/cover-bubble-dark.svg">          </div>
            </div>
            <div class="row justify-content-center">
                <div class="col-4 p-4 col-md-6">
                    <h4> <b>One</b> </h4>
                    <p>When, while the lovely valley teems with vapour around me, and the meridian sun strikes the upper surface of the impenetrable foliage of my trees, and but a few stray gleams steal into the inner sanctuary, I throw myself down among the tall
                        grass by the trickling stream; and, as I lie close to the earth, a thousand unknown plants are noticed by me. <br> <br> <a href="#">Read more</a> </p>
                </div>
                <div class="col-4 p-4 col-md-6">
                    <h4> <b>Two</b> </h4>
                    <p>when I hear the buzz of the little world among the stalks, and grow familiar with the countless indescribable forms of the insects and flies, then I feel the presence of the Almighty, who formed us in his own image, and the breath of that universal
                        love which bears and sustains us, as it floats around us in an eternity of bliss; and then, my friend... <br> <br> <a href="#">Read more</a> </p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="pt-5">
        <div class="container">
            <div class="row">
                <div class="mx-auto col-md-12">
                    <h2>A wonderful serenity</h2>
                    <p class="lead mb-4">It has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot.</p> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/cover-bubble-light.svg">
                    <div class="row justify-content-center">
                        <div class="col-lg-4 p-4">
                            <div class="row">
                                <div class="col-3 p-0 d-flex align-items-center"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg"> </div>
                                <div class="col-9 d-flex align-items-center">
                                    <p class="mb-0 lead">I am alone, and feel the charm of existence.</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4 p-4">
                            <div class="row">
                                <div class="col-3 p-0 d-flex align-items-center"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-3.svg"> </div>
                                <div class="col-9 d-flex align-items-center">
                                    <p class="mb-0 lead">In this spot, which was created for the bliss.</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4 p-4">
                            <div class="row">
                                <div class="col-3 p-0 d-flex align-items-center"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg"> </div>
                                <div class="col-9 d-flex align-items-center">
                                    <p class="mb-0 lead">Souls like mine. I am so happy, my dear friend.</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="text-center col-md-8 mx-auto">
                    <h1 class="mb-3">I enjoy with my whole heart</h1>
                    <p class="lead mb-0">I am alone, and feel the charm of existence in this spot.</p> <a class="btn btn-link m-3" href="#">Read more</a> <a class="btn btn-primary m-3" href="#">Buy now</a> </div>
            </div>
            <div class="row">
                <div class="col-md-12 p-0"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/cover-bubble-dark.svg" width="1500"> </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3">
        <div class="container">
            <div class="row">
                <div class="col-md-6 d-flex flex-column justify-content-center">
                    <h1 class="mb-3">I lie close to the earth</h1>
                    <p class="lead mb-4">A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine.
                        I am so happy, my dear friend.</p>
                </div>
                <div class="col-md-6 p-lg-5 p-3"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg" width="1500"> </div>
            </div>
            <div class="row">
                <div class="col-md-3 col-6 p-3">
                    <h4 class="my-3"> <b>One&nbsp;</b> </h4>
                    <p>A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                </div>
                <div class="col-md-3 col-6 p-3">
                    <h4 class="my-3"> <b>Two</b> </h4>
                    <p>I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend.</p>
                </div>
                <div class="col-md-3 col-6 p-3">
                    <h4 class="my-3"> <b>Three</b> </h4>
                    <p>So absorbed in the exquisite sense of mere tranquil existence, that I neglect my talents. I should be incapable of drawing a single stroke.</p>
                </div>
                <div class="col-md-3 col-6 p-3">
                    <h4 class="my-3"> <b>Four</b> </h4>
                    <p>At the present moment and yet I feel that I never was a greater artist than now. When, while the lovely valley teems with vapour around me.</p>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="order-2 order-md-1 col-md-5"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-tablet.svg"> </div>
                <div class="px-md-5 d-flex flex-column justify-content-center col-md-7 order-1 order-md-2">
                    <h1> O my friend</h1>
                    <p class="mb-3 lead">I hear the buzz of the little world among the stalks, and grow familiar with the countless indescribable forms of the insects and flies, then I feel the presence of the Almighty.</p>
                    <div class="row">
                        <div class="col-md-6">
                            <h5> <b>Wonderful</b> </h5>
                            <p class="mb-3">I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence.</p>
                        </div>
                        <div class="col-md-6">
                            <h5> <b>Serenity</b> </h5>
                            <p class="mb-3">I should be incapable of drawing a single stroke at the present moment; and yet I feel.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-3">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-md-6 p-3">
                    <h1>Wonderful</h1>
                    <p class="mb-3">Has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p> <a href="#" class="btn btn-outline-primary">Let's Go</a> </div>
                <div class="col-lg-4 col-md-6 p-3">
                    <h1>Serenity</h1>
                    <p class="mb-3">I should be incapable of drawing a single stroke at the present moment; and yet I feel that I never was a greater artist than now.</p> <a href="#" class="btn btn-primary">Download</a> </div>
                <div class="col-lg-4 d-flex flex-column align-items-start justify-content-center p-3">
                    <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-tablet.svg"> </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="col-lg-6 order-2 order-lg-1"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-tablet.svg"> </div>
                <div class="px-md-5 p-3 col-lg-6 d-flex flex-column align-items-start justify-content-center order-1 order-lg-2">
                    <h1 class="mb-3">I hear the buzz</h1>
                    <div class="row">
                        <div class="col-6">
                            <h5> <b>First</b> </h5>
                            <p>A wonderful serenity has taken possession of my entire soul, like these sweets.</p>
                        </div>
                        <div class="col-6">
                            <h5> <b>Second</b> </h5>
                            <p>I am alone, and feel the charm of existence in this spot, which was created.</p>
                        </div>
                        <div class="col-6">
                            <h5> <b>Third</b> </h5>
                            <p class="mb-0">I am so happy, my dear friend, so absorbed in the exquisite sense.</p>
                        </div>
                        <div class="col-6">
                            <h5> <b>Fourth</b> </h5>
                            <p class="mb-0">I should be incapable of drawing a single stroke at the present moment.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="py-5">
        <div class="container">
            <div class="row">
                <div class="px-md-5 p-3 col-lg-6 d-flex flex-column align-items-start justify-content-center">
                    <h1>A wonderful serenity</h1>
                    <p class="mb-3 lead">Has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart.</p>
                    <div class="row">
                        <div class="col-6">
                            <h5> <b>First</b> </h5>
                            <p class="mb-0">A wonderful serenity has taken possession of my entire soul, like these sweets.</p>
                        </div>
                        <div class="col-6">
                            <h5> <b>Second</b> </h5>
                            <p class="mb-0">I am alone, and feel the charm of existence in this spot, which was created.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-tablet.svg"> </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="pt-5">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <h1 class="mb-4">I enjoy with my whole heart</h1>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-md-6 py-md-4 px-4 order-1 order-lg-1 text-lg-right d-flex flex-column justify-content-between">
                    <div class="row">
                        <div class="col-9 col-md-12"> <i class="d-block fa fa-circle mb-1 text-muted fa-2x"></i>
                            <p class="lead mb-1"> <b>One</b> </p>
                            <p>A wonderful serenity has taken possession of my entire soul.</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-9 col-md-12"> <i class="d-block fa fa-stop-circle mb-1 text-muted fa-2x"></i>
                            <p class="lead mb-1"> <b>Two</b> </p>
                            <p>Like these sweet mornings of spring which I enjoy.</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-9 col-md-12"> <i class="d-block fa fa-circle-o mb-1 text-muted fa-2x"></i>
                            <p class="lead mb-1"> <b>Three</b> </p>
                            <p>I am alone, and feel the charm of existence in this spot.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-5 col-md-6 mx-auto order-3 order-lg-2"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-mobile.svg"> </div>
                <div class="col-lg-3 col-md-6 py-md-4 px-4 order-2 order-lg-3 d-flex flex-column justify-content-between">
                    <div class="row">
                        <div class="col-9 col-md-12"> <i class="d-block fa fa-stop-circle-o mb-1 text-muted fa-2x"></i>
                            <p class="lead mb-1"> <b>Four</b> </p>
                            <p>Which was created for the bliss of souls like mine</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-9 col-md-12"> <i class="d-block fa mb-1 text-muted fa-2x fa-circle-o"></i>
                            <p class="lead mb-1"> <b>Five</b> </p>
                            <p>I am so happy, my dear friend, so absorbed.</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-9 col-md-12"> <i class="d-block fa fa-circle mb-1 text-muted fa-2x"></i>
                            <p class="lead mb-1"> <b>Six</b> </p>
                            <p>the exquisite sense of mere tranquil existence.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="pt-5">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <h1 class="mb-4">I lie close to the earth</h1>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-5 col-7 mx-auto order-2 order-lg-1"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-mobile.svg"> </div>
                <div class="col-lg-5 py-md-5 px-4 order-1 order-lg-2 d-flex flex-column justify-content-between">
                    <div class="row">
                        <div class="col-9 col-md-12"> <i class="d-block fa fa-stop-circle-o mb-1 text-muted fa-3x"></i>
                            <p class="lead mb-1"> <b>One</b> </p>
                            <p>I often think with longing, Oh, would I could describe these conceptions, could impress upon paper.</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-9 col-md-12"> <i class="d-block fa mb-1 text-muted fa-circle-o fa-3x"></i>
                            <p class="lead mb-1"> <b>Two</b> </p>
                            <p>So full and warm within me, that it might be the mirror of my soul, as my soul is the mirror of the infinite God!</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-9 col-md-12"> <i class="d-block fa fa-circle mb-1 text-muted fa-3x"></i>
                            <p class="lead mb-1"> <b>Three</b> </p>
                            <p>O my friend -- but it is too much for my strength -- I sink under the weight of the splendour of these visions!</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="pt-5">
        <div class="container">
            <div class="row">
                <div class="col-lg-6 p-4 d-flex justify-content-center flex-column">
                    <h1 class="mb-4">O my friend</h1>
                    <p class="lead">A wonderful serenity has taken possession of my entire soul, like these sweet mornings of spring which I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot.</p>
                    <div class="row my-3">
                        <div class="col-3"> <img class="img-fluid d-block rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-1.svg"> </div>
                        <div class="col-8 d-flex align-items-center">
                            <p class="mb-0">I often think with longing, Oh, would I could describe these conceptions, could impress upon paper.</p>
                        </div>
                    </div>
                    <div class="row my-3">
                        <div class="col-3 order-1 order-md-2"> <img class="img-fluid d-block rounded-circle" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-2.svg"> </div>
                        <div class="col-8 d-flex align-items-center order-2 order-md-1">
                            <p class="mb-0">My friend, when darkness overspreads my eyes, and heaven and earth seem to dwell in my soul and absorb its power.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-5 col-8 mx-auto d-flex justify-content-center flex-column"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-mobile.svg"> </div>
            </div>
        </div>
    </div>
</li>
<li class="pi-draggable" draggable="true" ondragstart="return dragStart(event)">
    <div class="pt-5" style="">
        <div class="container">
            <div class="row">
                <div class="col-md-8 text-center mx-auto">
                    <h1>I enjoy with my whole heart</h1>
                    <p class="lead mb-4">I throw myself down among the tall grass by the trickling stream; and, as I lie close to the earth, a thousand unknown plants are noticed by me: when I hear the buzz of the little world among the stalks.</p>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-5 col-7 mx-auto order-2 order-lg-1"> <img class="img-fluid d-block" src="<?php echo SITE_PATH; ?>assets/images/img-placeholder-mobile.svg"> </div>
                <div class="col-lg-5 py-lg-5 px-4 order-1 order-lg-2 d-flex flex-column justify-content-between">
                    <div class="row">
                        <div class="col-9 col-md-12">
                            <p class="lead mb-1"> <b>One</b> </p>
                            <p>I enjoy with my whole heart. I am alone, and feel the charm of existence in this spot, which was created for the bliss of souls like mine. I am so happy, my dear friend, so absorbed in the exquisite sense of mere tranquil existence.</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-9 col-md-12">
                            <p class="lead mb-1"> <b>Two</b> </p>
                            <p>I should be incapable of drawing a single stroke at the present moment; and yet I feel that I never was a greater artist than now. When, while the lovely valley teems with vapour around me, and the meridian sun strikes.</p>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-9 col-md-12">
                            <p class="lead mb-1"> <b>Three</b> </p>
                            <p>My friend, when darkness overspreads my eyes, and heaven and earth seem to dwell in my soul and absorb its power, like the form of a beloved mistress, then I often think with longing, Oh, would I could describe these conceptions.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</li>
