@extends('site.layouts.default')
@section('content')
<style>
    @media(max-width:768px){
        .slide-properties-videos .slide-media{
            min-height:250px!important;
        }
    }
    .featured-properties-slider .slick-arrow{
        display:none!important;
    }
</style>
@php
$allProperties = DB::table('properties')->get();
@endphp
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
    $('body').on('click', '.slick-arrow', function () {        
        var slides = document.getElementsByClassName("slide-media");
        for (var i = 0; i < slides.length; i++) {
            $('.slide-properties-videos .slide-media')[i].contentWindow.postMessage('{"event":"command","func":"' + 'pauseVideo' + '","args":""}', '*');
        }
        $('.slide-properties-videos .slick-active .slide-media')[0].contentWindow.postMessage('{"event":"command","func":"' + 'playVideo' + '","args":""}', '*');
        $('.slide-properties-videos .slick-active .slide-media')[0].contentWindow.postMessage('{"method":"setVolume", "value":1}','*');
        document.getElementsByClassName("slide-properties-videos")[0].getElementsByClassName('slick-arrow')[1].click();
    })
})
</script>

<!-- SLIDER AREA START (slider-3) -->
<div class="ltn__slider-area ltn__slider-3  section-bg-2">
    <div class="ltn__slide-one-active slick-slide-arrow-1 slick-slide-dots-1">

        @foreach($slides as $one)
        @if($one->hasMedia('slider_image'))
        <!-- ltn__slide-item -->
        <div class="ltn__slide-item ltn__slide-item-2 ltn__slide-item-3-normal--- ltn__slide-item-3 bg-image bg-overlay-theme-black-60" data-bs-bg="{{ $one->getMedia('slider_image')->first()->getFullUrl() }}">

            <!-- Generator: Adobe Illustrator 26.0.3, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
            <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
               viewBox="0 0 289.8 344.9" style="enable-background:new 0 0 289.8 344.9;" xml:space="preserve">
            <style type="text/css">
              .st0{fill:#fff;}
              .st1{fill:#fff;}
            </style>
            <g>
              <g>
                <g>
                  <polygon class="st0" points="31.8,148.1 146.7,38.8 126.6,22 126.6,22 109.8,7.9 92.1,24 110.7,39.6 5.9,138 5.9,278.3
                    53.8,278.3 53.8,254.1 29.5,254.1 			"/>
                  <polygon class="st0" points="198,113 215.3,96.9 174.2,61.9 68.9,162.6 68.9,278.8 127.1,278.8 127.1,254.6 93.6,254.6
                    93.6,170.3 99.8,165.1 175.2,94 			"/>
                  <polygon class="st0" points="283.4,253.9 283.4,153.6 235.1,113.1 229.8,108.6 144,188.9 144,278.6 171.6,278.6 171.4,199
                    232.5,142 255.5,161.3 255.5,253.9 255.5,278.6 283.4,278.6 283.5,253.9 			"/>
                  <path class="st0" d="M84.4,219.2"/>
                </g>
                <g>
                  <path class="st1" d="M5.9,295.1H19c7.5,0,10.8,4.2,10.8,9.8c0,4.6-2.2,8.2-7,9.4l0,0l8.1,11.4h-5.7l-7.2-11h-7.3v10.9H5.9V295.1z
                     M19.1,310.4c4.4,0,5.9-2.3,5.9-5.4s-1.5-5.4-5.9-5.4h-8.4v10.8H19.1z"/>
                  <path class="st1" d="M33.3,314.1c0-7,5.1-12.2,12.4-12.2S58,307,58,314.1v1.6H37.9c0.7,4.1,3.7,6.4,7.8,6.4c3,0,5.1-0.9,6.5-2.9
                    h4.9c-1.8,4.3-6,7.1-11.4,7.1C38.4,326.3,33.3,321.2,33.3,314.1z M53.4,311.8L53.4,311.8c-0.9-3.7-3.9-5.7-7.7-5.7
                    s-6.7,2.1-7.6,5.7l0,0H53.4z"/>
                  <path class="st1" d="M60.8,314.3c0-7.2,5.1-12.3,12.5-12.3c7.2,0,12.3,5,12.3,12.3v11.4h-4.1v-5.1c-1.5,3.7-5,5.7-9,5.7
                    C66.5,326.3,60.8,321.9,60.8,314.3z M81.2,314.1c0-4.7-3.2-8-8-8s-8,3.4-8,8c0,4.7,3.2,8,8,8C78,322.2,81.2,318.8,81.2,314.1z"/>
                  <path class="st1" d="M91,292.5h4.4v33.2H91V292.5z"/>
                  <path class="st1" d="M114.1,295.1h22.5v4.4h-17.7v8.4h15v4.4h-15v9h17.7v4.4h-22.5C114.1,325.7,114.1,295.1,114.1,295.1z"/>
                  <path class="st1" d="M140.2,319h4.5l0,0c0.1,1.9,1.9,3.3,5.1,3.3c3.4,0,5.1-1.4,5.1-3.3c0-2.2-2.4-2.5-5.3-2.9
                    c-4-0.5-8.9-1.3-8.9-6.5c0-4.5,3.6-7.6,9.1-7.6s8.9,3.1,9,7.1h-4.3c0,0-0.1,0-0.1-0.1c-0.2-1.7-1.8-3-4.6-3
                    c-2.9,0-4.6,1.4-4.6,3.2c0,2.2,2.4,2.4,5.3,2.8c4,0.5,8.9,1.3,8.9,6.5c0,4.7-3.8,7.7-9.6,7.7S140.4,323.2,140.2,319z"/>
                  <path class="st1" d="M264.1,319h4.5l0,0c0.1,1.9,1.9,3.3,5.1,3.3c3.4,0,5.1-1.4,5.1-3.3c0-2.2-2.4-2.5-5.3-2.9
                    c-4-0.5-8.9-1.3-8.9-6.5c0-4.5,3.6-7.6,9.1-7.6s8.9,3.1,9,7.1h-4.3c0,0-0.1,0-0.1-0.1c-0.2-1.7-1.8-3-4.6-3
                    c-2.9,0-4.6,1.4-4.6,3.2c0,2.2,2.4,2.4,5.3,2.8c4,0.5,8.9,1.3,8.9,6.5c0,4.7-3.8,7.7-9.6,7.7C267.8,326.3,264.2,323.2,264.1,319z
                    "/>
                  <path class="st1" d="M163.2,316.9v-22.5h4.4v8.2h8.5v4.1h-8.5V317c0,3.6,1.9,5.2,4.8,5.2c2.9,0,4.9-1.5,4.9-5.2v-0.5h4.4v0.5
                    c0,6.3-3.7,9.4-9.3,9.4C166.9,326.3,163.2,323.2,163.2,316.9z"/>
                  <path class="st1" d="M184.4,314.3c0-7.2,5.1-12.3,12.5-12.3c7.2,0,12.3,5,12.3,12.3v11.4h-4.1v-5.1c-1.5,3.7-5,5.7-9,5.7
                    C190.1,326.3,184.4,321.9,184.4,314.3z M204.8,314.1c0-4.7-3.2-8-8-8s-8,3.4-8,8c0,4.7,3.2,8,8,8
                    C201.6,322.2,204.8,318.8,204.8,314.1z"/>
                  <path class="st1" d="M213.8,316.9v-22.5h4.4v8.2h8.5v4.1h-8.5V317c0,3.6,1.9,5.2,4.8,5.2s4.9-1.5,4.9-5.2v-0.5h4.4v0.5
                    c0,6.3-3.7,9.4-9.3,9.4C217.5,326.3,213.8,323.2,213.8,316.9z"/>
                  <path class="st1" d="M235.1,314.1c0-7,5.1-12.2,12.4-12.2c7.3,0,12.3,5.1,12.3,12.2v1.6h-20.1c0.7,4.1,3.7,6.4,7.8,6.4
                    c3,0,5.1-0.9,6.5-2.9h4.9c-1.8,4.3-6,7.1-11.4,7.1C240.2,326.3,235.1,321.2,235.1,314.1z M255.2,311.8L255.2,311.8
                    c-0.9-3.7-3.9-5.7-7.7-5.7s-6.7,2.1-7.6,5.7l0,0H255.2z"/>
                </g>
              </g>
              <path id="Path_1702_00000064312004281646072120000002604370527247300031_" class="st0" d="M136.5,185.8l11.8-11.7l-13.7,2.3
                l-3.2-15.4l-6.4,14.6l-15-1.2l11.1,10l-6.5,14.9l13.7-8.4l8,13.3L136.5,185.8z"/>
            </g>
            </svg>
            <div class="ltn__slide-item-inner text-center">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12 align-self-center">
                            <div class="slide-item-info">
                                <div class="slide-item-info-inner ltn__slide-animation">

                                    <h6 class="slide-sub-title white-color--- animated"><span><i class="fas fa-home"></i></span>  {{ $one->sub_title }}  </h6>
                                    <h1 class="slide-title animated ">{!! $one->title !!}   </h1>
                                    <div class="slide-brief animated">
                                        <p>{{ $one->text  }}</p>
                                    </div>
                                    <div class="btn-wrapper animated">
                                        <a style="margin-right: 0;
 font-size: 14px;
 padding-right: 10px;
 padding-left: 10px;
 padding-top: 5px;
 padding-bottom: 5px;" href="{{ $one->btn_link }}" class="theme-btn-1 btn btn-effect-1">{{ $one->btn_text }}</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        @endif
        @endforeach

    </div>
</div>
<!-- SLIDER AREA END -->
{{--
<div class="ltn__car-dealer-form-area mt--65 mt-120 pb-115---">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="ltn__car-dealer-form-tab">
                        <div class="ltn__tab-menu  text-uppercase d-none">
                            <div class="nav">
                                <a class="active show" data-bs-toggle="tab" href="#ltn__form_tab_1_1"><i class="fas fa-car"></i>Find A Car</a>
                                <a data-bs-toggle="tab" href="#ltn__form_tab_1_2" class=""><i class="far fa-user"></i>Get a Dealer</a>
                            </div>
                        </div>
                        <div class="tab-content bg-white box-shadow-1 ltn__border position-relative pb-10">
                            <div class="tab-pane fade active show" id="ltn__form_tab_1_1">
                                <div class="car-dealer-form-inner">
                                    <form action="#" class="ltn__car-dealer-form-box row">
                                        <div class="ltn__car-dealer-form-item ltn__custom-icon---- ltn__icon-car---- col-lg-3 col-md-6">
                                            <select class="nice-select" style="display: none;">
                                                <option>Choose Area</option>
                                                <option>chicago</option>
                                                <option>London</option>
                                                <option>Los Angeles</option>
                                                <option>New York</option>
                                                <option>New Jersey</option>
                                            </select><div class="nice-select" tabindex="0"><span class="current">Choose Area</span><ul class="list"><li data-value="Choose Area" class="option selected focus">Choose Area</li><li data-value="chicago" class="option">chicago</li><li data-value="London" class="option">London</li><li data-value="Los Angeles" class="option">Los Angeles</li><li data-value="New York" class="option">New York</li><li data-value="New Jersey" class="option">New Jersey</li></ul></div>
                                        </div>
                                        <div class="ltn__car-dealer-form-item ltn__custom-icon---- ltn__icon-meter---- col-lg-3 col-md-6">
                                            <select class="nice-select" style="display: none;">
                                                <option>Property Status</option>
                                                <option>Open house</option>
                                                <option>Rent</option>
                                                <option>Sale</option>
                                                <option>Sold</option>
                                            </select><div class="nice-select" tabindex="0"><span class="current">Property Status</span><ul class="list"><li data-value="Property Status" class="option selected focus">Property Status</li><li data-value="Open house" class="option">Open house</li><li data-value="Rent" class="option">Rent</li><li data-value="Sale" class="option">Sale</li><li data-value="Sold" class="option">Sold</li></ul></div>
                                        </div>
                                        <div class="ltn__car-dealer-form-item ltn__custom-icon---- ltn__icon-calendar---- col-lg-3 col-md-6">
                                            <select class="nice-select" style="display: none;">
                                                <option>Property Type</option>
                                                <option>Apartment</option>
                                                <option>Co-op</option>
                                                <option>Condo</option>
                                                <option>Single Family Home</option>
                                            </select><div class="nice-select" tabindex="0"><span class="current">Property Type</span><ul class="list"><li data-value="Property Type" class="option selected focus">Property Type</li><li data-value="Apartment" class="option">Apartment</li><li data-value="Co-op" class="option">Co-op</li><li data-value="Condo" class="option">Condo</li><li data-value="Single Family Home" class="option">Single Family Home</li></ul></div>
                                        </div>
                                        <div class="ltn__car-dealer-form-item ltn__custom-icon ltn__icon-calendar col-lg-3 col-md-6">
                                            <div class="btn-wrapper text-center mt-0">
                                                <!-- <button type="submit" class="btn theme-btn-1 btn-effect-1 text-uppercase">Search Inventory</button> -->
                                                <a href="shop-right-sidebar.html" class="btn theme-btn-1 btn-effect-1 text-uppercase">Find Now</a>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="ltn__form_tab_1_2">
                                <div class="car-dealer-form-inner">
                                    <form action="#" class="ltn__car-dealer-form-box row">
                                        <div class="ltn__car-dealer-form-item ltn__custom-icon---- ltn__icon-car---- col-lg-3 col-md-6">
                                            <select class="nice-select" style="display: none;">
                                                <option>Choose Area</option>
                                                <option>chicago</option>
                                                <option>London</option>
                                                <option>Los Angeles</option>
                                                <option>New York</option>
                                                <option>New Jersey</option>
                                            </select><div class="nice-select" tabindex="0"><span class="current">Choose Area</span><ul class="list"><li data-value="Choose Area" class="option selected">Choose Area</li><li data-value="chicago" class="option">chicago</li><li data-value="London" class="option">London</li><li data-value="Los Angeles" class="option">Los Angeles</li><li data-value="New York" class="option">New York</li><li data-value="New Jersey" class="option">New Jersey</li></ul></div>
                                        </div>
                                        <div class="ltn__car-dealer-form-item ltn__custom-icon---- ltn__icon-meter---- col-lg-3 col-md-6">
                                            <select class="nice-select" style="display: none;">
                                                <option>Property Status</option>
                                                <option>Open house</option>
                                                <option>Rent</option>
                                                <option>Sale</option>
                                                <option>Sold</option>
                                            </select><div class="nice-select" tabindex="0"><span class="current">Property Status</span><ul class="list"><li data-value="Property Status" class="option selected">Property Status</li><li data-value="Open house" class="option">Open house</li><li data-value="Rent" class="option">Rent</li><li data-value="Sale" class="option">Sale</li><li data-value="Sold" class="option">Sold</li></ul></div>
                                        </div>
                                        <div class="ltn__car-dealer-form-item ltn__custom-icon---- ltn__icon-calendar---- col-lg-3 col-md-6">
                                            <select class="nice-select" style="display: none;">
                                                <option>Property Type</option>
                                                <option>Apartment</option>
                                                <option>Co-op</option>
                                                <option>Condo</option>
                                                <option>Single Family Home</option>
                                            </select><div class="nice-select" tabindex="0"><span class="current">Property Type</span><ul class="list"><li data-value="Property Type" class="option selected">Property Type</li><li data-value="Apartment" class="option">Apartment</li><li data-value="Co-op" class="option">Co-op</li><li data-value="Condo" class="option">Condo</li><li data-value="Single Family Home" class="option">Single Family Home</li></ul></div>
                                        </div>
                                        <div class="ltn__car-dealer-form-item ltn__custom-icon ltn__icon-calendar col-lg-3 col-md-6">
                                            <div class="btn-wrapper text-center mt-0">
                                                <!-- <button type="submit" class="btn theme-btn-1 btn-effect-1 text-uppercase">Search Inventory</button> -->
                                                <a href="shop-right-sidebar.html" class="btn theme-btn-1 btn-effect-1 text-uppercase">Search Properties</a>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
--}}


    <!-- PRODUCT SLIDER AREA START -->
    <div class="ltn__product-slider-area ltn__product-gutter pt-60 pb-30  center"   >
        <div class="container">
            <div class="row span3 wow bounceInUp" data-wow-delay="0.3s" >
                <div class="col-lg-12">
                    <div class="section-title-area ltn__section-title-2--- text-center">
                        <h6 class="section-subtitle section-subtitle-2 ltn__secondary-color">{{ __('home.featured_properties')}}</h6>
                        <h1 class="section-title">{{ __('home.featured_properties_title')}}</h1>
                    </div>
                </div>
            </div>

            <div   class="row   ltn__product-slider-item-three-active   slick-arrow-1 span3 wow bounceInUp featured-properties-slider" data-wow-delay="0.4s" >
                @foreach($properties as $one)
                <!-- ltn__product-item -->
                <div class="    col-lg-12 ">
                    <div class="ltn__product-item hover-container ltn__product-item-4 text-center---">
                        <div class="product-img">
                        @if($one->hasMedia('file'))
                            <a href="{{ $one->link }}">
                                <video class="hovervideo" style="max-width:100%;" width="100%" height="212" controls="false"
                                webkit-playsinline="true"
                                playsinline="true" 
                                muted
                                autoplay
                                @if($one->hasMedia('property_image'))
                                    poster="{{ $one->getMedia('property_image')->first()->getFullUrl('big') }}"
                                @endif
                                    >
                                    
                                    <source src="{{ $one->getMedia('file')->first()->getFullUrl() }}" type="video/mp4">
                                    Your browser does not support the video tag.
                                </video>
                                    </a>
                        @else
                            @if($one->hasMedia('property_image'))
                                
                                    <a href="{{ $one->link }}">
                                        <img id="image" src="{{ $one->getMedia('property_image')->first()->getFullUrl('big') }}" alt="#">
                                    </a>
                                
                            @endif

                        @endif
                            <div class="product-badge">
                                <ul>
                                    <!-- <li class="sale-badge bg-green">{{ __('site.featured')}}</li> -->
                                </ul>
                            </div>
                            <!-- <div class="product-img-location-gallery">
                                <div class="product-img-location">
                                    <ul>
                                        <li>
                                            <a href="#"><i class="flaticon-pin"></i> Belmont Gardens, Chicago</a>
                                        </li>
                                    </ul>
                                </div>

                            </div> -->
                        </div>
                        <div class="product-info">
                                                <div class="product-price">
                                                    <span><label> {{ __('site.start_from') }} / </label>
                                                        ${{ number_format($one->price, 0) }}</span>
                                                </div>
                                                <h2 class="product-title"><a
                                                        href="{{ $one->link }}">{{ $one->title }}</a></h2>

                                                <ul class="ltn__list-item-2 ltn__list-item-2-before">
                                                    <li><i class="icon-categories"></i> {{ __('site.category') }}
                                                        <span>{{ $one->category->title }} </span>
                                                    </li>
                                                    <li>
                                                        <i class="flaticon-location"></i> {{ __('site.location') }}
                                                        <span>{{ $one->address }}</span>
                                                        </li>

                                                </ul>
                                            </div>

                    </div>
                </div>
                @endforeach

            </div>
        </div>
    </div>
    <!-- PRODUCT SLIDER AREA END -->
<div class="ltn__upcoming-project-area section-bg-1--- bg-image-top pt-60 pb-30" data-bs-bg="img/bg/22.jpg">
        <div class="container">
             
            <div class="row ltn__upcoming-project-slider-1-active slick-arrow-3 slide-properties-videos">  
                        <!-- @foreach($allProperties as $one)
                @if($one->video && $one->id == env('FIRST_VIDEO_ID'))
            
                <div class="col-lg-12">
                    <div class="ltn__upcoming-project-item">
                        <div class="row">
                        <iframe class="embed-player slide-media" width="100%" height="100%" style="min-height:500px" src="https://www.youtube.com/embed/?enablejsapi=1&iv_load_policy=3&fs=0&rel=0&loop=1&start=1&autoplay=1&vq=hd1080&mute=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                                                    </div>
                    </div>
                </div>
                @endif
            @endforeach -->
            <!-- @foreach($allProperties as $one)
                @if($one->video && $one->id == env('SECOND_VIDEO_ID'))
             
                <div class="col-lg-12">
                    <div class="ltn__upcoming-project-item">
                        <div class="row">
                        <iframe class="embed-player slide-media" width="100%" height="100%" style="min-height:500px" src="https://www.youtube.com/embed/?enablejsapi=1&iv_load_policy=3&fs=0&rel=0&loop=1&start=1&autoplay=1&vq=hd1080&mute=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                        </div>
                    </div>
                </div>
                @endif
            @endforeach -->
            </div>
        </div>
    </div>



    @if($about_banner)
    <div style="background: url('{{ asset('img/pattern.png')}}');  background-size: contain;" class="ltn__about-us-area pt-120 pb-90 section-bg-1">
      <div class="container">
          <div class="row">
              <div class="col-lg-6 align-self-center">
                  <div class="about-us-img-wrap about-img-left">

                    @if($about_banner->hasMedia('banner_image'))
                    <img src="{{ $about_banner->getMedia('banner_image')->first()->getFullUrl() }}" class="span3 wow flipInX center" data-wow-delay="300ms" alt="Zen Real Estates" style="visibility: visible; animation-delay: 300ms;">
                    @endif
                                         </div>
              </div>
              <div class="col-lg-6 align-self-center">
                  <div class="about-us-info-wrap">
                      <div class="section-title-area ltn__section-title-2--- mb-20 span3 wow bounceInUp center" data-wow-delay="0.5s" style="visibility: visible; animation-delay: 0.5s;">
                          <h6 class="section-subtitle section-subtitle-2 ltn__secondary-color">{{ $about_banner->sub_title }}</h6>
                          <h1 class="section-title"> {{ $about_banner->title }} <span>.</span></h1>
                          <div>
                            {!! $about_banner->content !!}
                          </div>
                      </div>

                      <div class="btn-wrapper  span3 wow bounceInUp center  animated" data-wow-delay="0.7s" style="visibility: visible; animation-delay: 0.7s; animation-name: bounceInUp;">
                          <a href="https://wa.me/905318427907" class="theme-btn-1 btn btn-effect-1">{{ __('site.contact_us') }}</a>
                      </div>
                  </div>
              </div>
          </div>
      </div>
  </div>
  @endif

  <div class="ltn__feature-area section-bg-1--- pt-60 pb-30 mb-120---">
      <div class="container">
          <div class="row">
              <div class="col-lg-12">
                  <div class="section-title-area ltn__section-title-2--- text-center">
                      <h6 class="section-subtitle section-subtitle-2 ltn__secondary-color">{{ __('site.our_services')}}</h6>
                      <h1 class="section-title">{{ __('site.our_main_focus')}}</h1>
                  </div>
              </div>
          </div>
          <div class="row ltn__custom-gutter---  justify-content-center">

              @foreach($services as $one)
              <div class="col-lg-4 col-sm-6 col-12">
                  <div class="ltn__feature-item ltn__feature-item-6 text-center bg-white box-shadow-1">
                      <div class="ltn__feature-icon">
                          @if($one->hasMedia('service_icon'))
                          <img src="{{ $one->getMedia('service_icon')->first()->getFullUrl() }}" alt="{{ $one->title }}">
                          @endif
                      </div>
                      <div class="ltn__feature-info">
                          <h3 class="animated fadeIn"><a href="{{ $one->link }}">{{ $one->title }}</a></h3>
                          <p>{{ $one->brief }}</p>
                          <a class="ltn__service-btn" href="{{ $one->link }}">{{ __('site.read_more')}} <i class="flaticon-right-arrow"></i></a>
                      </div>
                  </div>
              </div>
              @endforeach
          </div>
      </div>
  </div>

    <!-- COUNTER UP AREA START -->
    <div class="ltn__counterup-area section-bg-1 pt-60 pb-30">
        <div class="container">
            <div class="row">
                @foreach($counters as $one)
                <div class="col-md-4 col-sm-6 align-self-center">
                    <div class="ltn__counterup-item text-color-white---">
                        <div class="counter-icon">
                          @if($one->hasMedia('counter_image'))
                          <img src="{{ $one->getMedia('counter_image')->first()->getFullUrl() }}" alt="{{ $one->title }}">
                          @endif
                        </div>
                        <h1><span class="counter">{{ $one->number }}</span><span class="counterUp-icon">+</span> </h1>
                        <h6>{{ $one->title }}</h6>
                    </div>
                </div>
                @endforeach


            </div>
        </div>
    </div>
    <!-- COUNTER UP AREA END -->

    <!-- TESTIMONIAL AREA START (testimonial-7) -->
  <div class="ltn__testimonial-area section-bg-1--- bg-image-top pt-60 pb-30" data-bs-bg="{{ asset('img/bg/20.jpg')}}">
      <div class="container">
          <div class="row">
              <div class="col-lg-12">
                  <div class="section-title-area ltn__section-title-2--- text-center">
                      <h6 class="section-subtitle section-subtitle-2 ltn__secondary-color">{{ __('site.our_testimonial')}}</h6>
                      <h1 class="section-title">{{ __('site.clients_feedback')}}</h1>
                  </div>
              </div>
          </div>
          <div class="row ltn__testimonial-slider-5-active slick-arrow-1">
            @foreach($reviews as $one)
            <div class="col-lg-4">
                <div class="ltn__testimonial-item ltn__testimonial-item-7">
                    <div class="ltn__testimoni-info">
                        <p><i class="flaticon-left-quote-1"></i>
                              {!! $one->text !!}</p>
                        <div class="ltn__testimoni-info-inner">
                            <div class="ltn__testimoni-img">
                                @if($one->hasMedia('person'))
                                <img src="{{ $one->getMedia('person')->first()->getFullUrl() }}" alt="#">
                                @endif
                            </div>
                            <div class="ltn__testimoni-name-designation">
                                <h5>{{ $one->name }}</h5>
                                <label>{{ $one->job }}</label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            @endforeach
              <!--  -->
          </div>
      </div>
  </div>
  <!-- TESTIMONIAL AREA END -->

@stop