{% extends '../../layout.server.view.html' %} {% block cssFile %}
<link href="/assets/frontend/layout/css/custom.css" rel="stylesheet" type="text/css"> 

{% endblock %} {% block content %}
<style>
ul.breadcrumb {
    margin: 15px 0;
    padding: 0;
    background: none;
}
.category-heading {
        padding: 5px 0;
        font-weight: 500;
        color: #0093dd;
        font-size: 13px;
    }

    .bread-crumb {
        border-bottom: 1px solid #e5e5e5;
        margin: 15px 0;
        padding-bottom: 15px;
    }

    .doted {
        background-color: #a0a0a0;
        border-radius: 3px;
        display: inline-block;
        height: 5px;
        margin: 2px 6px;
        width: 5px;
    }

    .faq-item {
        margin: 20px 0;
    }

    .faq-item h4 {
        line-height: 1.5;
        font-size: 15px;
    }

    .faq-item a {
        color: #555;
    }

    .faq-item:visited {
        background-color: #f9f9f9;
    }

    .faq-item a:hover {
        text-decoration: none;
    }

    .faq-item span {
        float: left;
        margin-top: 3px;
        color: #0093dd;
    }

    .faq-title {
        margin-left: 20px;
    }

    .faq-content {
        background-color: #f9f9f9;
        padding: 10px;
        margin-left: 20px;
    }

    .faq-content p {
        font-size: 15px;
        line-height: 25px;
    }
</style>
<div
style="background-image: url('https://i.imgur.com/aLLUjD4.jpg'); height: 350px; color: #fff;display: flex;justify-content: center;align-items: flex-start;">
<div class="container header">
    <div class="section-heading" style="color: #fff;">
        <h1 style="color: #fff;text-align: left;">Trung tâm trợ giúp Hóa Đơn Việt</h1>
        <h3 style="color: #fff;text-align: left;text-transform: none;"><span><i style="font-size: 25px;"
                    class="fa fa-facebook-official" aria-hidden="true"></i></span> <a
                style="color:#fff;font-size:18px;padding-left: 10px;" href="https://www.facebook.com/groups/hoadondientuviet/" target="_blank">Cộng đồng hỗ trợ miễn phí trên
                Facebook</a></h3>
        <h3 style="color: #fff;text-align: left;text-transform: none;"><span><i style="font-size: 25px;"
                    class="fa fa-phone" aria-hidden="true"></i></span> <a
                style="color:#fff;font-size:18px;padding-left: 10px;" href="tel:19001171">Tổng đài hỗ trợ
                19001171</a></h3>
        <h3 style="color: #fff;text-align: left;text-transform: none;"><span><i style="font-size: 25px;"
                    class="fa fa-search" aria-hidden="true"></i></span> <a
                style="color:#fff;font-size:18px;padding-left: 10px;" href="/img/tai_lieu_hdsd.docx">Tài liệu hướng dẫn sử dụng</a></h3>
        <h3 style="color: #fff;text-align: left;text-transform: none;"><span><i style="font-size: 25px;"
                    class="fa fa-envelope-o" aria-hidden="true"></i></span> <a
                style="color:#fff;font-size:18px;padding-left: 10px;"
                href="mailto:hotro@hoadonviet.vn ">Hotro@hoadonviet.vn </a></h3>


    </div>
</div>
</div>
<div class="main">
    <div class="container">
        <div class="bread-crumb">
            <div class="container">
                <a href="/" class="category-heading">Trang chủ</a>
                <span class="doted"></span>
                <a href="/ho-tro" class="category-heading">Hỗ trợ</a>
                <span class="doted"></span>
                <span>Video hỗ trợ</span>
                <span class="doted"></span>
        
        
            </div>
        </div>
        <div class="row">
            <div class="col-md-3 rmenu">
                <ul>
                    <li>
                        <p><a href="/ho-tro" style="">Hướng dẫn sử dụng<i class="fa fa-angle-right" style="font-size:20px; float:right;margin:6px 0px;color:#8a95a6;"></i></a></p>
                    </li>
                    <li>
                        <p><a href="/ho-tro/video" style="">Video hướng dẫn<i class="fa fa-angle-right" style="font-size:20px; float:right;margin:6px 0px;color:#8a95a6;"></i></a></p>
                    </li>
                    <li>
                        <p><a href="/ho-tro/faq" style="">Câu hỏi thường gặp<i class="fa fa-angle-right" style="font-size:20px; float:right;margin:6px 0px;color:#8a95a6;"></i></a></p>
                    </li>
                </ul>
            </div>
            <div class="col-md-9">
                <div class="m-b-xs rcontent">
                    <h3><strong>{{demoVideo.title}}</strong></h3>
                    <iframe width="100%" height="400px;" src="{{demoVideo.link_video}}">
                    </iframe>
                    {{demoVideo.content|safe}}
                </div>
                <div class="m-b-xs rlist">
                    <div class="panel panel-default">
                        <div class="panel-body">
                            {% for item in videoList %}
                            <p><span><i class="fa fa-film"></i></span><a href="/ho-tro/video/{{item.title_url}}">{{item.title}}</a></p>
                            {% endfor %}
                        </div>
                    </div>
                </div>
                <div class="col-md-12 col-sm-12 m-t-lg margin-bottom-30">
                    <div class="fb-comments" data-href="http://hoadonviet.vn/ho-tro/video" data-width="100%" data-numposts="10"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="fb-root"></div>
<script>
(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s);
    js.id = id;
    js.src = "//connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.5";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
{% endblock %} {% block jsFile %}
<script src="/assets/global/plugins/uniform/jquery.uniform.min.js" type="text/javascript"></script>
<script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>
<!-- <script type="text/javascript">
jQuery(document).ready(function() {
    Layout.initUniform();
    ContactUs.init();
});
</script> -->
{% endblock %}
