<section class="section-clients">

<h3 id="clients">Clients</h3>

<div class="clients-mobile-nav">

{% for client in site.data.settings.clients %}

<span class="client-button {% if forloop.first %}active-client{% endif %}"></span>

{% endfor %}

</div>

<div class="clients-belt">

{% for client in site.data.settings.clients %}

<div class="client-unit {% if forloop.first %}active-client{% endif %}">

<figure class="client-face">

<img src="{{ site.github.url }}/assets/img/clients/{{ client.avatar }}" alt="client-face">

<figcaption>

<strong class="client-name">{{ client.name }}</strong>

<em class="client-title">{{ client.title }}</em>

</figcaption>

</figure>

<div class="client-content">

<div class="client-quote-mark">{% include icons/icon-quote-mark.html %}</div>

{{ client.quote }}

</div>

</div>

{% endfor %}

</div>

<div class="client-controls">

<div class="client-control-next">{% include icons/icon-next.html %}</div>

<div class="client-control-prev">{% include icons/icon-prev.html %}</div>

</div>

<div class="clients-logos">

{% for client in site.data.settings.clients %}

<img class="client-logo {% if forloop.first %}active-client{% endif %}" src="{{ site.github.url }}/assets/img/clients/{{ client.logo }}" align="{{ client.logo }}">

{% endfor %}

</div>