{% extends 'layout.server.view.html' %} {% block cssFile %} {% endblock %} {% block content %}
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<style>
    .icon-column.center-icon-column.col-md-2.col-sm-4.col-xs-6 {
        float: left;
        width: 19.5%;
        padding: 0;
        margin: 0 auto;
        margin-right: 0.5%;
        height: 100%;
        min-height: 0;
    }

    .section-services .container .row .icon-kd {
        text-align: center;
    }

    .section-services .container .row .icon-kd .icon-column h4.montserrat-font {
        font-size: 14px;
        color: #333;
    }

    .section-services .container .row .icon-kd .icon-column a {
        text-decoration: none;
    }

    @media only screen and (max-width:767px) {
        .icon-column.center-icon-column.col-md-2.col-sm-4.col-xs-6 {
            width: 50%;
            margin: auto;
            margin-right: 0;
            padding: 0;
        }
    }
</style>
<!-- banner -->
<!-- <div class="banner">
    <h3 style="display: none;" class="sub-banner">Giải pháp hóa đơn điện tử TIN CẬY NHẤT</h3>
</div> -->
<!-- slider -->
<div class="slider" style="position:relative">
    <div id="jssor_1"
        style="position:relative;margin:0 auto;top:0px;left:0px;width:1300px;height:450px;overflow:hidden;">
        <!-- Loading Screen -->
        <div data-u="loading" class="jssorl-009-spin"
            style="position:absolute;top:0px;left:0px;width:100%;height:100%;text-align:center;background-color:rgba(0,0,0,0.7);">
            <img style="margin-top:-19px;position:relative;top:50%;width:38px;height:38px;"
                src="/img/slider/spin.svg" />
        </div>
        <div data-u="slides"
            style="cursor:default;position:relative;top:0px;left:0px;width:1300px;height:450px;overflow:hidden;">
            <div>
                <img style="height: 450px;width: 100%;" data-u="image" src="https://i.imgur.com/QCiOQIf.jpg" />
            </div>
            <div>
                <img style="height: 450px;width: 100%;" data-u="image" src="https://i.imgur.com/6Ljug5X.png" />
            </div>
            <div>
                <img style="height: 450px;width: 100%;" data-u="image" src="https://i.imgur.com/pkumn5a.png" />
            </div>
            <div>
                <img style="height: 450px;width: 100%;" data-u="image" src="https://i.imgur.com/Cz15x8X.png" />
            </div>

        </div>

        <!-- Bullet Navigator -->
        <div data-u="navigator" class="jssorb032" style="position:absolute;bottom:25px;right:12px;" data-autocenter="1"
            data-scale="0.5" data-scale-bottom="0.75">
            <div data-u="prototype" class="i" style="width:16px;height:16px;">
                <svg viewbox="0 0 16000 16000" style="position:absolute;left:0;width:100%;height:100%;">
                    <circle class="b" cx="8000" cy="8000" r="5800"></circle>
                </svg>
            </div>
        </div>
    </div>
</div>


<!-- Giới thiệu -->
<div class="section-heading support-heading">
    <h2 class="title-gt">Chào mừng bạn đến với A Hóa Đơn </h2>
