{config_load file="$language/lang_$language.conf" section="specials"}

<style>
.card {
    min-height:680px;
  }

@media (max-width: 575.98px) {
	.card {
    min-height:680px;
  }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  .card {
    min-height:700px;
  }
}

@media (min-width: 768px) {
  .card {
    min-height:520px;
  }
}
</style>
<div class="uberuns boxes pb-5 ">
	<div class="container bg-light border border-secondary border-2 p-3 rounded-3 shadow mb-5">
		
		<img src="{$tpl_path}img/sale.jpg" class="w-100 rounded rounded-2 mb-2" alt="Angebote" >		
		
		<h1 class="ico ico-5">{#heading_text#}</h1>
		<div class="text-end mb-2">				
			{$FILTER_FORM}{$FILTER_DROPDOWN}{$FORM_END}
			{if $MANUFACTURER_DROPDOWN}{$MANUFACTURER_DROPDOWN|replace:'&nbsp;':''}
			{/if}		
		</div>	
		{$NAVIGATION}	
		<div class="row">
		{foreach from=$module_content item=product}	
		<div class="col-xl-3 col-lg-6 col-12 mb-3">
		  <div class="card h-100 position-relative">
			<a href="{$product.PRODUCTS_LINK}">
			{if $product.PRODUCTS_IMAGE}
			<img src="{$product.PRODUCTS_IMAGE|replace:"thumbnail":"info"}" class="card-img-top" alt='{$product.PRODUCTS_NAME}'>
			{else}
			<img src="/files/logo/Bild-fehlt_500px.jpg" class="card-img-top" alt="kein Bild vorhanden" />
			{/if}
			</a>
			<div class="card-body">
			  <h5 class="card-title">{$product.PRODUCTS_NAME|truncate:80:"...":true}</h5>
			  <p class="card-text">{$product.PRODUCTS_PRICE|replace:'EUR':'&euro;'}*</p>
			  {if $smarty.session.language=='german'}
			  <a href="{$product.PRODUCTS_LINK}" class="btn btn-primary w-100 text-light fw-bold list-button">mehr erfahren</a>
			  {else}
			  <a href="{$product.PRODUCTS_LINK}" class="btn btn-primary w-100 text-light fw-bold list-button">learn more</a>
			  {/if}
			</div>
		  </div>
		</div>
		{/foreach} 
	</div>
	{$NAVIGATION}
	</div>
</div>