<div class="o-tableBlocks -orders -loading">
<table class="table">
<thead>
<tr>
<th scope="col"><span class="a-sort d-inline-flex align-items-center font-weight-bold cursor-pointer ">Status<i class="icon-arrow-down"></i></span></th>
<th scope="col"><span class="a-sort d-inline-flex align-items-center font-weight-bold cursor-pointer ">Bestelling<i class="icon-arrow-down"></i></span></th>
<th scope="col"><span class="a-sort d-inline-flex align-items-center font-weight-bold cursor-pointer ">Soort<i class="icon-arrow-down"></i></span></th>
<th scope="col"><span class="a-sort d-inline-flex align-items-center font-weight-bold cursor-pointer ">Vorm<i class="icon-arrow-down"></i></span></th>
<th scope="col"><span class="a-sort d-inline-flex align-items-center font-weight-bold cursor-pointer ">Aantal GGW<i class="icon-arrow-down"></i></span></th>
<th scope="col"><span class="a-sort d-inline-flex align-items-center font-weight-bold cursor-pointer ">Aantal App<i class="icon-arrow-down"></i></span></th>
<th scope="col"><span class="a-sort d-inline-flex align-items-center font-weight-bold cursor-pointer ">Som<i class="icon-arrow-down"></i></span></th>
<th scope="col"><span class="a-sort d-inline-flex align-items-center font-weight-bold cursor-pointer ">Voortgang<i class="icon-arrow-down"></i></span></th>
<th scope="col"><span class="a-sort d-inline-flex align-items-center font-weight-bold cursor-pointer -active -up">Gewijzigd<i class="icon-arrow-down"></i></span></th>
<th scope="col"><span class="a-tableHead d-inline-block font-weight-bold ">
Team
</th>
</tr>
</thead>
<tbody>
<tr class="m-tableBlock -rowLoading">
<td>
<span class="badge rounded-pill bg-orange user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Open<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 12.5%" aria-valuenow="12.5" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-orange user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Open<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 12.5%" aria-valuenow="12.5" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-orange user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Open<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 12.5%" aria-valuenow="12.5" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-secondary user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Gesloten<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-secondary user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Gesloten<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-secondary user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Gesloten<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-orange user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Open<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-orange user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Open<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-orange user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Open<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-secondary user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Gesloten<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-secondary user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Gesloten<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-secondary user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Gesloten<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-orange user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Open<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-orange user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Open<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
<tr class="m-tableBlock">
<td>
<span class="badge rounded-pill bg-orange user-select cursor-pointer -right" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-trigger="click" data-html="true" title="" data-popover-group="open_close_order_menu" data-custom-class="-menu">Open<i class="icon-arrow-down"></i></span>
<div class="popover-content">
<div class='m-popoverMenu'>
<div class='dropdown-item active'>Open</div>
<div class='dropdown-item'>Gesloten</div>
</div>
</div>
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
<div class="progress-wrap">
<div class="progress-label d-block">Bestelling </div>
<div class="progress -small mt-1 mb-1">
<div class="progress-bar" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div class="text-muted limit-lines-1">32/64</div>
</div>
</td>
<td>Vandaag om 17:22</td>
<td>
<ul class="m-teamList position-relative list-unstyled mb-0 w-100 d-flex">
<li>
<div tabindex="0" class="a-avatar bg-greenblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Frans Canten</strong><br><span class='text-muted'>Accountmanager</span></small>">
FC
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-bronze rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Britt Kaag</strong><br><span class='text-muted'>Projectmanager</span></small>">
BK
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-darkblue rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Luuk Maartens</strong><br><span class='text-muted'>Architect</span></small>">
LM
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-brightpink rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content="<small class='d-block text-center'><strong>Thomas Rademakers</strong><br><span class='text-muted'>Architect</span></small>">
TR
</div>
</li>
<li>
<div tabindex="0" class="a-avatar bg-defaultgray rounded-circle d-inline-flex justify-content-center align-items-center" data-toggle="popover" data-placement="top" data-trigger="hover" data-html="true" title="" data-content='<ul class="m-teamList -vertical flex-column position-relative list-unstyled mb-0 w-100 d-flex">
<li><div tabindex="0" class="a-avatar bg-pistache rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
HP
</div>
<small>Hendrik Pieters</small></li>
<li><div tabindex="0" class="a-avatar bg-greyblue rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
PV
</div>
<small>Piet van Veen</small></li>
<li><div tabindex="0" class="a-avatar bg-lightyellow rounded-circle d-inline-flex justify-content-center align-items-center" data-content="">
ED
</div>
<small>Eva Dijkstra</small></li>
</ul>'">
+3
</div>
</li>
</ul>
</td>
<td colspan=" 12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
<div class="a-loader -wave">
<svg class="a-loader__animation" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: rgba(241, 242, 243, 0);" width="75px" viewBox="12.5 38 75 22" preserveAspectRatio="xMidYMid">
<circle cx="30" cy="55" r="5" fill="#69d2c2">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.43;0.58;0.6;0.7;1" dur="1.75s" begin="-0.6"></animate>
</circle>
<circle cx="50" cy="55" r="5" fill="#e3000f">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.45"></animate>
</circle>
<circle cx="70" cy="55" r="5" fill="#ff85bb">
<animate attributeName="cy" calcMode="spline" keySplines="0.5 0 0.5 1 ; 0.5 0 0.5 1 ; 0.7 0 0.5 1 ; 0 0 0.5 1; 0 0 0.5 1; 0 0 0.5 1" repeatCount="indefinite" values="55;45;45;55;54;55;55" keyTimes="0;0.25;0.40;0.55;0.6;0.7;1" dur="1.75s" begin="-0.3"></animate>
</circle>
</svg>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="o-tableBlocks -orders{% if loading_row %} -loading{% endif %}">
<table class="table">
<thead>
<tr>
<th scope="col">{% render '@sort', text='Status' %}</th>
<th scope="col">{% render '@sort', text='Bestelling' %}</th>
<th scope="col">{% render '@sort', text='Soort' %}</th>
<th scope="col">{% render '@sort', text='Vorm' %}</th>
<th scope="col">{% render '@sort', text='Aantal GGW' %}</th>
<th scope="col">{% render '@sort', text='Aantal App' %}</th>
<th scope="col">{% render '@sort', text='Som' %}</th>
<th scope="col">{% render '@sort', text='Voortgang' %}</th>
<th scope="col">{% render '@sort', text='Gewijzigd', active=true, up=true %}</th>
<th scope="col">{% render '@table-head', text='Team' %}</th>
</tr>
</thead>
<tbody>
{% if loading %}
<tr class="m-tableBlock -loading">
<td colspan="9">
<div class="d-flex justify-content-center mb-2">
{% render '@loader--wave' %}
</div>
</td>
</tr>
{% else %}
{% for i in range(0, 15) -%}
<tr class="m-tableBlock{% if i == 0 and loading_row %} -rowLoading{% endif %}">
{% if i < 3 %}
{% set badge="select" %}
{% set text="Open" %}
{% set color="orange" %}
{% set variant="bestelling" %}
{% set progress=12.5 %}
{% elif i < 6 %}
{% set badge="select" %}
{% set text="Gesloten" %}
{% set color="secondary" %}
{% set variant="offerte" %}
{% set progress=25 %}
{% elif i < 9 %}
{% set badge="select" %}
{% set text="Open" %}
{% set color="orange" %}
{% set variant="welstand" %}
{% set progress=50 %}
{% elif i < 12 %}
{% set badge="select" %}
{% set text="Gesloten" %}
{% set color="secondary" %}
{% set variant="vergunningen" %}
{% set progress=75 %}
{% elif i < 15 %}
{% set badge="select" %}
{% set text="Open" %}
{% set color="orange" %}
{% set variant="contract" %}
{% set progress=100 %}
{% endif %}
<td>
{% render '@badge--'+badge, {text:text, color:color}, true %}
</td>
<td>
<strong>Elkien B.V.</strong><br>
<span class="text-muted">De Klamp</span><br>
<span class="text-muted">Leeuwarden, FR</span><br>
</td>
<td>Huur</td>
<td>GGW & App</td>
<td>6</td>
<td>12</td>
<td>€2.600.000</td>
<td>
{% render '@progress--small', {progress:progress, label:"Bestelling"}, true %}
</td>
<td>Vandaag om 17:22</td>
<td>
{% render '@teamlist' %}
</td>
{% if loading_row %}
<td colspan="12">
<div class="d-flex justify-content-center align-items-center h-100 mb-2">
{% render '@loader--wave' %}
</div>
</td>
{% endif %}
</tr>
{% endfor %}
{% endif %}
</tbody>
</table>
</div>
{
"loading": false,
"loading_row": true
}
When the state of the order is changed to gesloten or open the class .-rowLoading must be added to the <tr> tag so the loading animation is added to the row.