  {% if specials %}
    {% for special in specials %}
    <div class="{{ special.content }}">
      <div class="itembox content-box rel paper">

        <div class="itembox-container clearfix {{ class_actions_one_line }}">

            <div>
              {% if special.image %}
                <a href="{{ special.href }}" title="{{ special.description }}" class="itembox-image-link">
                  <!-- O estilo inline foi utilizado porque o valor tem que vir do php -->
                  <div class="container-img" {{ special.ratio }}>
                    {% if efeitoimg == constant('Type_EfeitoImagem::Tp_Padrao') %}
                      <picture>
                        <source class="load-image" srcset="" data-src="{{ special.image.webp }}">
                        <img class="load-image" src="" data-src="{{ special.image.jpg }}" alt="{{ special.description }}">
                      </picture>
                    {% else %}
                      <picture>
                        <source class="load-image" srcset="" data-src="{{ special.image.webp }}">
                        <img class="itembox-primary-image load-image" src="" data-src="{{ special.image.jpg }}" alt="{{ special.description }}">
                      </picture>
                      <picture>
                        <source class="load-image" srcset="" data-src="{{ special.image_extra.webp }}">
                        <img class="itembox-secondary-image load-image" src="" data-src="{{ special.image_extra.jpg }}" alt="{{ special.description }}">
                      </picture>
                    {% endif %}
                  </div>
                </a>
              {% endif %}


            </div>
            <div class="itembox-content">
              <div class="itembox-inner">
                <h3 class="itembox-title font-family-header">
                  <a class="product-name" href="{{ special.href }}" title="{{ special.description }}">
                    {{ special.description }}
                  </a>
                </h3>
              </div>
              <button type="button" data-special-href="{{ special.href }}" class="btn-default btn-medium-square js-btn-special">
                <span>Ver Produtos</span>
              </button>
            </div>
          </div>
        </div>
      </div>
    {% endfor %}
  {% else %}
  <div class="col-xs">
    <span class="text-medium">{{ text_empty }}</span>
  </div>
{% endif %}
<script type="text/javascript">
window.waitEvent('scripts_document', function() {
  $('.js-btn-special').on('click', function(){
    location.href = $(this).data('special-href');
  });
});
</script>
