<?php $v->layout("_theme");
$v->insert("views/page-title", ["pageTitle" => $pageTitle, "breadcrumb" => $breadcrumb]);
?>
    <section id="content">

        <div class="section parallax notopborder m-0"
            >
<!--            <div class="overlay overlay-black opacity-light"></div>-->


            <div class="container clearfix" id="section-diferenciais">

                <div class="row justify-content-between align-items-center col-mb-30 mw-lg">

                    <div class="col-lg-5">
                        <div class="heading-block">
                            <h2 class="color-2 font-large">Light Human Hotel<br>Paris - Arcueil</h2>
                            <p>Compagnie de Phalsbourg Project</p>
                        </div>

                    </div>
                    <div class="col-lg-7 p-5">
                        <div class="row mb-4">

                            <h3 class="font-weight-bolder">The project</h3>

                            <p class="font-medium mb-5">
                                The project will accommodate 82.000 square meters of mixed- use program that blends offices, retail, restaurants, health, sport facilities, Light Human Hotel Boutique with 120 rooms keys. Biomimicry and biodiversity are the central approaches of the project oriented towards shaping an environment for its future users based on innovative technologies. These elements are reflected in all aspects of the project conception developed by the Compagnie of Phalsbourg.
                            </p>
                            <a href="https://g.page/lighthumanhotelsparis?share" target="_blank"
                               class="btn text-larger px-4 py-2 rounded-pill mt-3 bg-color-2"
                               style="">Location project <i class="icon-chevron-right ml-3 mr-2 position-relative"
                                                            style="top: 1px"></i></a>

                        </div>
                    </div>
                </div>
                <div class="line"></div>
                <div class="row align-items-center col-mb-30 mb-5">
                    <div class="col-lg-4">
                        <div class="portfolio-item col-12">
                            <div class="book-wrap">
                                <div class="book-card">
                                    <a href="<?= url("storage/images/hotelparis/ecotone-001.jpg") ?>" class="item-quick-view book-image" data-lightbox="image" title="Hotel Paris"><img src="<?= url("storage/images/hotelparis/ecotone-001.jpg") ?>" alt="Hotel Paris"></a>
                                    <div class="book-detail">
                                        <h2 class="book-title"><a href="#">Hotel Paris</a></h2>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="portfolio-item col-12">
                            <div class="book-wrap">
                                <div class="book-card">
                                    <a href="<?= url("storage/images/hotelparis/ecotone-002.jpg") ?>" class="item-quick-view book-image" data-lightbox="image" title="Hotel Paris"><img src="<?= url("storage/images/hotelparis/ecotone-002.jpg") ?>" alt="Hotel Paris"></a>
                                    <div class="book-detail">
                                        <h2 class="book-title"><a href="#">Hotel Paris</a></h2>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="portfolio-item col-12">
                            <div class="book-wrap">
                                <div class="book-card">
                                    <a href="<?= url("storage/images/hotelparis/ecotone-003.jpg") ?>" class="item-quick-view book-image" data-lightbox="image" title="Hotel Paris"><img src="<?= url("storage/images/hotelparis/ecotone-003.jpg") ?>" alt="Hotel Paris"></a>
                                    <div class="book-detail">
                                        <h2 class="book-title"><a href="#">Hotel Paris</a></h2>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="portfolio-item col-12">
                            <div class="book-wrap">
                                <div class="book-card">
                                    <a href="<?= url("storage/images/hotelparis/ecotone-004.jpg") ?>" class="item-quick-view book-image" data-lightbox="image" title="Hotel Paris"><img src="<?= url("storage/images/hotelparis/ecotone-004.jpg") ?>" alt="Hotel Paris"></a>
                                    <div class="book-detail">
                                        <h2 class="book-title"><a href="#">Hotel Paris</a></h2>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="portfolio-item col-12">
                            <div class="book-wrap">
                                <div class="book-card">
                                    <a href="<?= url("storage/images/hotelparis/ecotone-005.jpg") ?>" class="item-quick-view book-image" data-lightbox="image" title="Hotel Paris"><img src="<?= url("storage/images/hotelparis/ecotone-005.jpg") ?>" alt="Hotel Paris"></a>
                                    <div class="book-detail">
                                        <h2 class="book-title"><a href="#">Hotel Paris</a></h2>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>


        <?php $v->insert("views/map"); ?>

        <?php $v->insert("views/newsletter-widget"); ?>

    </section><!-- #content end -->
<?php $v->start("scripts"); ?>
    <script src="<?= url("/shared/scripts/hover3d.js"); ?>"></script>

    <script>

        jQuery(document).ready(function () {

            if (!jQuery('body').hasClass('device-touch')) {

                var lFollowX = 0,
                    lFollowY = 0,
                    x = 0,
                    y = 0,
                    friction = 1 / 30;

                function moveBackground() {
                    x += (lFollowX - x) * friction;
                    y += (lFollowY - y) * friction;

                    translate = 'translate(' + x + 'px, ' + y + 'px) scale(1.1)';

                    jQuery('.move-bg').css({
                        '-webit-transform': translate,
                        '-moz-transform': translate,
                        'transform': translate
                    });

                    window.requestAnimationFrame(moveBackground);
                }

                jQuery(window).on('mousemove click', function (e) {

                    var lMouseX = Math.max(-100, Math.min(100, jQuery(window).width() / 2 - e.clientX));
                    var lMouseY = Math.max(-100, Math.min(100, jQuery(window).height() / 2 - e.clientY));
                    lFollowX = (10 * lMouseX) / 100; // 100 : 12 = lMouxeX : lFollow
                    lFollowY = (10 * lMouseY) / 100;

                });

                moveBackground();

                jQuery(".book-wrap").hover3d({
                    selector: ".book-card",
                    shine: false,
                });

            }

        });

    </script>
<?php $v->end(); ?>