</div>
<div class="carousel-wrapper">
    <div class="container">
        <div class="row">

            <div class="col-md-4">
                <h3 class="sub-gt">GIỚI THIỆU</h3>
                <p> <strong>A Hoá Đơn</strong> là phần mềm hoá đơn điện tử của <strong>Tập Đoàn Không Gian
                        Số</strong>,
                    người đồng hành tin cậy của mọi kế
                    toán.
                </p>
                <p>
                    <span style="padding-right: 5px;">
                        <i class="material-icons">
                            check
                        </i>
                    </span>
                    Đáp ứng đầy đủ nghiệp vụ về hóa đơn theo đúng Nghị định 119/2018/NĐ-CP, Thông tư 32/2011/TT-BTC,
                    Thông tư
                    39/2014/TT-BTC... và sẵn sàng đáp ứng Thông tư 68/2019/TT-BTC.
                </p>
                <p>
                    <span style="padding-right: 5px;">
                        <i class="material-icons">
                            check
                        </i>
                    </span>
                    Người mua tức thời nhận được hóa đơn điện tử qua Email, SMS; tra cứu và lưu
                    trữ hoá đơn dưới định dạng chuẩn XML.
                </p>
                <p>
                    <span style="padding-right: 5px;">
                        <i class="material-icons">
                            check
                        </i>
                    </span>
                    Sẵn sàng kết nối với các phần mềm kế toán, phần mềm bán hàng và các phần mềm quản trị khác của doanh
                    nghiệp.
                </p>
                <p>
                    <span style="padding-right: 5px;">
                        <i class="material-icons">
                            check
                        </i>
                    </span>
                    Giảm thời gian tuân thủ thủ tục hành chính thuế cho kế toán.
                </p>

            </div>
            <div class="col-md-8">
                <div class="page_width">
                    <div class="desktop-container">
                        <div class="carousel-slide carousel-slide-desktop owl-carousel" style="display: none;">
                            <div class="item">
                                <img src="/img/web1.png" alt="tổng quan">
                            </div>
                            <div class="item">
                                <img src="/img/web2.png" alt="pos siêu thị">
                            </div>
                        </div>
                    </div>
                    <div class="mobile-container">
                        <div class="carousel-slide carousel-slide-mobile owl-carousel" style="display: none;">
                            <div class="item">
                                <img src="/img/mobile1.png" alt="đăng nhập mobile">
                            </div>
                            <div class="item">
                                <img src="/img/mobile2.png" alt="lựa chọn">
                            </div>
                            <div class="item">
                                <img src="/img/mobile3.png" alt="đăng ký mobile">
                            </div>
                            <div class="item">
                                <img src="/img/mobile4.png" alt="hóa đơn mobile">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="form-button">
    <div class="container">
        <div class="row register-form">
            <!-- <div class="col-md-4"> -->
            <a class="button buy-now" href="/bang-gia">
                Mua ngay
            </a>
            <!-- </div> -->
            <!-- <div class="col-md-4"> -->
            <a href="/dang-ky" class="button use-trial">Dùng thử</a>
            <!-- </div> -->
            <!-- <div class="col-md-4"> -->
            <a href="/dang-ky-lam-dai-ly" class="button agency">Đăng ký đại lý</a>
            <!-- </div> -->
        </div>
    </div>
</div>

