@extends('quanlynhatro.landing_layout')
@section('title')
    <title>Phần mềm quản lý nhà trọ, văn phòng, căn hộ, kiot cho thuê - ITRO</title>
@endsection

@section('meta')
    <meta property="og:url" content="{{ url()->current() }}"/>
    <meta property="og:type" content="website"/>
    <meta property="og:title" content="Phần mềm quản lý nhà trọ, văn phòng, căn hộ, kiot cho thuê - ITRO"/>
    <meta property="og:description"
          content="Phần mềm quản lý nhà trọ, văn phòng, căn hộ, kiot, chung cư, cửa hàng, ký túc xá, homestay cho thuê ITRO -  app quản lý tiện lợi, dùng ngay trên điện thoại, tiết kiệm 90% thời gian quản lý cho chủ nhà."/>
    <meta property="og:image" content="https://quanlynhatro.com/ogimage_qlnt.jpg"/>
    <meta property="fb:app_id" content="1072839196191686"/>
    <script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "LocalBusiness",
  "name": "Phần mềm quản lý nhà trọ iTro",
"logo":"https://quanlynhatro.com/files/logo_itro_2020.jpg",
  "image": "https://quanlynhatro.com/files/background_itro_2020.png",
  "@id": "https://quanlynhatro.com/",
  "url": "https://quanlynhatro.com/",
"description": "Phần mềm quản lý nhà trọ, văn phòng, căn hộ, kiot, chung cư, cửa hàng, ký túc xá, homestay cho thuê ITRO - app quản lý tiện lợi, dùng ngay trên điện thoại, tiết kiệm 90% thời gian quản lý cho chủ nhà.",
  "telephone": "02471007111",
"hasMap": "https://goo.gl/maps/SCDUZT9iLXt84MjU7",
		"email": "phong@itro.vn",
		"founder": "Phong itro",
  "priceRange": "2500-10000",
  "address": {
    "@type": "PostalAddress",
    "streetAddress": "12 Khuất Duy Tiến, Thanh Xuân Bắc, Thanh Xuân",
    "addressLocality": "Hà Nội",
    "postalCode": "100000",
    "addressCountry": "VN"
  },
  "geo": {
    "@type": "GeoCoordinates",
    "latitude": 20.993535089159966,
    "longitude": 105.80220946204123
  },
  "openingHoursSpecification": {
    "@type": "OpeningHoursSpecification",
    "dayOfWeek": [
      "Monday",
      "Tuesday",
      "Wednesday",
      "Thursday",
      "Friday"
    ],
    "opens": "08:00",
    "closes": "17:30"
  },
  "sameAs": [
    "https://www.facebook.com/itro.vn",
"https://www.youtube.com/channel/UCeTr9T7Wlrk07Sjmn_4p9fQ",
"https://twitter.com/quanlynhatro",
"https://www.flickr.com/people/quanlynhatroitro/",
"https://gab.com/quanlynhatroitro",
"https://www.pinterest.com/quanlynhatroitro",
"https://flipboard.com/@quanlynhatro",
"https://www.scoop.it/topic/phan-mem-quan-ly-nha-tro-itro",
"https://www.reddit.com/user/quanlynhatroitro",
"https://www.plurk.com/quanlynhatroitro",
"https://www.deviantart.com/quanlynhatroitro",
"https://www.linkedin.com/in/quanlynhatroitro/",
    "https://ok.ru/quanlynhatroitro",
    "https://band.us/band/86325741",
    "https://quanlynhatroitro.tumblr.com/",
    "https://tapas.io/quanlynhatroitro",
"https://ello.co/quanlynhatroitro",
    "https://www.diigo.com/profile/quanlynhatroitro",
"https://www.vingle.net/quanlynhatro",
"https://b.hatena.ne.jp/quanlynhatroitro/",
"https://dashburst.com/quanlynhatroitro",
"https://ameblo.jp/quanlynhatroitro",
"https://mastodon.social/@quanlynhatroitro",
"https://getpocket.com/@quanlynhatroitro",
"https://www.gapo.vn/quanlynhatroitro",
"https://dribbble.com/quanlynhatroitro",
"https://www.behance.net/quanlynhatroitro",
"https://ko-fi.com/quanlynhatroitro",
"https://myspace.com/quanlynhatroitro",
    "https://www.instapaper.com/p/quanlynhatro"
  ]
}
</script>

@endsection

