{% extends "layout.jinja2" %}
{% block content %}


<!-- content -->


<!-- search 3 extended -->
<div class="row">

    <div class="large-12 columns">
        <div class="panel fl-block-search">

        <form name="" action="#" method="post" class="clearfix">
            
      
              <div class="row">

              <div class="large-4 medium-4 columns">         
                      <select>
                        <option value="">filter op</option>
                        <option value="">ID</option>
                        <option value="">Naam</option>
                        <option value="">Organisatie</option>
                        <option value="">Type</option>
                      </select>
              </div>

              <div class="large-8 medium-8 columns">
              
              <div class="searchBox">
                   <input type='text' placeholder='zoek actoren' />
                   <button>zoek</button>
                   </div>                 
                </div>      
             </div>

            <ul class="tag-label clearfix">
              <li>Jouw selectie</li>
              <li><a href="#">Organisatie / <strong>Onroerend erfgoed</strong></a> <a href="#"><span>&#10006;</span></a></li>
              <li><a href="#">Naam / <strong>Koen</strong></a> <a href="#"><span>&#10006;</span></a></li>
              <li><a href="#">Alle filters verwijderen <span>&#10006;</span></a></li>
            </ul>
            <hr>

        </form> 



        <div class="row">
            
               <div class="large-8 medium-8 columns">
                  <h5 style="padding-top:10px">Er zijn 5 resultaten beschikbaar</h5>
               </div>     

              <div class="large-4 medium-4 columns">
                  <select>
                      <option value="">sorteer op</option>
                      <option value="">ID</option>
                      <option value="">Naam</option>
                      <option value="">Organisatie</option>
                      <option value="">Type</option>           
                  </select>

              </div>


        </div>



<!-- start row -->

<div class="row">

<div class="large-3 medium-3 columns">

    <div class="panel actoren-idcard">
     <a href="actorenfront/detail">   
          <div class="actoren-icon-small clearfix">
          <i class="fa fa-user"></i>
          </div>
          <h3>Van Daele <br> Koen</h3>
          <small>ID : 1</small>    
      </a>  
    </div>  

</div>  


<div class="large-3 medium-3 columns">

    <div class="panel actoren-idcard">
     <a href="actorenfront/detail-bedrijf">  
          <div class="actoren-icon-small clearfix">
          <i class="fa fa-building"></i>
          </div>
          <h3>Onroerend erfgoed</h3>
          <small>ID : 1</small>    
     </a>   
    </div>  

</div>  


<div class="large-3 medium-3 columns">

    <div class="panel actoren-idcard">
      <a href="actorenfront/detail-bedrijfv2"> 
          <div class="actoren-icon-small clearfix">
          <i class="fa fa-user"></i>
          </div>
          <h3>Van Daele <br> Koen</h3>
          <small>ID : 5</small>    
      </a>   
    </div>  

</div>  


<div class="large-3 medium-3 columns">

    <div class="panel actoren-idcard">
    <a href="actorenfront/detail-bedrijf">     
          <div class="actoren-icon-small clearfix">
          <i class="fa fa-building"></i>
          </div>
          <h3>Onroerend erfgoed</h3>
          <small>ID : 1</small>    
    </a>     
    </div>  

</div>  

</div>

<!-- end row-->




<!-- start row -->

<div class="row">

<div class="large-3 medium-3 columns">

    <div class="panel actoren-idcard">
     <a href="actorenfront/detail">   
          <div class="actoren-icon-small clearfix">
          <i class="fa fa-user"></i>
          </div>
          <h3>Van Daele <br> Koen</h3>
          <small>ID : 1</small>    
      </a>  
    </div>  

</div>  


<div class="large-3 medium-3 columns">

    <div class="panel actoren-idcard">
     <a href="actorenfront/detail-bedrijf">  
          <div class="actoren-icon-small clearfix">
          <i class="fa fa-building"></i>
          </div>
          <h3>Onroerend erfgoed</h3>
          <small>ID : 1</small>    
     </a>   
    </div>  

</div>  


<div class="large-3 medium-3 columns">

    <div class="panel actoren-idcard">
      <a href="actorenfront/detail"> 
          <div class="actoren-icon-small clearfix">
          <i class="fa fa-user"></i>
          </div>
          <h3>Van Daele <br> Koen</h3>
          <small>ID : 1</small>    
      </a>   
    </div>  

</div>  


<div class="large-3 medium-3 columns">

    <div class="panel actoren-idcard">
    <a href="actorenfront/detail-bedrijf">     
          <div class="actoren-icon-small clearfix">
          <i class="fa fa-building"></i>
          </div>
          <h3>Onroerend erfgoed</h3>
          <small>ID : 1</small>    
    </a>     
    </div>  

</div>  

</div>

<!-- end row-->



    </div>
</div>

<!-- end search 3 extended-->



<!-- page navigation 2 -->

<div class="pagination-centered">
  <ul class="pagination">
    <li><a href=""><</a></li>
    <li class="unavailable"><a href="">1</a> </li>
    <li class="current"><a href="">2</a></li>
    <li class=""><a href="">3</a></li>
    <li class="unavailable"><a href="">...</a></li>
    <li class=""><a href="">10</a></li>
    <li class=""><a href="">20</a></li>
    <li class=""><a href="">30</a></li>
    <li><a href="">></a></li>
  </ul>
</div>








{% endblock %}