<!-- Lợi ich -->
<div class="section-benefit">
    <div class="container">
        <div class="section-heading center-heading benefit">
            <h2>LỢI ÍCH SỬ DỤNG HÓA ĐƠN VIỆT
            </h2>
        </div>
        <div class="row clearfix">
            <div class="col col-xs-12 col-md-3 item">
                <div class="item-child">
                    <div class="img">
                        <img src="https://i.imgur.com/rwH46lu.png" alt="Tiết kiệm">
                    </div>
                    <div class="title">
                        Tiết kiệm
                    </div>
                    <div class="desc_ct">Tiết kiệm 90% chi phí in ấn, vận chuyển, lưu trữ và bảo quản hóa đơn</div>
                </div>
            </div>
            <div class="col col-xs-12 col-md-3 item">
                <div class="item-child">
                    <div class="img">
                        <img src="https://i.imgur.com/9KbTF1Z.png" alt="An toàn">
                    </div>
                    <div class="title">
                        An toàn
                    </div>
                    <div class="desc_ct">Không xảy ra cháy, hỏng, mất hóa đơn. Tăng độ tin cậy cho hóa đơn của doanh
                        nghiệp
                    </div>
                </div>
            </div>

            <div class="col col-xs-12 col-md-3 item">
                <div class="item-child">
                    <div class="img">
                        <img src="https://i.imgur.com/bLFwXAQ.png" alt="Nhanh chóng">
                    </div>
                    <div class="title">
                        Nhanh chóng
                    </div>
                    <div class="desc_ct">Người mua tức thời nhận được hóa đơn, rút ngắn thời gian thu nợ
                    </div>
                </div>
            </div>
            <div class="col col-xs-12 col-md-3 item">
                <div class="item-child">
                    <div class="img">
                        <img src="https://i.imgur.com/Ee2vH8G.png" alt="Bảo vệ môi trường">
                    </div>
                    <div class="title">
                        Bảo vệ môi trường
                    </div>
                    <div class="desc_ct">Giảm bớt việc sử dụng giấy, góp phần bảo vệ môi trường
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Tinh năng -->
<div class="section-tab">
    <div class="container">
        <div class="section-heading center-heading feature">
            <h2>TÍNH NĂNG NỔI BẬT</h2>
        </div>
    </div>
    <div class="tab-wrapper">
        <div class="tab-block">
            <ul class="nav nav-tabs" role="tablist">
                <li class="hover-feature" role="presentation"><a href="#fea_pos" aria-controls="fea_pos" role="tab"
                        data-toggle="tab">Hệ thống nền tảng</a></li>
                <li class="active" role="presentation"><a href="#tab_fea2" aria-controls="tab_fea2" role="tab"
                        data-toggle="tab">Tiện ích khác biệt</a></li>
                <li class="hover-feature" role="presentation"><a href="#tab_fea3" aria-controls="tab_fea3" role="tab"
                        data-toggle="tab">Khả năng mở rộng - kết nối</a></li>
            </ul>
            <div class="tab-content">
                <div class="tab-pane " role="tabpanel" id="fea_pos">
                    <div class="container">
                        <div class="section-post">
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="fearture-image">
                                        <a href="#"><img src="/img/he-thong-nen-tang.png" alt="Hệ thống nền tảng" /></a>
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="post-content">
                                        <ul class="list">
                                            <li>
                                                <span>Hệ thống phần mềm hoạt động online trên internet, sử dụng phiên
                                                    bản website tiện lợi, thân thiện cho người dùng.</span>
                                            </li>
                                            <li>
                                                <span>Giao diện trực quan thân thiện, dễ dàng sử dụng. Hệ thống gửi mail
                                                    thông báo hóa đơn và dễ dàng tra cứu hóa đơn.</span>
                                            </li>
                                            <li>
                                                <span>Hệ thống hỗ trợ lưu trữ online và offline. Đảm bảo hoạt động thông
                                                    suốt 24/24.</span>
                                            </li>
                                            <li>
                                                <span>Có sẵn kho mẫu hóa đơn đa dạng do đó khách hàng có thể chủ động
                                                    lựa chọn mẫu hóa đơn hoặc sử dụng dịch vụ thiết kế mẫu hóa đơn theo
                                                    yêu cầu riêng của doanh nghiệp.</span>
                                            </li>
                                            <li>
                                                <span>Hệ thống sử dụng tường lửa, hệ thống cân bằng tải, backup dữ liệu
                                                    thường xuyền, đảm bảo tuyệt đối dữ liệu khách hàng.</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane active" role="tabpanel" id="tab_fea2">
                    <div class="container">
                        <div class="section-post">
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="fearture-image">
                                        <a href="#"><img src="/img/tien-ich-khac-biet.png"
                                                alt="Tiện ích khác biệt" /></a>
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="post-content">
                                        <ul class="list">
                                            <li>
                                                <span>Hệ thống hỗ trợ cơ sở dữ liệu phân tán hoặc tập trung, có thể đặt
                                                    ở nhiều nơi, đảm bảo dữ liệu của khác hàng được lưu riêng biệt, bảo
                                                    mật.
                                                </span>
                                            </li>
                                            <li>
                                                <span>Hệ thống hỗ trợ tìm kiếm dữ liệu lớn 1 cách nhanh chóng, khách
                                                    hàng không phải mất thời gian chờ đợi.
                                                </span>
                                            </li>
                                            <li>
                                                <span>Mô hình đại lý tiện lợi hỗ trợ khách hàng mọi lúc, mọi nơi.
                                                </span>
                                            </li>

                                            <li>
                                                <span>Cung cấp mô hình dịch vụ SaaS linh động và dễ dàng triển khai, chỉ
                                                    cần 1 phút là khách hàng có thể đăng ký thành công dịch vụ.
                                                </span>
                                            </li>
                                            <li>
                                                <span>Đội ngũ nhân viên hỗ trợ nhiệt tình 24/24 trong quá trình khách
                                                    hàng sử dụng dịch vụ.
                                                </span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane" role="tabpanel" id="tab_fea3">
                    <div class="container">
                        <div class="section-post">
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="fearture-image">
                                        <a href="#"><img src="/img/mo-rong-ket-noi.png"
                                                alt="Khả năng mở rộng - kết nối" /></a>
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="post-content">
                                        <ul class="list">
                                            <li>
                                                <span>
                                                    Hệ thống được thiết lập sẵn sàng cắm thêm nhiều server đáp ứng nhu
                                                    cầu dữ liệu của khách hàng.
                                                </span>
                                            </li>
                                            <li>
                                                <span>
                                                    Kết nối nhanh chóng với các hệ thống khác của khách hàng qua giao
                                                    diện API dễ sử dụng.
                                                </span>
                                            </li>
                                            <li>
                                                <span>
                                                    Đội ngũ kỹ thuật sẵn sàng kết nối tới hệ thống đã có của khách hàng
                                                    theo API hoặc cơ sở dữ liệu của khách hàng.Hệ thống được thiết lập
                                                    sẵn sàng cắm thêm nhiều server đáp ứng nhu
                                                    cầu dữ liệu của khách hàng.
                                                </span>
                                            </li>

                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>