@section('content')

    @include('frontend3.header_landing')


    <!-- hero -->
    <section class="block-hero block-hero--ld">
        <div class="block-hero__wrap">
            <div class="block-hero__background">
                <div class="hero-background">
                    <div class="hero-background__shapes">
                        <div class="hero-background__shape hero-background__shape--fill1"
                             style="left: -35.3333px; top: 1096.67px;">
                            <div class="hero-background__shape__transform">
                                <svg width="1001" height="585"
                                     style="transform: scale(1.33333) translate(-500.5px, -500.5px);">
                                    <g x="0" y="0">
                                        <polygon class="fill1" fill="#ec8056" points="0,585 1001,270 452,0"></polygon>
                                    </g>
                                </svg>
                            </div>
                        </div>
                        <div class="hero-background__shape hero-background__shape--stroke"
                             style="left: -35.3333px; top: 1125px;">
                            <div class="hero-background__shape__transform">
                                <svg width="1080" height="608"
                                     style="transform: scale(1.33333) translate(-539px, -539px);">
                                    <g x="1" y="1">
                                        <polygon class="stroke" points="0,606 1078,291 486,0"></polygon>
                                    </g>
                                </svg>
                            </div>
                        </div>
                        <div class="hero-background__shape hero-background__shape--fill3"
                             style="left: 1960.67px; top: 986.667px;">
                            <div class="hero-background__shape__transform">
                                <svg width="683" height="438"
                                     style="transform: scale(1.33333) translate(-341.5px, -341.5px);">
                                    <g x="0" y="0">
                                        <polygon class="fill3" fill="#FDE7A9" points="0,0 324,438 683,117"></polygon>
                                    </g>
                                </svg>
                            </div>
                        </div>
                        <div class="hero-background__shape hero-background__shape--stroke"
                             style="left: 1914px; top: 971.333px;">
                            <div class="hero-background__shape__transform">
                                <svg width="685" height="441"
                                     style="transform: scale(1.33333) translate(-341.5px, -341.5px);">
                                    <g x="1" y="1">
                                        <polygon class="stroke" points="0,0 323,439 683,117"></polygon>
                                    </g>
                                </svg>
                            </div>
                        </div>
                        <div class="hero-background__shape hero-background__shape--stroke"
                             style="left: 1258px; top: 179.333px;">
                            <div class="hero-background__shape__transform">
                                <svg width="1017" height="683"
                                     style="transform: scale(1.33333) translate(-507.5px, -507.5px);">
                                    <g x="1" y="1">
                                        <polygon class="stroke" points="0,681 1015,202 432,0"></polygon>
                                    </g>
                                </svg>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="block-hero__body">
                <div class="block-hero__main">
                    <div class="block-hero__intro text-center">
                        <div class="hero-badge">
                            <span class="element-animated" data-animation="bounceIn" animation-delay="0">

                                @if(!empty($blog))
                                    <a href="{{ url('blog/'.str_slug($blog->title).'-'.$blog->id) }}"
                                       class="c-hero-badge" target="_blank">
                                    {{ $blog->title }} <i class="mdi mdi-chevron-right ml-2"></i>
                                </a>
                                @else
                                    <a href="/register"
                                       class="c-hero-badge" target="_blank">
                                    Nhanh tay đăng ký để tận hưởng ưu đãi từ ITRO <i
                                                class="mdi mdi-chevron-right ml-2"></i>
                                </a>
                                @endif
                            </span>
                        </div>
                        <h1 class="hero-title text-uppercase">
                            <span class="hero-title__word element-animated" data-animation="fadeInUp"
                                  animation-delay="0">Quản</span>
                            <span class="hero-title__word element-animated" data-animation="fadeInUp"
                                  animation-delay=".1s">lý</span>
                            <span class="hero-title__word element-animated" data-animation="fadeInUp"
                                  animation-delay=".2s">nhà</span>
                            <span class="hero-title__word element-animated" data-animation="fadeInUp"
                                  animation-delay=".3s">cho</span>
                            <span class="hero-title__word element-animated" data-animation="fadeInUp"
                                  animation-delay=".4s">thuê</span>
                            <br class="d-none d-md-block">
                            <span class="hero-title__word element-animated" data-animation="fadeInUp"
                                  animation-delay=".5s">cùng</span>
                            <span class="hero-title__word element-animated" data-animation="fadeInUp"
                                  animation-delay=".6s">iTro</span>
                        </h1>
                        <div class="hero-subtitle element-animated" data-animation="fadeInUp" animation-delay=".7s">
                            Giúp bạn quản lý nhà trọ, ký túc xá, homestay, kiot…
                            <br class="d-none d-lg-block">một cách chuyên nghiệp thay thế cho quản lý sổ sách, excel
                        </div>
                        <div class="hero-btns">
                            <a href="/login" class="btn btn-lg btn-primary element-animated" data-animation="fadeInUp"
                               animation-delay=".8s">Dùng thử</a>
                            <a href="/pricing" class="btn btn-lg btn-default element-animated" data-animation="fadeInUp"
                               animation-delay=".9s">Bảng giá</a>
                        </div>
                    </div>
                </div>
                <div class="block-hero__screenshot element-animated" data-animation="fadeIn" animation-delay=".1s">
                    <div class="container">
                        <div class="row justify-content-center">
                            <div class="col-md-10 col-xl-12">
                                <div class="screenshot-wrap">
                                    <img src="/quanlynhatro/assets/img/itro-devices.png" alt="">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </section>
    <!-- END hero -->
    <!-- features -->
    <section class="block-ld block-features">
        <div class="container">
            <div class="block-features__wrap">
                <div class="block-ld__header text-center">
                    <h2 class="block-ld__title text-uppercase element-animated" data-animation="a-ldTitle"
                        animation-delay="0">
                        Chúng tôi có
                    </h2>
                    <p class="block-ld__subtitle element-animated" data-animation="a-ldSubtitle" animation-delay=".2s">
                        Hàng ngàn chủ nhà đã vận hành và quản lý dễ dàng hơn rất nhiều sau khi đăng ký và sử dụng sản
                        phẩm
                        của chúng tôi
                    </p>
                </div>
                <div class="block-ld__main">
                    <div class="row">
                        <div class="col-12 col-md-4 mb-3 mb-md-1">
                            <div class="element-animated" style="height: 100%" data-animation="fadeInUp--sm"
                                 animation-delay="0">
                                <div class="c-card c-card-ft c-card--bd c-card--sd">
                                    <div class="c-card-ft__wrap">
                                        <div class="c-card-ft__media">
                                            <img src="/quanlynhatro/assets/img/chung-toi-co-1.svg"
                                                 alt="Alternate Text"/>
                                        </div>
                                        <div class="c-card-ft__main">
                                            <div class="main-pos-top">
                                                <div class="c-card-ft__tags">
                                                    <span class="badge badge--orange">Website</span>
                                                </div>
                                                <h3 class="c-card-ft__title">Web quản lý</h3>
                                                <p class="c-card-ft__descr">
                                                    Chủ nhà và nhân viên có thể truy cập tất cả các tính năng quản lý
                                                    bằng
                                                    việc đăng nhập vào <b class="text-uppercase">website quản lý</b>
                                                    trên
                                                    trình duyệt mà không cần cài đặt phần mềm vào máy tính.
                                                </p>
                                            </div>
                                            <!-- <div class="main-pos-bottom">
                                                <div class="c-card-ft__more">
                                                    <a href="#">Xem thêm<i class="mdi mdi-chevron-right"></i></a>
                                                </div>
                                            </div> -->
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-12 col-md-4 mb-3 mb-md-1">
                            <div class="element-animated" style="height: 100%" data-animation="fadeInUp--sm"
                                 animation-delay=".2s">
                                <div class="c-card c-card-ft c-card--bd c-card--sd">
                                    <div class="c-card-ft__wrap">
                                        <div class="c-card-ft__media">
                                            <img src="/quanlynhatro/assets/img/chung-toi-co-2.svg" alt="#"/>
                                        </div>
                                        <div class="c-card-ft__main">
                                            <div class="main-pos-top">
                                                <div class="c-card-ft__tags">
                                                    <span class="badge badge--teal">Mobile App</span>
                                                </div>
                                                <h3 class="c-card-ft__title">App quản lý</h3>
                                                <p class="c-card-ft__descr">
                                                    Bạn cũng có thể sử dụng app trên nền tảng <b>iOS</b> hoặc
                                                    <b>Android</b>
                                                    để quản lý, hỗ trợ việc quản lý được liên tục mọi lúc, mọi nơi. Mọi
                                                    dữ
                                                    liệu được bảo mật và đồng bộ.
                                                </p>
                                            </div>
                                            <!-- <div class="main-pos-bottom">
                                                <div class="c-card-ft__more">
                                                    <a href="#">Xem thêm<i class="mdi mdi-chevron-right"></i></a>
                                                </div>
                                            </div> -->
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-12 col-md-4 mb-3 mb-md-1">
                            <div class="element-animated" style="height: 100%" data-animation="fadeInUp--sm"
                                 animation-delay=".4s"
                            >
                                <div class="c-card c-card-ft c-card--bd c-card--sd">
                                    <div class="c-card-ft__wrap">
                                        <div class="c-card-ft__media">
                                            <img src="/quanlynhatro/assets/img/chung-toi-co-3.svg"
                                                 alt="Alternate Text"/>
                                        </div>
                                        <div class="c-card-ft__main">
                                            <div class="main-pos-top">
                                                <div class="c-card-ft__tags">
                                                    <span class="badge badge--cyan">Free</span>
                                                </div>
                                                <h3 class="c-card-ft__title">App cho khách thuê</h3>
                                                <div class="c-card-ft__descr">
                                                    Khách thuê tại nhà bạn cũng có thể sử dụng app <b
                                                            class="text-uppercase">hoàn
                                                        toàn miễn phí</b> để theo dõi hoá đơn hàng tháng, báo cáo sự cố
                                                    và
                                                    liên
                                                    lạc tới bạn hoặc quản lý nhà.
                                                </div>
                                            </div>
                                            <!-- <div class="main-pos-bottom">
                                                <div class="c-card-ft__more">
                                                    <a href="#">Xem thêm<i class="mdi mdi-chevron-right"></i></a>
                                                </div>
                                            </div> -->
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- END features -->
    <!-- benefits -->
    <section class="block-ld block-benefits block-ld--bg-gray01">
        <div class="container">
            <div class="block-benefits__wrap">
                <div class="block-ld__header text-center">
                    <h2 class="block-ld__title text-uppercase element-animated" data-animation="a-ldTitle"
                        animation-delay="0">
                        Quản lý & kinh doanh nhà cho thuê cùng ITRO
                    </h2>
                    <p class="block-ld__subtitle element-animated" data-animation="a-ldSubtitle" animation-delay=".2s">
                        Hàng ngàn chủ nhà đã vận hành và quản lý dễ dàng hơn rất nhiều sau khi đăng ký và sử dụng sản
                        phẩm
                        của chúng tôi
                    </p>
                </div>
                <div class="block-ld__main">
                    <div class="row">
                        <div class="col-12 col-md-4 mb-2">
                            <div class="c-card c-card-bn element-animated" data-animation="fadeInUp--sm"
                                 animation-delay="0">
                                <div class="c-card-bn__wrap">
                                    <div class="c-card-bn__icon">
                                        <img src="/quanlynhatro/assets/img/icon/it-qldnt.png" alt="Alternate Text"
                                             width="64px" height="64px"/>
                                    </div>
                                    <div class="c-card-bn__main">
                                        <h3 class="c-card-bn__title">Quản lý đa nền tảng</h3>
                                        <div class="c-card-bn__descr">Sử dụng trình duyệt trên máy tính hoặc ứng dụng
                                            trên
                                            smartphone với dữ liệu đồng bộ và bảo mật và backup thường xuyên.
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-12 col-md-4 mb-2">
                            <div class="c-card c-card-bn element-animated" data-animation="fadeInUp--sm"
                                 animation-delay=".15s">
                                <div class="c-card-bn__wrap">
                                    <div class="c-card-bn__icon">
                                        <img src="/quanlynhatro/assets/img/icon/it-lttt.png" alt="Alternate Text"
                                             width="64px" height="64px"/>
                                    </div>
                                    <div class="c-card-bn__main">
                                        <h3 class="c-card-bn__title">Lưu trữ thông tin</h3>
                                        <div class="c-card-bn__descr">Tất cả thông tin khách thuê được lưu trữ với đầy
                                            đủ
                                            thông tin. Bạn có thể tra cứu lại thông tin ngay cả khi khách thuê đã chuyển
                                            đi.
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-12 col-md-4 mb-2">
                            <div class="c-card c-card-bn element-animated" data-animation="fadeInUp--sm"
                                 animation-delay=".1s">
                                <div class="c-card-bn__wrap">
                                    <div class="c-card-bn__icon">
                                        <img src="/quanlynhatro/assets/img/icon/it-tkcp.png" alt="Alternate Text"
                                             width="64px" height="64px"/>
                                    </div>
                                    <div class="c-card-bn__main">
                                        <h3 class="c-card-bn__title">Tiết kiệm chi phí</h3>
                                        <div class="c-card-bn__descr">Hoá đơn được gửi qua app hoặc Zalo, Facebook giúp
                                            cho
                                            bạn tiết kiệm được chi phí về in ấn và chi phí đi lại.
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-12 col-md-4 mb-2">
                            <div class="c-card c-card-bn element-animated" data-animation="fadeInUp--sm"
                                 animation-delay=".075s">
                                <div class="c-card-bn__wrap">
                                    <div class="c-card-bn__icon">
                                        <img src="/quanlynhatro/assets/img/icon/it-dlat.png" alt="Alternate Text"
                                             width="64px" height="64px"/>
                                    </div>
                                    <div class="c-card-bn__main">
                                        <h3 class="c-card-bn__title">Dữ liệu an toàn</h3>
                                        <div class="c-card-bn__descr">Tất cả dữ liệu lưu trữ trên cloud và bảo mật giúp
                                            bạn
                                            không phải lo lắng mất dữ liệu như dùng với sổ sách hoặc bảng tính excel.
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-12 col-md-4 mb-2">
                            <div class="c-card c-card-bn element-animated" data-animation="fadeInUp--sm"
                                 animation-delay="0s">
                                <div class="c-card-bn__wrap">
                                    <div class="c-card-bn__icon">
                                        <img src="/quanlynhatro/assets/img/icon/it-qllh.png" alt="Alternate Text"
                                             width="64px" height="64px"/>
                                    </div>
                                    <div class="c-card-bn__main">
                                        <h3 class="c-card-bn__title">Quản lý linh hoạt</h3>
                                        <div class="c-card-bn__descr">Dù bạn quản lý theo mô hình truyền thống hay ký
                                            túc xá
                                            đều có thể áp dụng, các dịch vụ có thể khai báo linh hoạt.
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-12 col-md-4 mb-2">
                            <div class="c-card c-card-bn element-animated" data-animation="fadeInUp--sm"
                                 animation-delay=".05s">
                                <div class="c-card-bn__wrap">
                                    <div class="c-card-bn__icon">
                                        <img src="/quanlynhatro/assets/img/icon/it-tickt.png" alt="Alternate Text"
                                             width="64px" height="64px"/>
                                    </div>
                                    <div class="c-card-bn__main">
                                        <h3 class="c-card-bn__title">Tiện ích cho khách thuê</h3>
                                        <div class="c-card-bn__descr">Khách thuê tại nhà bạn có thể tra cứu hoá đơn của
                                            họ
                                            bất cứ lúc nào mà không cần phải lưu lại các hoá đơn giấy.
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- END benefits -->
    <!--showcase-->
    <div class="block-showcase block-ld">
        <div class="block-showcase__wrap">
            <div class="container">
                <div class="block-ld__header text-center">
                    <h2 class="block-ld__title text-uppercase element-animated" data-animation="a-ldTitle"
                        animation-delay="0">
                        ITRO không chỉ phục vụ mình bạn mà còn cả khách thuê của bạn
                    </h2>
                    <p class="block-ld__subtitle element-animated" data-animation="a-ldSubtitle" animation-delay=".2s">
                        Khách thuê của bạn sẽ được trải nghiệm việc ở thuê một cách hiện đại hơn mà không mất thêm bất
                        kỳ
                        khoản phí nào từ chúng tôi
                    </p>
                </div>
            </div>
        </div>
        <div class="container px-0">
            <div class="block-ld__main">
                <div class="block-showcase-acd">
                    <div class="accordion-media">
                        <div class="element-animated" data-animation="bounceIn" animation-delay="0">
                            <div class="accordion-media__wrap">
                                <div id="Showcase-01" class="showcase-wrap active">
                                    <div class="el-grp__montage">
                                        <div class="el-grp__montage__layer"
                                             style="transform: rotateY(-2.75deg) rotateX(0.4475deg) translateZ(-160px);">
                                            <svg class="el-grp__montage__layer__el" style="left: -120px; top: 0px;"
                                                 width="1000px" height="760px" viewBox="0 0 1000 760" version="1.1"
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 xmlns:xlink="http://www.w3.org/1999/xlink">
                                                <defs>
                                                    <linearGradient x1="25.3755468%" y1="74.5073739%" x2="76.2487215%"
                                                                    y2="19.7317807%" id="linearGradient-1">
                                                        <stop stop-color="#E64C4C" offset="0%"></stop>
                                                        <stop stop-color="#FB8332" offset="100%"></stop>
                                                    </linearGradient>
                                                    <linearGradient x1="0%" y1="0%" x2="50%" y2="100%"
                                                                    id="linearGradient-2">
                                                        <stop stop-color="#FB8332" offset="0%"></stop>
                                                        <stop stop-color="#F8C332" offset="100%"></stop>
                                                    </linearGradient>
                                                </defs>
                                                <circle id="Oval" fill="#F7B500" opacity="0.1" cx="815" cy="200"
                                                        r="170"></circle>
                                                <circle id="Oval" fill="url(#linearGradient-1)" cx="140" cy="365"
                                                        r="102"></circle>
                                                <circle id="Oval" fill="url(#linearGradient-2)" cx="500" cy="520"
                                                        r="200"></circle>
                                            </svg>
                                        </div>
                                        <div class="el-grp__montage__layer"
                                             style="transform: rotateY(-2.75deg) rotateX(0.4475deg) translateZ(-80px);">
                                            <svg class="el-grp__montage__layer__el" style="left: -120px; top: 0px"
                                                 width="1000px" height="760px" viewBox="0 0 1000 760" version="1.1"
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 xmlns:xlink="http://www.w3.org/1999/xlink">
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="797"
                                                        cy="195" r="170"></circle>
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="150"
                                                        cy="375" r="102"></circle>
                                                <circle id="Oval" fill="none" stroke="#FAD266" opacity="0.4" cx="515"
                                                        cy="535" r="200"></circle>
                                            </svg>
                                        </div>
                                        <div class="el-grp__montage__layer"
                                             style="transform: rotateY(-2.75deg) rotateX(0.4475deg) translateZ(0px);">
                                            <img class="el-grp__montage__layer__el"
                                                 src="/quanlynhatro/assets/img/sc/khach-1-1.svg" width="365"
                                                 height="507"
                                                 style="left: 40px; top: 130px;">
                                        </div>
                                        <div class="el-grp__montage__layer"
                                             style="transform: rotateY(-2.75deg) rotateX(0.4475deg) translateZ(60px);">
                                            <img class="el-grp__montage__layer__el"
                                                 src="/quanlynhatro/assets/img/sc/khach-1-2.svg" width="276"
                                                 height="165"
                                                 style="left: 200px; top: 400px;">
                                        </div>
                                        <!-- <div class="el-grp__montage__layer" style="transform: rotateY(-2.75deg) rotateX(0.4475deg) translateZ(120px);">
                                            <img class="el-grp__montage__layer__el" src="/quanlynhatro/assets/img/sc/sc-1-3.png" width="320" height="427" style="left: 380px; top: 220px;">
                                        </div> -->
                                    </div>
                                </div>
                                <div id="Showcase-02" class="showcase-wrap">
                                    <div class="el-grp__montage">
                                        <div class="el-grp__montage__layer"
                                             style="transform: rotateY(-3.715deg) rotateX(0.5525deg) translateZ(-160px);">
                                            <svg class="el-grp__montage__layer__el" style="left: -120px; top: 0px;"
                                                 width="1000px" height="760px" viewBox="0 0 1000 760" version="1.1"
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 xmlns:xlink="http://www.w3.org/1999/xlink">
                                                <circle id="Oval" fill="#F7B500" opacity="0.1" cx="720" cy="240"
                                                        r="200"></circle>
                                                <circle id="Oval" fill="url(#linearGradient-1)" cx="410" cy="560"
                                                        r="132"></circle>
                                                <circle id="Oval" fill="url(#linearGradient-2)" cx="240" cy="270"
                                                        r="220"></circle>
                                            </svg>
                                        </div>
                                        <div class="el-grp__montage__layer"
                                             style="transform: rotateY(-3.715deg) rotateX(0.5525deg) translateZ(-80px);">
                                            <svg class="el-grp__montage__layer__el" style="left: -120px; top: 0px"
                                                 width="1000px" height="760px" viewBox="0 0 1000 760" version="1.1"
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 xmlns:xlink="http://www.w3.org/1999/xlink">
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="720"
                                                        cy="235" r="200"></circle>
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="420"
                                                        cy="575" r="132"></circle>
                                                <circle id="Oval" fill="none" stroke="#FAD266" opacity="0.4" cx="250"
                                                        cy="284" r="220"></circle>
                                            </svg>
                                        </div>
                                        <div class="el-grp__montage__layer"
                                             style="transform: rotateY(-3.715deg) rotateX(0.5525deg) translateZ(0px);">
                                            <img class="el-grp__montage__layer__el"
                                                 src="/quanlynhatro/assets/img/sc/khach-2-1.svg" width="365"
                                                 height="507"
                                                 alt="" style="left:37px; top:130px;">
                                        </div>
                                        <div class="el-grp__montage__layer"
                                             style="transform: rotateY(-3.715deg) rotateX(0.5525deg) translateZ(60px);">
                                            <img class="el-grp__montage__layer__el"
                                                 src="/quanlynhatro/assets/img/sc/khach-2-2.svg" width="200"
                                                 height="200"
                                                 alt="" style="left:200px; top: 360px;">
                                        </div>
                                    </div>
                                </div>
                                <div id="Showcase-03" class="showcase-wrap">
                                    <div class="el-grp__montage">
                                        <div class="el-grp__montage__layer">
                                            <svg class="el-grp__montage__layer__el" style="left: -120px; top: 0px;"
                                                 width="1000px" height="760px" viewBox="0 0 1000 760" version="1.1"
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 xmlns:xlink="http://www.w3.org/1999/xlink">
                                                <circle id="Oval" fill="#F7B500" opacity="0.1" cx="230" cy="240"
                                                        r="218"></circle>
                                                <circle id="Oval" fill="#F7B500" cx="807" cy="125" r="102"></circle>
                                                <circle id="Oval" fill="#F7B500" cx="550" cy="522" r="203"></circle>
                                            </svg>
                                        </div>
                                        <div class="el-grp__montage__layer">
                                            <svg class="el-grp__montage__layer__el" style="left: -120px; top: 0px"
                                                 width="1000px" height="760px" viewBox="0 0 1000 760" version="1.1"
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 xmlns:xlink="http://www.w3.org/1999/xlink">
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="248"
                                                        cy="250" r="218"></circle>
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="790"
                                                        cy="146" r="102"></circle>
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="427"
                                                        cy="442" r="203"></circle>
                                                <circle id="Oval" fill="none" stroke="#FAD266" opacity="0.4" cx="544"
                                                        cy="530" r="203"></circle>
                                            </svg>
                                        </div>
                                        <div class="el-grp__montage__layer">
                                            <img class="el-grp__montage__layer__el"
                                                 src="/quanlynhatro/assets/img/sc/khach-3-1.svg" width="365"
                                                 height="507"
                                                 alt="" style="left:35px; top:130px;">
                                        </div>
                                        <div class="el-grp__montage__layer">
                                            <img class="el-grp__montage__layer__el"
                                                 src="/quanlynhatro/assets/img/sc/khach-3-2.svg" width="150"
                                                 height="300"
                                                 alt="" style="left:300px; top: 350px;">
                                        </div>
                                        <!-- <div class="el-grp__montage__layer">
                                            <img class="el-grp__montage__layer__el" src="https://cdn.sketchapp.com//quanlynhatro/assets/pages/home/cloud-handoff-color-popover.png" width="142" height="216" alt="" style="left:484px; top: 435px;">
                                        </div> -->
                                    </div>
                                </div>
                                <div id="Showcase-04" class="showcase-wrap">
                                    <div class="el-grp__montage">
                                        <div class="el-grp__montage__layer">
                                            <svg class="el-grp__montage__layer__el" style="left: -120px; top: 0px;"
                                                 width="1000px" height="760px" viewBox="0 0 1000 760" version="1.1"
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 xmlns:xlink="http://www.w3.org/1999/xlink">
                                                <circle id="Oval" fill="#F7B500" opacity="0.1" cx="510" cy="540"
                                                        r="190"></circle>
                                                <circle id="Oval" fill="url(#linearGradient-1)" cx="180" cy="220"
                                                        r="160"></circle>
                                                <circle id="Oval" fill="url(#linearGradient-2)" cx="800" cy="180"
                                                        r="170"></circle>
                                            </svg>
                                        </div>
                                        <div class="el-grp__montage__layer">
                                            <svg class="el-grp__montage__layer__el" style="left: -120px; top: 0px"
                                                 width="1000px" height="760px" viewBox="0 0 1000 760" version="1.1"
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 xmlns:xlink="http://www.w3.org/1999/xlink">
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="500"
                                                        cy="530" r="190"></circle>
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="190"
                                                        cy="240" r="160"></circle>
                                                <circle id="Oval" fill="none" stroke="#FA6400" opacity="0.4" cx="550"
                                                        cy="280" r="203"></circle>
                                                <circle id="Oval" fill="none" stroke="#FAD266" opacity="0.4" cx="810"
                                                        cy="210" r="170"></circle>
                                            </svg>
                                        </div>
                                        <div class="el-grp__montage__layer">
                                            <img class="el-grp__montage__layer__el"
                                                 src="/quanlynhatro/assets/img/sc/khach-4-1.svg" width="365"
                                                 height="507"
                                                 alt="" style="left:28px; top:130px;">
                                        </div>
                                        <div class="el-grp__montage__layer">
                                            <img class="el-grp__montage__layer__el"
                                                 src="/quanlynhatro/assets/img/sc/khach-4-2.svg" width="186"
                                                 height="371"
                                                 alt="" style="left:300px; top: 300px;">
                                        </div>
                                        <!-- <div class="el-grp__montage__layer">
                                            <img class="el-grp__montage__layer__el" src="https://cdn.sketchapp.com//quanlynhatro/assets/pages/home/cloud-web-user-settings.png" width="145" height="143" alt="" style="left:504px; top: 461px;">
                                        </div> -->
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="accordion accordion-showcase" id="Accordion-Showcase">
                        <div class="accordion-showcase__single element-animated" data-animation="fadeInUp--xs"
                             animation-delay="0">
                            <div class="showcase-item">
                                <h3 class="showcase-item__title">
                                    <a href="#Accordion-Showcase-Collapse01" class="" data-toggle="collapse"
                                       data-showcase="Showcase-01">
                                        Theo dõi hoá đơn hàng tháng
                                    </a>
                                </h3>
                                <div id="Accordion-Showcase-Collapse01" class="showcase-item__main collapse show"
                                     data-parent="#Accordion-Showcase">
                                    <div class="showcase-item__main-wrap">
                                        <p class="showcase-item__descr">
                                            Hàng tháng khi bạn chốt hoá đơn tiền nhà, tiền dịch vụ thì khách thuê sẽ
                                            nhận
                                            được thông báo qua ứng dụng.
                                            Các hoá đơn sẽ được lưu trữ từ khi khách ở đến khi khách chuyển đi.
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="accordion-showcase__single element-animated" data-animation="fadeInUp--xs"
                             animation-delay=".1s">
                            <div class="showcase-item">
                                <h3 class="showcase-item__title">
                                    <a href="#Accordion-Showcase-Collapse02" class="collapsed" data-toggle="collapse"
                                       data-showcase="Showcase-02">
                                        Theo dõi lịch sử thanh toán
                                    </a>
                                </h3>
                                <div id="Accordion-Showcase-Collapse02" class="showcase-item__main collapse"
                                     data-parent="#Accordion-Showcase">
                                    <div class="showcase-item__main-wrap">
                                        <p class="showcase-item__descr">
                                            Tra cứu lịch sử đóng tiền của chính mình theo dòng thời gian.
                                            Giúp khách thuê biết được mình đã thanh toán bao nhiêu và còn phải thanh
                                            toán
                                            bao nhiêu nữa.
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="accordion-showcase__single element-animated" data-animation="fadeInUp--xs"
                             animation-delay=".2s">
                            <div class="showcase-item">
                                <h3 class="showcase-item__title">
                                    <a href="#Accordion-Showcase-Collapse03" class="collapsed" data-toggle="collapse"
                                       data-showcase="Showcase-03">
                                        Báo cáo sự cố, hỏng hóc
                                    </a>
                                </h3>
                                <div id="Accordion-Showcase-Collapse03" class="showcase-item__main collapse"
                                     data-parent="#Accordion-Showcase">
                                    <div class="showcase-item__main-wrap">
                                        <p class="showcase-item__descr">
                                            Khách thuê có thể báo cáo sự cố trực tiếp cho chủ nhà hoặc nhân viên ngay
                                            trên
                                            ứng dụng.
                                            Theo dõi tiến độ và nhận thông báo về tình trạng sửa chữa.
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="accordion-showcase__single element-animated" data-animation="fadeInUp--xs"
                             animation-delay=".2s">
                            <div class="showcase-item">
                                <h3 class="showcase-item__title">
                                    <a href="#Accordion-Showcase-Collapse04" class="collapsed" data-toggle="collapse"
                                       data-showcase="Showcase-04">
                                        Khai báo thông tin tạm trú
                                    </a>
                                </h3>
                                <div id="Accordion-Showcase-Collapse04" class="showcase-item__main collapse"
                                     data-parent="#Accordion-Showcase">
                                    <div class="showcase-item__main-wrap">
                                        <p class="showcase-item__descr">
                                            Kê khai thông tin cá nhân như mẫu đăng ký tạm trú và gửi cho chủ nhà.
                                            Chủ nhà có thể in ra và tiến hành kê khai tạm trú cho khách hàng.
                                        </p>
                                        <!--<div class="showcase-item__action">
                                            <a href="#" class="view-link">Xem thêm <i class="mdi mdi-chevron-right"></i>  </a>
                                        </div>-->
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--END showcase-->
    <!--reveal-->
    <div class="block-ld block-reveals block-ld--bg-gradient-top">
        <div class="container">
            <div class="block-reveals__wrap">
                <div class="block-ld__header text-center">
                    <h2 class="block-ld__title text-uppercase element-animated" data-animation="a-ldTitle"
                        animation-delay="0">
                        Chúng tôi đã sẵn sàng phục vụ bạn với những tính năng tuyệt vời
                    </h2>
                    <p class="block-ld__subtitle element-animated" data-animation="a-ldSubtitle" animation-delay=".2s">
                        Những tính năng hiện tại được itro cung cấp đã đáp ứng hầu hết các nghiệp vụ quản lý mà một chủ
                        nhà
                        mong muốn. Chúng tôi luôn lắng nghe ý kiến của bạn để có thể nâng cấp và bổ sung thêm tính năng
                        mới.
                    </p>
                </div>
                <div class="block-ld__main">
                    <div class="row">
                        <div class="col-12 col-md-6 mb-3 mb-md-4">
                            <a href="#" class="c-card c-card-ft c-card-ft--rv c-card--bd c-card--sd element-animated"
                               data-animation="fadeInLeft--sm" animation-delay="0">
                                <div class="c-card-ft__wrap">
                                    <div class="c-card-ft__icon">
                                        <img src="/quanlynhatro/assets/img/icon/tn_qln.png" alt="#"/>
                                    </div>
                                    <div class="c-card-ft__main">
                                        <div class="main-pos-top">
                                            <h3 class="c-card-ft__title">Quản lý nhà</h3>
                                            <div class="c-card-ft__descr">Bao gồm mô hình nhà trọ truyền thống và mô
                                                hình
                                                homestay, ký túc xá; quản lý nhiều nhà trong cùng một thời điểm
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="col-12 col-md-6 mb-3 mb-md-4">
                            <a href="#" class="c-card c-card-ft c-card-ft--rv c-card--bd c-card--sd element-animated"
                               data-animation="fadeInRight--sm" animation-delay=".4s">
                                <div class="c-card-ft__wrap">
                                    <div class="c-card-ft__icon">
                                        <img src="/quanlynhatro/assets/img/icon/tn_qlpg.png" alt="Alternate Text"/>
                                    </div>
                                    <div class="c-card-ft__main">
                                        <div class="main-pos-top">
                                            <h3 class="c-card-ft__title">Quản lý phòng, giường</h3>
                                            <div class="c-card-ft__descr">Quản lý danh sách phòng, giường và các thông
                                                tin
                                                liên quan: tình trạng, giá thuê, khách thuê…
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="col-12 col-md-6 mb-3 mb-md-4">
                            <a href="#" class="c-card c-card-ft c-card-ft--rv c-card--bd c-card--sd element-animated"
                               data-animation="fadeInLeft--sm" animation-delay=".2s">
                                <div class="c-card-ft__wrap">
                                    <div class="c-card-ft__icon">
                                        <img src="/quanlynhatro/assets/img/icon/tn_qlkt.png" alt="Alternate Text"/>
                                    </div>
                                    <div class="c-card-ft__main">
                                        <div class="main-pos-top">
                                            <h3 class="c-card-ft__title">Quản lý khách thuê</h3>
                                            <div class="c-card-ft__descr">Quản lý thông tin khách thuê, hình ảnh chứng
                                                minh
                                                thư; quản lý phương tiện của khách thuê.
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="col-12 col-md-6 mb-3 mb-md-4">
                            <a href="#" class="c-card c-card-ft c-card-ft--rv c-card--bd c-card--sd element-animated"
                               data-animation="fadeInRight--sm" animation-delay=".6s">
                                <div class="c-card-ft__wrap">
                                    <div class="c-card-ft__icon">
                                        <img src="/quanlynhatro/assets/img/icon/tn_qltc.png" alt="Alternate Text"/>
                                    </div>
                                    <div class="c-card-ft__main">
                                        <div class="main-pos-top">
                                            <h3 class="c-card-ft__title">Quản lý tài chính</h3>
                                            <div class="c-card-ft__descr">Theo dõi tình trạng thanh toán của khách thuê;
                                                theo dõi chi phí và thống kê lời lỗ theo thời gian.
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="col-12 col-md-6 mb-3 mb-md-4">
                            <a href="#" class="c-card c-card-ft c-card-ft--rv c-card--bd c-card--sd element-animated"
                               data-animation="fadeInLeft--sm" animation-delay="0">
                                <div class="c-card-ft__wrap">
                                    <div class="c-card-ft__icon">
                                        <img src="/quanlynhatro/assets/img/icon/tn_qlts.png" alt="Alternate Text"/>
                                    </div>
                                    <div class="c-card-ft__main">
                                        <div class="main-pos-top">
                                            <h3 class="c-card-ft__title">Quản lý tài sản</h3>
                                            <div class="c-card-ft__descr">Quản lý các danh mục tài sản trong từng phòng.
                                                Theo dõi, thống kê tài sản trên toàn hệ thống
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="col-12 col-md-6 mb-3 mb-md-4">
                            <a href="#" class="c-card c-card-ft c-card-ft--rv c-card--bd c-card--sd element-animated"
                               data-animation="fadeInRight--sm" animation-delay=".4s">
                                <div class="c-card-ft__wrap">
                                    <div class="c-card-ft__icon">
                                        <img src="/quanlynhatro/assets/img/icon/tn_pqnv.png" alt="Alternate Text"/>
                                    </div>
                                    <div class="c-card-ft__main">
                                        <div class="main-pos-top">
                                            <h3 class="c-card-ft__title">Phân quyền nhân viên</h3>
                                            <div class="c-card-ft__descr">Quản lý danh sách nhân viên; phân quyền cho
                                                từng
                                                nhân viên quản lý theo nhà và theo tính năng.
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="col-12 col-md-6 mb-3 mb-md-4">
                            <a href="#" class="c-card c-card-ft c-card-ft--rv c-card--bd c-card--sd element-animated"
                               data-animation="fadeInLeft--sm" animation-delay=".2s">
                                <div class="c-card-ft__wrap">
                                    <div class="c-card-ft__icon">
                                        <img src="/quanlynhatro/assets/img/icon/tn_qlsc.png" alt="Alternate Text"/>
                                    </div>
                                    <div class="c-card-ft__main">
                                        <div class="main-pos-top">
                                            <h3 class="c-card-ft__title">Quản lý sự cố</h3>
                                            <div class="c-card-ft__descr">Nhận các thông báo sự cố từ khách thuê và theo
                                                dõi, tình trạng khắc phục sự cố của nhân viên
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="col-12 col-md-6 mb-3 mb-md-4">
                            <a href="#" class="c-card c-card-ft c-card-ft--rv c-card--bd c-card--sd element-animated"
                               data-animation="fadeInRight--sm" animation-delay=".6s">
                                <div class="c-card-ft__wrap">
                                    <div class="c-card-ft__icon">
                                        <img src="/quanlynhatro/assets/img/icon/tn_cd.png" alt="Alternate Text"/>
                                    </div>
                                    <div class="c-card-ft__main">
                                        <div class="main-pos-top">
                                            <h3 class="c-card-ft__title">Cài đặt</h3>
                                            <div class="c-card-ft__descr">Cài đặt các mẫu hợp đồng, phiếu thu, phiếu
                                                chi,
                                                hoá đơn, logo thương hiệu…
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
                <div class="block-ld__footer text-center">
                    <p class="text-primary"><i>...và rất nhiều tính năng thú vị nữa đang chờ bạn trải nghiệm</i></p>
                </div>
            </div>
        </div>
    </div>
    <!--END reveal-->
    <!--clients-->
    <div class="block-clients">
        <div class="container">
            <div class="block-clients__wrap">
                <h3 class="block-clients__title text-center text-uppercase element-animated"
                    data-animation="a-ldSubtitle">
                    Khách hàng tiêu biểu đang sử dụng ITRO</h3>
                <div class="block-clients__main element-animated" data-animation="fadeInUp--sm" animation-delay=".1s">
                    <div class="block-clients__list">
                        <div class="row align-items-center">
                            @php
                                $users = App\User::query()->where( 'is_partner_logo', true )
                     ->has( 'logoExist' )
                     ->with( 'logoExist' )
                     ->where( 'type', App\User::OWNER )
                     ->get();
                            @endphp
                            @foreach($users as $user)
                                <div class="col-5 col-sm-4 col-lg-2">
                                    <div class="single-client-logo"><img src="/files/{{ $user->logoExist->logo}}"
                                                                         alt="Alternate Text"/></div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--END clients-->
    <!--call to action-->
    <div class="block-cta">
        <div class="container">
            <div class="block-cta__wrap shadow element-animated" data-animation="fadeInUp" animation-delay="0">
                <div class="row align-items-lg-center">
                    <div class="col-lg">
                        <h2 class="cta-title">Bắt đầu cùng iTro ngay hôm nay</h2>
                        <p class="cta-subtitle">Bạn sẽ có 30 ngày dùng thử miễn phí trước khi quyết định sử dụng và trả
                            phí
                            lâu dài.</p>
                    </div>
                    <div class="col-lg-auto mt-4 mt-lg-0 ml-lg-2">
                        <div class="cta-actions">
                            <a href="/login" class="btn btn-lg btn-primary">Dùng thử</a>
                            <a href="/pricing" class="btn btn-lg btn-default">Bảng giá</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--END call to action-->

@endsection