{% if articles %}
<div class="rm-page-title h6 text-center my-4">{{ heading_title }}</div>
<div class="row no-gutters">
	 {% for article in articles %}
	<div class="ocs-article-box col-sm-12 col-md-6 col-lg-4 col-xl-3">
	    <div class="rm-module-item border-0 d-flex flex-column h-100">
		    <div class="rm-module-img">
				<a href="{{ article.href }}">
				<img src="{{ article.thumb }}" alt="{{ article.name }}" title="{{ article.name }}" class="img-responsive" />
				</a>
			</div>
			<div class="rm-module-title flex-grow-1">
				<a href="{{ article.href }}">{{ article.name }}</a>
			</div>
			{% if article.rating %}
			<div class="rm-module-rating d-flex align-items-center justify-content-center">
				<div class="rm-module-rating-stars d-flex align-items-center">
					{% for i in 1..5 %}
					{% if product.rating < i %}
					<span class="rm-module-rating-star"></span>
					{% else %}
					<span class="rm-module-rating-star rm-module-rating-star-is"></span>
					{% endif %}
					{% endfor %}
				</div>
			</div>
	        {% endif %}
	        <div class="rm-product-description my-4">{{ article.description }}</div>
		    <button class="rm-btn primary mt-auto" type="button" onclick="location.href = ('{{ article.href }}');"><i class="fas fa-share"></i> <span class="hidden-xs hidden-sm hidden-md">{{ button_more }}</span></button>
		</div>
	</div>
	{% endfor %}
</div>
{% endif %}