<!-- Bảng giá -->
<div class="section-price">
    <div class="container text-center">
        <div class="section-heading center-heading price">
            <h2>BẢNG GIÁ</h2>
        </div>
        <div id="customer" class="owl-carousel" data-interval="3000" data-pause="false">
            {% for item in prices %}
            <div class="testimonials">
                <div class="content">
                    <div class="title">
                        <h3>
                            {{item.ten_hang_hoa}}
                        </h3>

                    </div>
                </div>
                <div class="info">
                    <div class="title2">
                        <p>
                            {{item.so_luong_hoa_don}} hóa đơn/gói
                        </p>
                    </div>
                    <div class="price">
                        <p>
                            {{item.don_gia}} VNĐ
                        </p>
                    </div>
                </div>
                <div class="text">
                    <ul>
                        <li>Đáp ứng đầy đủ nghiệp vụ</li>
                        <li>Triển khai dễ dàng</li>
                        <li>An toàn bảo mật</li>
                        <li>Hỗ trợ tận tình</li>
                    </ul>
                </div>
                <a class="tab-register" href="/dang-ky?package={{item.dmhanghoa_id}}">
                    Mua ngay
                </a>

            </div>
            {% endfor %}
        </div>
    </div>
</div>
<!-- Dịch vụ -->
<div class="section-services">
    <div class="container">
        <div class="section-heading center-heading services">
            <h2>Mẫu hóa đơn theo ngành nghề kinh doanh</h2>
        </div>
        <div class="row clearfix">
            <div class="container">
                <div class="row">
                    <div class="icon-kd">
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Thương Mại Phân Phối">
                                <div class="wow zoomIn animated animated" data-wow-delay="0ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-01.png" alt="Thương Mại Phân Phối">
                                    <h4 class="montserrat-font">Thương Mại Phân Phối</h4>
                                </div>
                            </a>
                        </div>
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Ngân hàng">
                                <div class="wow zoomIn animated animated" data-wow-delay="300ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-02.png" alt="Ngân hàng">
                                    <h4 class="montserrat-font">Ngân hàng</h4>
                                </div>
                            </a>
                        </div>
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Nhà Thuốc">
                                <div class="wow zoomIn animated animated" data-wow-delay="600ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-03.png" alt="Nhà Thuốc">
                                    <h4 class="montserrat-font">Nhà Thuốc</h4>
                                </div>
                            </a>
                        </div>
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Sản Xuất">
                                <div class="wow zoomIn animated animated" data-wow-delay="900ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-04.png" alt="Sản Xuất">
                                    <h4 class="montserrat-font">Sản Xuất</h4>
                                </div>
                            </a>
                        </div>
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Bệnh Viện">
                                <div class="wow zoomIn animated animated" data-wow-delay="0ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-05.png" alt="Bệnh Viện">
                                    <h4 class="montserrat-font">Bệnh Viện</h4>
                                </div>
                            </a>
                        </div>
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Siêu Thị">
                                <div class="wow zoomIn animated animated" data-wow-delay="300ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-06.png" alt="Siêu Thị">
                                    <h4 class="montserrat-font">Siêu Thị</h4>
                                </div>
                            </a>
                        </div>
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Sách, Văn Phòng Phẩm">
                                <div class="wow zoomIn animated animated" data-wow-delay="600ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-07.png" alt="Sách, Văn Phòng Phẩm">
                                    <h4 class="montserrat-font">Sách, Văn Phòng Phẩm</h4>
                                </div>
                            </a>
                        </div>
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Vật Liệu Xây Dựng">
                                <div class="wow zoomIn animated animated" data-wow-delay="900ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-08.png" alt="Vật Liệu Xây Dựng">
                                    <h4 class="montserrat-font">Vật Liệu Xây Dựng</h4>
                                </div>
                            </a>
                        </div>
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Nội Thất & Gia Dụng">
                                <div class="wow zoomIn animated animated" data-wow-delay="0ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-09.png" alt="Nội Thất & Gia Dụng">
                                    <h4 class="montserrat-font">Nội Thất & Gia Dụng</h4>
                                </div>
                            </a>
                        </div>
                        <div class="icon-column center-icon-column col-md-2 col-sm-4 col-xs-6">
                            <a href="/mau-hoa-don" title="Ngành Hàng Khác">
                                <div class="wow zoomIn animated animated" data-wow-delay="300ms"
                                    data-wow-duration="1500ms">
                                    <img class="lazy" data-original="/img/kinhdoanh/kd-10.png" alt="Ngành Hàng Khác">
                                    <h4 class="montserrat-font">Ngành Hàng Khác</h4>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Khách hàng -->
