{% if moz %} <div class=“progress progress-circular flex”>

<div><h4>Position</h4></div>
<div>
<ul>

  {% if site.data %}
  {% assign moz = site.data.[website].moz[datelastcrawl] %}
  {% else %}
  {% assign moz = [website].moz[datelastcrawl] %}
  {% endif %}

  {% for authority in moz %}
  {% for element in authority limit: 2 %}
    {% assign score = element[1] | times: 1 %}
    <li data-name="{{ element[0] }}" data-percent="{{ score }}">
      {% if score > 60 %}{% assign color = 'top' %}{% elsif score > 50 %}{% assign color = 'verygood' %}{% elsif score > 30 %}{% assign color = 'good' %}{% elsif score > 15 %}{% assign color = 'bad' %}{% else %}{% assign color = 'verybad' %}{% endif%}
      <svg viewbox="-10 -10 220 220" class="{{ color }}">
      <g fill="none" stroke-width="15" transform="translate(100,100)">
        <path d="M 0,-100 A 100,100 0 0,1 86.6,-50" />
        <path d="M 86.6,-50 A 100,100 0 0,1 86.6,50" />
        <path d="M 86.6,50 A 100,100 0 0,1 0,100" />
        <path d="M 0,100 A 100,100 0 0,1 -86.6,50" />
        <path d="M -86.6,50 A 100,100 0 0,1 -86.6,-50" />
        <path d="M -86.6,-50 A 100,100 0 0,1 0,-100" />
      </g>
      </svg>
      <svg viewbox="-10 -10 220 220">
        <path d="M200,100 C200,44.771525 155.228475,0 100,0 C44.771525,0 0,44.771525 0,100 C0,155.228475 44.771525,200 100,200 C155.228475,200 200,155.228475 200,100 Z" stroke-dashoffset="{{ score | times: 630 | divided_by: 100 }}"></path>
      </svg>
    </li>
  {% endfor %}
  {% endfor %}
</ul>
</div>

</div> {% endif %}