<div class="block-title">
<div class="title">
<span>{{ heading_title }}</span>
</div></div>
<div class="row">
 {% for product in products %}
  <div class="pt-content  col-lg-100 col-md-100 col-sm-6 col-xs-6">
    <div class="product-thumb transition">
      <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /></a></div>
      <div class="caption">
        <p><a href="{{ product.href }}">{{ product.name }}</a></p>
        <p class="produto-descricao">{{ product.description }}</p>

        {% if product.price %}
        <p class="price">
          {% if not product.special %}
          {{ product.price }}
          {% else %}
          <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span>
          {% endif %}
          {% if product.tax %}
          <span class="price-tax">{{ text_tax }} {{ product.tax }}</span>
          {% endif %}
        </p>
        {% endif %}
      </div>
   </div>
  </div>
  {% endfor %}
</div>
<style>
.produto-descricao {
  display: -webkit-box;
  -webkit-line-clamp: 2; /* Número de linhas desejado */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: 4.5em; /* Ajuste conforme necessário */
  font-size: 12px;
}

.col-md-100 {
    width: 20%;
    float: center;
}
.col-lg-100 {
    width: 20%;
    float: center;
}

</style>