{{ header }}
<div id="faq" class="container">
<ul class="breadcrumb">
    {% for breadcrumb in breadcrumbs %}
    <li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li>
    {% endfor %}
</ul>
<div class="row">
<style>
  .collapse .panel-body span img{float:left;margin:0 10px 10px 0;}
</style>
<h3>{{ heading_title }}</h3>
<div class="panel-group" id="accordion">
  {% for faq in faqs %}
  <div class="panel panel-default">
    <div class="panel-heading">
      <a data-toggle="collapse" data-parent="#accordion" href="#collapse{{ faq.faq_id }}"><h4 class="panel-title">
        {{ faq.question }}</h4></a>
    </div>
    <div id="collapse{{ faq.faq_id }}" class="panel-collapse collapse">
      
      <div class="panel-body"><span><img src="{{ faq.image }}"></span>{{ faq.answer }}</div>
    </div>
  </div>
  
  {% endfor %}
  
</div>
</div>
<div class="row">
        <div class="col-sm-6 text-left">{{ pagination }}</div>
        <div class="col-sm-6 text-right">{{ results }}</div>
      </div>
</div>
{{ footer }} 