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


<section id="content">

    <div class="content-wrap">
        <div class="section parallax notopborder  header-stick nomargin nobottommargin footer-stick"
             >
<!--            <div class="overlay overlay-black opacity-medium"></div>-->


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

                <div class="row justify-content-between align-items-center col-mb-30">
                    <div class="col-9 center-col">
                        <div class="row justify-content-between align-items-center col-mb-30">
                            <div class="col-lg-7 col-md-12 p-5">
                                <h2 class="color-2" style="font-size: 45px;">THE BEST CONNECTION</h2>
                                <p class="mb-5">GREATER SPEED FREE FOREVER</p>

                                <h3 class="color-2">HI-TECH MAKE LIFE EASIER</h3>
                                <p class="mb-5 font-medium">The architectural and design projects are fully designed to make life easier for those who work in the hotel. We break all barriers of outdated model of construction and operation. One client at the time: beyond design intelligence we use high-tech to optimize our staff time for MAKE OUR GUESTS HAPPY!

                                </p>

                            </div>

                            <div class="col-lg-5 col-md-12 p-5">


                                <h3 class="color-2">FIND OUT OUR ROBOTS</h3>
                                <p class="mb-5 font-medium">They deliver items to hotel guests. They help in the cleanliness of the hotel. They are sophisticated on the inside yet fun on the outside. They improve <strong>guest satisfaction</strong> enabling hotel staff to provide better customer service.</p>

                                <h3 class="color-2 mt-5">Take your Time</h3>
                                <h4>YOUR PHONE IS YOUR KEY</h4>
                                <p class="mb-5 font-medium">We also have self check-in and if you don't feel comfortable to use any of this, don't worry. Light People will be there for you.

                                </p>

                            </div>

                        </div>

                    </div>

                </div>
                <div class="line"></div>
                <div class="row justify-content-between align-items-center col-mb-30 mb-5">
                    <div class="col-lg-6">
                        <div class="portfolio-item col-12">
                            <div class="book-wrap">
                                <div class="book-card">
                                    <a href="<?= url("shared/img/wk1.jpg") ?>" class="item-quick-view book-image" data-lightbox="image" title="FIND OUT OUR ROBOTS"><img src="<?= url("shared/img/wk1.jpg") ?>" alt="Experience LHH Images"></a>
                                    <div class="book-detail">
                                        <h2 class="book-title"><a href="#">FIND OUT OUR ROBOTS</a></h2>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="portfolio-item col-12">
                            <div class="book-wrap">
                                <div class="book-card">
                                    <a href="<?= url("shared/img/wk2.jpg") ?>" data-lightbox="image" class="item-quick-view book-image" title="YOUR PHONE IS YOUR KEY"><img src="<?= url("shared/img/wk2.jpg") ?>" alt="Experience LHH Images"></a>
                                    <div class="book-detail">
                                        <h2 class="book-title"><a href="#">YOUR PHONE IS YOUR KEY</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(); ?>