<div class="section-customer">
    <div class="container text-center">
        <div class="section-heading center-heading customer">
            <h2>Khách hàng của chúng tôi</h2>
        </div>
        <div class="tab owl-carousel owl-theme carousel">
            {% for item in survey %}
            <div class="testimonials carousel-item">
                <div class="col-md-12">
                    <h3>{{item.CUSTOMER_FEEDBACK}}</h3>
                </div>
                <div class="col-md-12 row" style="margin:0;">
                    <div class="col-md-3">
                        <img style="max-width:100%" class="img-circle img-responsive" src="{{item.IMAGE}}"
                            alt="{{item.COMPANY_NAME}}">
                    </div>
                    <div class="col-md-9" style="margin:0;padding:0">
                        <p style="color: #0093dd;font-weight: 500;font-size: 15px;;margin-top: 0;">
                            {{item.CUSTOMER_NAME}}</p>
                        <p style="font-size: 12px;color: #e27a17;">{{item.COMPANY_NAME}}</p>
                    </div>
                </div>
            </div>
            {% endfor %}
        </div>
        <div id="customer-dots" class="owl-dots">
            {% for item in survey %}
            <div class="owl-dot">
                <i style="color:#0093dd" class="fa fa-circle" aria-hidden="true"></i>
            </div>
            {% endfor %}

        </div>
    </div>
</div>
<!-- Tin tức -->
<div class="section-blog">
    <div class="container">
        <div class="section-heading center-heading blog">
            <h2>Tin tức nổi bật</h2>
        </div>
        <div class="row">
            {% for item in top3news %}
            <div class="col col-xs-12 col-md-3 item">
                <div class="item-child">
                    <div class="img">
                        <a href="/blog/{{item.TITLE_URL}}" title="{{item.TITLE}}">
                            <div class="bg_img">
                                <img class="lazy" style="width: 100%;" data-original="{{item.IMAGE}}" alt="{{item.TITLE}}" title="{{item.TITLE}}">
                            </div>
                        </a>
                    </div>
                    <div class="title">
                        <a href="/blog/{{item.TITLE_URL}}" title="{{item.TITLE}}">
                            {{item.TITLE}}
                        </a>
                    </div>
                    <div class="desc_c item-text">
                        <p>
                            {{item.DESCRIPTION}}
                        </p>
                    </div>
                    <div class="link">
                        <a href="/blog/{{item.TITLE_URL}}" title="Xem thêm">
                            Xem thêm >>
                        </a>
                    </div>
                </div>
            </div>
            {% endfor %}
        </div>
    </div>
</div>

{% endblock %} {% block jsFile %}
<!-- lazy load -->
<script src="/js/lazy-load/jquery.min.js"></script>
<script src="/js/lazy-load/jquery.lazyload.min.js"></script>
<script>
$("img.lazy").lazyload({effect : "fadeIn"});
</script>
<link href="/assets/global/plugins/carousel-owl-carousel/owl-carousel2/owl.carousel.min.css" rel="stylesheet">
<link href="/assets/frontend/pages/css/index.css" rel="stylesheet">
<link href="/assets/frontend/pages/css/animate.css" rel="stylesheet">
<script src="/assets/global/plugins/carousel-owl-carousel/owl-carousel2/owl.carousel.min.js"
    type="text/javascript"></script>
<script src="/assets/global/plugins/fancybox/source/jquery.fancybox.pack.js" type="text/javascript"></script>
<link rel="stylesheet" href="/js/magnific/magnific-popup.min.css">
<script src="/js/magnific/jquery.magnific-popup.min.js"></script>
<!-- <link rel="stylesheet" href="/js/materialize/ghpages-materialize.css"> -->
<!-- <script src="/js/materialize/materialize.min.js"></script> -->
<!-- <link rel="stylesheet" href="js/materialize/materialize.min.css"> -->

<script type="text/javascript">
    $(document).ready(function () {
        var owlBanner = $(".carousel-slide");
        var owl = $("#customer");
        var index = $("#index");

        owlBanner.show();
        owlBanner.owlCarousel({
            items: 1,
            loop: true,
            autoplay: true,
            autoplayTimeout: 5000,
        });

        owl.owlCarousel({
            items: 3,
            loop: true,
            center: true,
            dots: true,
            lazyload: true,
            dotsContainer: '#custom-dots',
            navigation: true,
            nav: true,
            autoplay: true,
            autoplayTimeout: 3500,
            autoplayHoverPause: false,
            navText: ["<i class='fa fa-angle-left'></i>", "<i class='fa fa-angle-right'></i>"],
            animate: 'fadeInRight',
            itemsScaleUp: true,
            responsive: {
                0: {
                    items: 1,
                },
                768: {
                    items: 1,
                    animate: 'fadeInRight',
                },
                1024: {
                    item: 3,
                    animate: 'fadeInRight',
                }
            }
        });
    });

</script>
<script>
    $(document).ready(function () {
        $('.tab').owlCarousel({
            items: 3,
            center: true,
            dots: true,
            lazyload: true,
            dotsContainer: '#customer-dots',
            navigation: true,
            nav: false,
            loop: true,
            animate: 'fadeInRight',
            itemsScaleUp: true,
            responsive: {
                0: {
                    items: 1,
                    animate: 'fadeInRight',
                    // animateOut: 'fadeInRight',
                },
                768: {
                    items: 1,
                    animate: 'fadeInRight',

                },
                1024: {
                    items: 3,
                    animate: 'fadeInRight',

                }
            },
            autoplay: true,
            autoplayTimeout: 3500,
            autoplayHoverPause: false,
            loop: true
        })
    })

</script>


<!-- slider js -->

{% endblock %}