crosterOverWrites/front/products.tpl

{debug}
{if $block.sechidden neq "true"}

	{if $block.ptstyle == ''}

	<div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
		<div class="container">
		
			{if $block.caption || $block.sectitle || $block.subtitle}
				<div class="sec-description">
					{if $block.caption}
						<div class="sec-caption">
							<span class="rounded">{$block.caption}</span>
						</div>
					{/if}
					{if $block.sectitle}
						<h2 class="sec-title">{$block.sectitle}</h2>
					{/if}
					{if $block.subtitle}
						<div class="sec-subtitle">{$block.subtitle}</div>
					{/if}
				</div>
			{/if}			
						
			<div class="cros-pricing-container{if $block.itemcounts < "3"} mw-768 mx-auto{/if}">
				{if $block.SbSwitcher && !$block.DisableSwitcher}
					{if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
						{assign var="cycles" value=$block.switcherCycles}
					{else}
						{assign var="cycles" value=$allCycles}
					{/if}
					{if !$block.bsco}
						{assign var="cycles" value=$cycles|@array_reverse}
					{/if}
					<div class="product-billing-switcher-{$blockkey}">
						<div class="btn-group white border d-none d-sm-inline-block" role="group">						
							{foreach $cycles as $cycle}
								<button type="button" class="btn cycle-change" data-cycle="{$cycle}">
									<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
								</button>
							{/foreach}
						</div>
						<div class="btn-group white border d-inline-block d-sm-none">
							<span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
							<button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
								<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
							</button>					
							<ul class="dropdown-menu">
								{foreach $cycles as $cycle}
									<li class="dropdown-item cycle-change" data-cycle="{$cycle}">
										<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
									</li>
								{/foreach}								
							</ul>
						</div>
					</div>
				{/if}
				<div class="pricing_style_2">
					<div class="swiper" id="pricing-tables-{$blockkey}">
						<div class="row row-eq-height{if !$block.DisplayInGrid} flex-nowrap{/if} pricing-slider pricing-{$blockkey} swiper-wrapper{if count($block.table) < 3} justify-content-md-center{/if}">
							{if count($block.table) > 0}
							{foreach from=$block.table item=$ditem key=$kk}
								<div class="col-12{if $block.itemcounts == "2"} col-md-6{elseif $block.itemcounts == "3"} col-md-6 col-lg-4 col-xl-4{elseif $block.itemcounts == "4"} col-md-6 col-lg-4 col-xl-3{/if} products-slide">
									<div class="cros-pricing-table overflow-hidden mt-0 mb-4{if $block.ststyle} {$block.ststyle}{/if}{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if}{if $ditem['Featured']} active{/if}{if $block.centered} centered{/if}">							
										{if $ditem['Graphic']}
											<div class="graphics mb-3">
												{if !$ditem['Graphic']|strstr:"fa-"}
													<img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid">
												{else}
													<span class="icon">
														<i class="{$ditem['Graphic']}"></i>
													</span>
												{/if}									
											</div>
										{/if}
										<div class="h4">{$ditem['productdetails']['name']}</div>
										{if $ditem['Featured']}
											{if $block.ststyle}
											<div class="feature-sticker">
												<span class="st-sm">
													{if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
												</span>
											</div>
											{else}
											<div class="sticker-wrapper">
												<div class="sticker">
													{if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
												</div>
											</div>
											{/if}
										{/if}
										
										{if $block.descp == ""}
											 {if count($ditem['productdetails']['description']['features']) > 0}
											 {if $ditem['productdetails']['description']['featuresdesc']}  
												 <div class="desc">{$ditem['productdetails']['description']['featuresdesc']}</div>
											 {/if}
											 {/if}
										 {/if}
										 
										{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
					
											{if $block.bsco}
												{foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}							
													{$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
												{/foreach}
											{/if}

											{assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
											{assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
											{assign var="taxtype" value=$dropdownprice['taxtype'] nocache}	
											{assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
										
											<div class="billing-cycle-pricing float{if $block.descp == "below"} desc_belwo{/if}">
												
												{if !$block.SbSwitcher}
												<div class="btn-group mb-2">
													<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
														<div class="pricing_wrapr">
															{$dropdownprice['billingcycle']} @ {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if}
														</div>
														<span class="fal fa-angle-down"></span>
													</a>
													<ul class="dropdown-menu">
														{if $ditem["dropdown"][$ditem['Plan']]}										
														{foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
															<li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
																<div class="pricing_wrapr">
																	{$dropdownprice['billingcycle']} @ {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if}
																</div>
															</li>
														{/foreach}										
														{/if}
													</ul>
												</div>
												{/if}
					
												{if $ditem["dropdown"][$ditem['Plan']]}
												<div class="product_pricing">
													{if $block.SbSwitcher}
														<div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
															{if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
																<div class="regular_pricing">
																	{if $dropdownprice['hasconfigoptions']}
																		<span class="small text-muted">{$WLANG.startingat}</span>
																	{/if}																
																	{if $dropdownprice['save']}
																		{if $dropdownprice['dollar'] && !$block.DisableBrekdown}
																			<span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
																		{/if}
																		{if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
																	{/if}																
																</div>
															{/if}											
															<div class="price">
																<span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
																{if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
															</div>
															<div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
															{if $dropdownprice['setup'] > 0}
																<div class="small text-muted">
																	<span><i class="fal fa-plus"></i></span>
																	<span>{$dropdownprice['prefix']}</span>
																	{$dropdownprice['setup']}
																	<span>{$dropdownprice['suffix']}</span>
																	{$WLANG.ordersetupfee}
																</div>
															{/if}				
														</div>
													{/if}												
													{foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}										
														<div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
															{if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
																<div class="regular_pricing">
																	{if $dropdownprice['hasconfigoptions']}
																		<span class="small text-muted">{$WLANG.startingat}</span>
																	{/if}																
																	{if $dropdownprice['save']}
																		{if $dropdownprice['dollar'] && !$block.DisableBrekdown}
																			<span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
																		{/if}
																		{if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
																	{/if}
																</div>
															{/if}											
															<div class="price">
																<span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
																{if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
															</div>
															<div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
															{if $dropdownprice['setup'] > 0}
																<div class="small text-muted">
																	<span><i class="fal fa-plus"></i></span>
																	<span>{$dropdownprice['prefix']}</span>
																	{$dropdownprice['setup']}
																	<span>{$dropdownprice['suffix']}</span>
																	{$WLANG.ordersetupfee}
																</div>
															{/if}				
														</div>
													{/foreach}
												</div>
												{/if}
											</div>
										{else}
											<div class="product_pricing_single">
												{if $block.DisableBrekdown}
													{if isset($ditem.dropdown) && is_array($ditem.dropdown)}
														{foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
															{assign var="firstCycle" value=$dropdown|@end}
															{if $firstCycle.hasconfigoptions}
																<div class="regular_pricing">
																	<span class="small text-muted">{$WLANG.startingat}</span>
																</div>
															{/if}															
															<div class="price">
																<span class="cost">
																	{$firstCycle.prefix}{$firstCycle.price}
																</span>
																<span class="suffix">
																	{$firstCycle.suffix}
																</spn>
															</div>
															<div class="cycle small text-muted">
																{$firstCycle.cycle|capitalize}
															</div>
														{/foreach}
													{/if}
													
												{else}
												
													{if $ditem["price"] == 'FREE'}
														<span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>										
													{else}
														{if $ditem["productdetails"]['hasconfigoptions']}
															<div class="regular_pricing">
																<span class="small text-muted">{$WLANG.startingat}</span>
															</div>
														{/if}
														<div class="price">									
															{assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
															<span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
															{if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
														</div>
														{if $ditem["billingcycle"] != ""}
															<div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
														{elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
															<div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
														{/if}
														{if $ditem["productdetails"]["price"]["setupFee"]}
															<div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
														{/if}												
													{/if}
												{/if}
											</div>
										{/if}
																			
										{if $block.descp == "below" || $block.descp == "1"}
											{if count($ditem['productdetails']['description']['features']) > 0}
											{if $ditem['productdetails']['description']['featuresdesc']}  
												<div class="desc mt-2">{$ditem['productdetails']['description']['featuresdesc']}</div>
											{/if}
											{/if}								
										{/if}
										{if !$block.orderLinkinLast}
											<div class="product-actions w-100">
												<a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
													{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
												</a>
											</div>
										{/if}

										{if $block.descp == "2"}
											{if count($ditem['productdetails']['description']['features']) > 0}
											{if $ditem['productdetails']['description']['featuresdesc']}  
												<div class="desc_small mt-3 mb-1">{$ditem['productdetails']['description']['featuresdesc']}</div>
											{/if}
											{/if}								
										{/if}
										
										{if $block.featurescollapsed}
											{if $ditem['productdetails']['description']}
												{if count($ditem['productdetails']['description']['features']) > 0}
													<ul class="plan-features">
														<!-- ThurData Featurelist -->
														<table border="0" style="display: inline-table; table-layout:fixed; width:100%; visibility:visible;" cellpadding="0" cellspacing="5">
															{foreach $ditem['productdetails']['description']['features'] as $feature => $value}
																<tr>
																	<td><b>{$feature}</b></td>
																	<td>
																		{if $value == "Ja"}
																			<i class="far fa-check-square" class="td-product-feature-icon"></i>
																		{elseif $value == "Nein"}
																			<i class="far fa-square" class="td-product-feature-icon"></i>
																		{elseif $value == "Optional"}
																			<i class="fas fa-plus" class="td-product-feature-icon"></i>
																		{else}
																			{$value}
																		{/if}
																	</td>
																</tr>
															{/foreach} 
														</table>
														<!-- End ThurData Featurelist -->
														{* original featurelist
														{foreach $ditem['productdetails']['description']['features'] as $feature => $value}
															<li><b>{$value}</b> {$feature}</li>
														{/foreach}
														*}
													</ul>
												{else}
													<div class="plan-features">
														{$ditem['productdetails']['description']['original']}
													</div>
												{/if}
											{/if}
										{else}
											<p class="PriceList-toggle collapsed" data-toggle="collapse" data-target="#PlanLists{$kk + 1}">
												<span>{$WLANG.clientareaviewdetails}</span>
											</p>
											
											{if $ditem['productdetails']['description']}
												{if count($ditem['productdetails']['description']['features']) > 0}
													<ul class="plan-features collapse" id="PlanLists{$kk + 1}"> 
														<!-- ThurData Featurelist -->
														<table border="0" style="display: inline-table; table-layout:fixed; width:100%; visibility:visible;" cellpadding="0" cellspacing="5">
															{foreach $ditem['productdetails']['description']['features'] as $feature => $value}
																<tr>
																	<td><b>{$feature}</b></td>
																	<td>
																		{if $value == "Ja"}
																			<i class="far fa-check-square" class="td-product-feature-icon"></i>
																		{elseif $value == "Nein"}
																			<i class="far fa-square" class="td-product-feature-icon"></i>
																		{elseif $value == "Optional"}
																			<i class="fas fa-plus" class="td-product-feature-icon"></i>
																		{else}
																			{$value}
																		{/if}
																	</td>
																</tr>
															{/foreach} 
														</table>
														<!-- End ThurData Featurelist -->
														{* original featurelist
														{foreach $ditem['productdetails']['description']['features'] as $feature => $value}
															<li><b>{$value}</b> {$feature}</li>
													   	{/foreach}
													   *}
													</ul>
												{else}
													<div class="plan-features collapse" id="PlanLists{$kk + 1}">
														{$ditem['productdetails']['description']['original']}
													</div>
												{/if}
											{/if}
										{/if}
										
										{if $block.orderLinkinLast}
											<div class="product-actions mt-auto">
												<a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-primary my-3 w-auto{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
													{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
												</a>
											</div>
										{/if}
										
									</div>
								</div>						
							{/foreach}
							{/if}
						</div>
					</div>
				</div>
				{if !$block.DisplayInGrid}
					{if !$block.slidertype}
						<div class="swiper-pagination pricing-tables_{$blockkey}"></div>
					{else}
						<div class="swiper-button-prev pricing-tables_{$blockkey}_prev">
							<span class="btn_icon_large"><i class="far fa-long-arrow-left"></i></span>				
						</div>
						<div class="swiper-button-next pricing-tables_{$blockkey}_next">
							<span class="btn_icon_large"><i class="far fa-long-arrow-right"></i></span>
						</div>
					{/if}
				{/if}
			</div>
		</div>
	</div>

	<script>
		jQuery(document).ready(function () {
			{if !$block.DisplayInGrid}
				var swiper = new Swiper('#pricing-tables-{$blockkey}', {
				  slidesPerView: 1,
				  preventClicks: true,
				  slideClass: 'products-slide',
				  {if !$block.slidertype}
					  pagination: {
						el: '.swiper-pagination.pricing-tables_{$blockkey}',
						clickable: true,
					  },
				  {else}
					  navigation: {
						nextEl: '.pricing-tables_{$blockkey}_next',
						prevEl: '.pricing-tables_{$blockkey}_prev',
					  },
				  {/if}
				  breakpoints: {
					0: {
						slidesPerView: 1
					},
					768: {
					  slidesPerView: 2
					},
					992: {
					  slidesPerView:{if $block.itemcounts == "2"} 2{else} 3{/if}
					},
					1200: {
					  slidesPerView:{if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if}
					},
				  }
				  
				});
			{/if}
			
			{if $block.SbSwitcher && !$block.DisableSwitcher}
				jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
				  var selText = jQuery(this).html();
				  jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
				});
				
				jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
					var newCycle = jQuery(this).data('cycle');
					var disBtnBilCycle = jQuery(this).data('cycle');
					jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
					jQuery('.pricing-{$blockkey} .' + newCycle).show();
					jQuery(this).addClass('active').siblings().removeClass('active');
					jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
						var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
						var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
						var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
						var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
					
						jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
						if (jQuery(this).find('.' + newCycle).length <= 0) {
							jQuery(this).find('.pricing_main_default').show();
							jQuery(this).find('.btn-primary').addClass('disabled');
						} else {
							jQuery(this).find('.pricing_main_default').hide();
							jQuery(this).find('.btn-primary').removeClass('disabled');
						}
					});
				});
				jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');			
			
			{else}
				{if !$block.DisableSwitcher}
					jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
					  var selText = jQuery(this).html();
					  jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
					});
					
					jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
						var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
						var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
						var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
						var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
						var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
						
						jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href',disBtnUrlFinal);
						var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
						
						crosPricingTable.find('.pricing_main').each(function() {
							var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
							if (currentBilCycle === disBtnBilCycle) {
								jQuery(this).removeClass('w-hidden');
							} else {
								jQuery(this).addClass('w-hidden');
							}
						});				
					});
				{/if}
			{/if}
		
		});
	</script>

	{elseif $block.ptstyle == 'pts_1'}

	<div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
		<div class="container">
		
			{if $block.caption || $block.sectitle || $block.subtitle}
				<div class="sec-description">
					{if $block.caption}
						<div class="sec-caption">
							<span class="rounded">{$block.caption}</span>
						</div>
					{/if}
					{if $block.sectitle}
						<h2 class="sec-title">{$block.sectitle}</h2>
					{/if}
					{if $block.subtitle}
						<div class="sec-subtitle">{$block.subtitle}</div>
					{/if}
				</div>
			{/if}
		
			<div class="cros-pricing-container">
				{if $block.SbSwitcher && !$block.DisableSwitcher}
					{if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
						{assign var="cycles" value=$block.switcherCycles}
					{else}
						{assign var="cycles" value=$allCycles}
					{/if}
					{if !$block.bsco}
						{assign var="cycles" value=$cycles|@array_reverse}
					{/if}
					<div class="product-billing-switcher-{$blockkey}">
						<div class="btn-group white border d-none d-sm-inline-block" role="group">						
							{foreach $cycles as $cycle}
								<button type="button" class="btn cycle-change" data-cycle="{$cycle}">
									<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
								</button>
							{/foreach}
						</div>
						<div class="btn-group white border d-inline-block d-sm-none">
							<span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
							<button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
								<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
							</button>					
							<ul class="dropdown-menu">
								{foreach $cycles as $cycle}
									<li class="dropdown-item cycle-change" data-cycle="{$cycle}">
										<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
									</li>
								{/foreach}								
							</ul>
						</div>
					</div>
				{/if}			
				<div class="pricing_style_2 pricing-{$blockkey}" id="pricing-tables-{$blockkey}">
					{if count($block.table) > 0}
					{foreach from=$block.table item=$ditem key=$kk}
						<div class="cros-pricing-table{if $block.SbSwitcher} overflow-hidden{/if}{if $block.ststyle} {$block.ststyle}{/if}{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if} pt_st_5{if $ditem['Featured']} active{/if}">
							<div class="row no-gutters">
								<div class="col-lg-8 col-xl-9">
									<div class="content align-items-lg-center">
										{if $ditem['Graphic']}
											{if !$ditem['Graphic']|strstr:"fa-"}
												<div class="graphics fix-width">
													<img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid">
												</div>
											{else}
												<div class="graphics">
													<span class="icon">
														<i class="{$ditem['Graphic']}"></i>
													</span>
												</div>
											{/if}
										{/if}
										<div class="plan-details">
											<div class="h4 plan-name">
												{$ditem['productdetails']['name']}
												{if $ditem['Featured']}
													{if $block.ststyle}
														<span class="st-sm ml-2 fw-400">
															{if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
														</span>
													{/if}
												{/if}
											</div>
											
											{if count($ditem['productdetails']['description']['features']) > 0}
												{if strpos($ditem['productdetails']['description']['featuresdesc'], '<p>') !== false}											
													{$ditem['productdetails']['description']['featuresdesc']}
												{else}
													<p>{$ditem['productdetails']['description']['featuresdesc']}</p>
												{/if}
											{/if}
										
											{if $ditem['productdetails']['description']}
												{if count($ditem['productdetails']['description']['features']) > 0}
													<ul class="plan-features"> 
														<!-- ThurData Featurelist -->
														<table border="0" style="display: inline-table; table-layout:fixed; width:100%; visibility:visible;" cellpadding="0" cellspacing="5">
															{foreach $ditem['productdetails']['description']['features'] as $feature => $value}
																<tr>
																	<td><b>{$feature}</b></td>
																	<td>
																		{if $value == "Ja"}
																			<i class="far fa-check-square" class="td-product-feature-icon"></i>
																		{elseif $value == "Nein"}
																			<i class="far fa-square" class="td-product-feature-icon"></i>
																		{elseif $value == "Optional"}
																			<i class="fas fa-plus" class="td-product-feature-icon"></i>
																		{else}
																			{$value}
																		{/if}
																	</td>
																</tr>
															{/foreach} 
														</table>
														<!-- End ThurData Featurelist -->
														{* original featurelist
														{foreach $ditem['productdetails']['description']['features'] as $feature => $value}
															<li><b>{$value}</b> {$feature}</li>
													   	{/foreach}
													   *}
													</ul>
												{else}
													{$ditem['productdetails']['description']['original']}
												{/if}
											{/if}
										</div>										
									</div>
								</div>
								
								<div class="col-lg-4 col-xl-3">
									<div class="content{if $block.SbSwitcher && $ditem['Featured'] && !$block.ststyle} mr-0 mr-lg-4{/if}">
										{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
					
											{if $block.bsco}
												{foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}							
													{$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
												{/foreach}
											{/if}

											{assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
											{assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
											{assign var="taxtype" value=$dropdownprice['taxtype'] nocache}	
											{assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
										
											<div class="billing-cycle-pricing float{if $block.descp == "below"} desc_belwo{/if}">

												{if !$block.SbSwitcher}
												<div class="btn-group mb-2 mb-lg-0">
													<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
														<div class="pricing_wrapr">
															{$dropdownprice['billingcycle']} @ {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if}
														</div>
														<span class="fal fa-angle-down"></span>
													</a>
													<ul class="dropdown-menu">
														{if $ditem["dropdown"][$ditem['Plan']]}										
														{foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
															<li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
																<div class="pricing_wrapr">
																	{$dropdownprice['billingcycle']} @ {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if}
																</div>
															</li>
														{/foreach}										
														{/if}
													</ul>
												</div>
												{/if}
					
												{if $ditem["dropdown"][$ditem['Plan']]}
												<div class="product_pricing">
													{if $block.SbSwitcher}
														<div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
															<div class="price">
																{if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
																	<span class="regular_pricing">
																		{if $dropdownprice['hasconfigoptions']}
																			<span class="small text-muted">{$WLANG.startingat}</span>
																		{/if}																	
																		{if $dropdownprice['save']}
																			{if $dropdownprice['dollar'] && !$block.DisableBrekdown}
																				<span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
																			{/if}
																			{if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
																		{/if}																
																	</span>
																{/if}											
																<span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
																{if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
															</div>
															<span class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</span>
															{if $dropdownprice['setup'] > 0}
																<div class="small text-muted">
																	<span><i class="fal fa-plus"></i></span>
																	<span>{$dropdownprice['prefix']}</span>
																	{$dropdownprice['setup']}
																	<span>{$dropdownprice['suffix']}</span>
																	{$WLANG.ordersetupfee}
																</div>
															{/if}				
														</div>
													{/if}												
													{foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}										
														<div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
															<div class="price">
																{if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
																	<span class="regular_pricing">
																		{if $dropdownprice['hasconfigoptions']}
																			<span class="small text-muted">{$WLANG.startingat}</span>
																		{/if}																	
																		{if $dropdownprice['save']}
																			{if $dropdownprice['dollar'] && !$block.DisableBrekdown}
																				<span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
																			{/if}
																			{if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
																		{/if}
																	</span>
																{/if}											
																<span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
																{if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
															</div>
															<span class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</span>
															{if $dropdownprice['setup'] > 0}
																<div class="small text-muted">
																	<span><i class="fal fa-plus"></i></span>
																	<span>{$dropdownprice['prefix']}</span>
																	{$dropdownprice['setup']}
																	<span>{$dropdownprice['suffix']}</span>
																	{$WLANG.ordersetupfee}
																</div>
															{/if}				
														</div>
													{/foreach}
												</div>
												{/if}
											</div>
										{else}
											<div class="product_pricing_single">
												{if $block.DisableBrekdown}
													{if isset($ditem.dropdown) && is_array($ditem.dropdown)}
														{foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
															{assign var="firstCycle" value=$dropdown|@end}															
															<div class="price">
																{if $firstCycle.hasconfigoptions}
																	<span class="regular_pricing">
																		<span class="small text-muted">{$WLANG.startingat}</span>
																	</span>
																{/if}											
																<span class="cost">
																	{$firstCycle.prefix}{$firstCycle.price}
																</span>
																<span class="suffix">
																	{$firstCycle.suffix}
																</spn>
															</div>
															<div class="cycle small text-muted">
																{$firstCycle.cycle|capitalize}
															</div>
														{/foreach}
													{/if}
													
												{else}
												
													{if $ditem["price"] == 'FREE'}
														<div class="d-flex align-items-center justify-content-end">
															<span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
														</div>
													{else}
														<div class="price">
															{if $ditem["productdetails"]['hasconfigoptions']}
																<span class="regular_pricing">
																	<span class="small text-muted">{$WLANG.startingat}</span>
																</span>
															{/if}														
															{assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
															<span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
															{if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
														</div>
														{if $ditem["billingcycle"] != ""}
															<div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
														{elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
															<div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
														{/if}
														{if $ditem["productdetails"]["price"]["setupFee"]}
															<div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
														{/if}												
													{/if}
												{/if}
											</div>
										{/if}
										<div class="plan-action mt-auto">
											<a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-sm btn-primary mt-2{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
												{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
											</a>
										</div>										
									</div>
								</div>
							</div>
							{if $ditem['Featured']}
								{if $block.ststyle == ""}
									<div class="sticker-wrapper{if !$block.SbSwitcher} se{/if}">
										<div class="sticker">
											{if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
										</div>
									</div>
								{/if}
							{/if}							
						</div>				
					{/foreach}
					{/if}
				</div>
			</div>
		</div>
	</div>

	<script>
		jQuery(document).ready(function () {
			{if $block.SbSwitcher && !$block.DisableSwitcher}
				jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
				  var selText = jQuery(this).html();
				  jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
				});
				
				jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
					var newCycle = jQuery(this).data('cycle');
					var disBtnBilCycle = jQuery(this).data('cycle');
					jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
					jQuery('.pricing-{$blockkey} .' + newCycle).show();
					jQuery(this).addClass('active').siblings().removeClass('active');
					jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
						var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
						var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
						var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
						var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
					
						jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
						if (jQuery(this).find('.' + newCycle).length <= 0) {
							jQuery(this).find('.pricing_main_default').show();
							jQuery(this).find('.btn-primary').addClass('disabled');
						} else {
							jQuery(this).find('.pricing_main_default').hide();
							jQuery(this).find('.btn-primary').removeClass('disabled');
						}
					});
				});
				jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');			
			
			{else}
				{if !$block.DisableSwitcher}
					jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
					  var selText = jQuery(this).html();
					  jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
					});

					jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
						var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
						var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
						var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
						var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
						var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
						
						jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href',disBtnUrlFinal);
						var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
						
						crosPricingTable.find('.pricing_main').each(function() {
							var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
							if (currentBilCycle === disBtnBilCycle) {
								jQuery(this).removeClass('w-hidden');
							} else {
								jQuery(this).addClass('w-hidden');
							}
						});				
					});
				{/if}
			{/if}
			
		});
	</script>


	{elseif $block.ptstyle == 'pts_2'}

	<div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
		<div class="section__plan_comparison">
			<div class="container">
				
				{if $block.caption || $block.sectitle || $block.subtitle}
					<div class="sec-description">
						{if $block.caption}
							<div class="sec-caption">
								<span class="rounded">{$block.caption}</span>
							</div>
						{/if}
						{if $block.sectitle}
							<h2 class="sec-title">{$block.sectitle}</h2>
						{/if}
						{if $block.subtitle}
							<div class="sec-subtitle">{$block.subtitle}</div>
						{/if}
					</div>
				{/if}
				
				<div class="cros-pricing-container">
					{if $block.SbSwitcher  && !$block.DisableSwitcher}
						{if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
							{assign var="cycles" value=$block.switcherCycles}
						{else}
							{assign var="cycles" value=$allCycles}
						{/if}
						{if !$block.bsco}
							{assign var="cycles" value=$cycles|@array_reverse}
						{/if}
						<div class="product-billing-switcher-{$blockkey}">
							<div class="btn-group white border d-none d-sm-inline-block" role="group">						
								{foreach $cycles as $cycle}
									<button type="button" class="btn cycle-change" data-cycle="{$cycle}">
										<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
									</button>
								{/foreach}
							</div>
							<div class="btn-group white border d-inline-block d-sm-none">
								<span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
								<button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
									<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
								</button>					
								<ul class="dropdown-menu">
									{foreach $cycles as $cycle}
										<li class="dropdown-item cycle-change" data-cycle="{$cycle}">
											<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
										</li>
									{/foreach}								
								</ul>
							</div>
						</div>
					{/if}				
					<div class="cros-pricing-table tables_{$blockkey} no-animation{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if}">
						<div class="plans_slider__nav border-bottom">
							<div class="swiper-button-next tables_{$blockkey}_next">
								<span class="btn__text text-muted">{$WLANG.tablepagesnext}</span>
								<span class="btn__icon"><i class="far fa-long-arrow-right"></i></span>
							</div>
							<div class="swiper-button-prev tables_{$blockkey}_prev">
								<span class="btn__icon"><i class="far fa-long-arrow-left"></i></span>
								<span class="btn__text text-muted">{$WLANG.tablepagesprevious}</span>
							</div>
						</div>						
						<div class="plan plan-{$blockkey}{if $block.centered} centered{/if}">
							<div class="plan__column plan__column--empty">
								<div class="plan__header d-flex align-items-center{if $block.table[0].Graphic|trim != ""} hg{/if}">
									<span class="h4">{$WLANG['store']['ox']['featuresHeadline']}</span>
								</div>
								<div class="plan__body plan__body--right">
									{foreach from=$block.table|@array_column:'featurelist'|@array_count_values item=count key=featurelist}
										{$featurelist}
									{/foreach}
									<div class="plan__cell plan__cell-last{if $block.SbSwitcher || $block.DisableSwitcher} sb{/if}"></div>
								</div>
							</div>
							<div class="swiper-container" id="plans-slider-{$blockkey}">
								<div class="swiper-wrapper">
									{if count($block.table) > 0}
									{foreach from=$block.table item=$ditem key=$kk}
									<div class="swiper-slide">
										<div class="plan__column">
											<div class="plan__header{if $ditem['Graphic']} hg{/if}">
												{if $ditem['Graphic']}
													<div class="graphics">
														{if !$ditem['Graphic']|strstr:"fa-"}
															<img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid">
														{else}
															<span class="icon">
																<i class="{$ditem['Graphic']}"></i>
															</span>
														{/if}									
													</div>
												{/if}
												<span class="h4">{$ditem['productdetails']['name']}</span>
											</div>
											<div class="plan__body">
												{$ditem['featuresvalues']}
												<div class="plan__cell plan__cell-last{if $block.SbSwitcher || $block.DisableSwitcher} sb{/if}">
													{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
								
														{if $block.bsco}
															{foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}							
																{$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
															{/foreach}
														{/if}

														{assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
														{assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
														{assign var="taxtype" value=$dropdownprice['taxtype'] nocache}	
														{assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
													
														<div class="billing-cycle-pricing float{if $block.descp == "below"} desc_belwo{/if}">
															
															{if !$block.SbSwitcher}
															<div class="btn-group mb-2 dropup">
																<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
																	<div class="pricing_wrapr">
																		{$dropdownprice['billingcycle']} @ {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if}
																	</div>
																	<span class="fal fa-angle-down"></span>
																</a>
																<ul class="dropdown-menu">
																	{if $ditem["dropdown"][$ditem['Plan']]}										
																	{foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
																		<li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
																			<div class="pricing_wrapr">
																				{$dropdownprice['billingcycle']} @ {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if}
																			</div>
																		</li>
																	{/foreach}										
																	{/if}
																</ul>
															</div>
															{/if}
								
															{if $ditem["dropdown"][$ditem['Plan']]}
															<div class="product_pricing">
																{if $block.SbSwitcher}
																	<div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
																		{if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
																			<div class="regular_pricing">
																				{if $dropdownprice['hasconfigoptions']}
																					<span class="small text-muted">{$WLANG.startingat}</span>
																				{/if}																			
																				{if $dropdownprice['save']}
																					{if $dropdownprice['dollar'] && !$block.DisableBrekdown}
																						<span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
																					{/if}
																					{if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
																				{/if}
																			</div>
																		{/if}											
																		<div class="price">
																			<span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
																			{if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
																		</div>
																		<div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
																		{if $dropdownprice['setup'] > 0}
																			<div class="small text-muted">
																				<span><i class="fal fa-plus"></i></span>
																				<span>{$dropdownprice['prefix']}</span>
																				{$dropdownprice['setup']}
																				<span>{$dropdownprice['suffix']}</span>
																				{$WLANG.ordersetupfee}
																			</div>
																		{/if}				
																	</div>
																{/if}												
																{foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}										
																	<div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
																		{if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
																			<div class="regular_pricing">
																				{if $dropdownprice['hasconfigoptions']}
																					<span class="small text-muted">{$WLANG.startingat}</span>
																				{/if}																			
																				{if $dropdownprice['save']}
																					{if $dropdownprice['dollar'] && !$block.DisableBrekdown}
																						<span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
																					{/if}
																					{if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
																				{/if}
																			</div>
																		{/if}											
																		<div class="price">
																			<span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
																			{if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
																		</div>
																		<div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
																		{if $dropdownprice['setup'] > 0}
																			<div class="small text-muted">
																				<span><i class="fal fa-plus"></i></span>
																				<span>{$dropdownprice['prefix']}</span>
																				{$dropdownprice['setup']}
																				<span>{$dropdownprice['suffix']}</span>
																				{$WLANG.ordersetupfee}
																			</div>
																		{/if}				
																	</div>
																{/foreach}
															</div>
															{/if}
														</div>
														<a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}{if $ditem["billingcycle"] != ""}&billingcycle={$defaultbilling}{/if}{/if}{/if}" class="btn btn-block btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
															{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
														</a>										
													{else}
														<div class="product_pricing_single d-flex flex-column justify-content-center h-100">
															{if $block.DisableBrekdown}
																{if isset($ditem.dropdown) && is_array($ditem.dropdown)}
																	{foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
																		{assign var="firstCycle" value=$dropdown|@end}
																		{if $firstCycle.hasconfigoptions}
																			<div class="regular_pricing">
																				<span class="small text-muted">{$WLANG.startingat}</span>
																			</div>
																		{/if}															
																		<div class="price">
																			<span class="cost">
																				{$firstCycle.prefix}{$firstCycle.price}
																			</span>
																			<span class="suffix">
																				{$firstCycle.suffix}
																			</spn>
																		</div>
																		<div class="cycle small text-muted">
																			{$firstCycle.cycle|capitalize}
																		</div>
																	{/foreach}
																{/if}
																
															{else}
															
																{if $ditem["price"] == 'FREE'}
																	<span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>										
																{else}
																	{if $ditem["productdetails"]['hasconfigoptions']}
																		<div class="regular_pricing">
																			<span class="small text-muted">{$WLANG.startingat}</span>
																		</div>
																	{/if}
																	<div class="price">									
																		{assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
																		<span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
																		{if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
																	</div>
																	{if $ditem["billingcycle"] != ""}
																		<div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
																	{elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
																		<div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
																	{/if}
																	{if $ditem["productdetails"]["price"]["setupFee"]}
																		<div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
																	{/if}												
																{/if}
															{/if}
															<a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}{if $ditem["billingcycle"] != ""}&billingcycle={$defaultbilling}{/if}{/if}{/if}" class="btn btn-block btn-primary mt-2{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
																{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
															</a>											
														</div>
													{/if}

												</div>
											</div>
											
											{if $ditem['Featured']}
												<div class="sticker-wrapper">
													<div class="sticker">
														{if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
													</div>
												</div>
											{/if}
											
										</div>
									</div>
									{/foreach}
									{/if}
								</div>
								
								
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

	<script>
		jQuery(document).ready(function () {
			var swiper = new Swiper('#plans-slider-{$blockkey}', {
				slidesPerView: 1,
				navigation: {
					nextEl: '.tables_{$blockkey}_next',
					prevEl: '.tables_{$blockkey}_prev',
				},
				breakpoints: {
					0: {
						slidesPerView: 1,
					},
					768: {
					  slidesPerView: 2,
					},
					992: {
					  slidesPerView: {if $block.itemcounts == "2"} 2{else} 3{/if},
					},
					1200: {
					  slidesPerView: {if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if},
					},
				},
				on: {
					init: function (swiper) {
						toggleSliderNav(swiper);
					},
					slideChange: function (swiper) {
						toggleSliderNav(swiper);
					},
					reachEnd: function (swiper) {
						toggleSliderNav(swiper);
					},
					reachBeginning: function (swiper) {
						toggleSliderNav(swiper);
					},
					resize: function (swiper) {
						toggleSliderNav(swiper);
					}
				}
			});
			
			function toggleSliderNav(swiper) {
				var nav = document.querySelector('.tables_{$blockkey} .plans_slider__nav');
				if (swiper.isBeginning && swiper.isEnd) {
					nav.style.display = 'none';
				} else {
					nav.style.display = 'flex';
				}
			}
			
			{if $block.SbSwitcher && !$block.DisableSwitcher}
				jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
				  var selText = jQuery(this).html();
				  jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
				});
				
				jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
					var newCycle = jQuery(this).data('cycle');
					var disBtnBilCycle = jQuery(this).data('cycle');
					jQuery('.plan-{$blockkey} .pricing_main').hide();
					jQuery('.plan-{$blockkey} .' + newCycle).show();
					jQuery(this).addClass('active').siblings().removeClass('active');
					jQuery('.plan-{$blockkey} .plan__body').each(function(index) {
						var disBtnUrlFetch = jQuery(this).closest('.plan-{$blockkey}').find('.btn-primary').attr('href');
						var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
						var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
						var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
					
						jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
						if (jQuery(this).find('.' + newCycle).length <= 0) {
							jQuery(this).find('.pricing_main_default').show();
							jQuery(this).find('.btn-primary').addClass('disabled');
						} else {
							jQuery(this).find('.pricing_main_default').hide();
							jQuery(this).find('.btn-primary').removeClass('disabled');
						}
					});
				});
				
				jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');			
			
			{else}
				{if !$block.DisableSwitcher}
					jQuery(".plan-{$blockkey} .dropdown-menu li").click(function(){
					  var selText = jQuery(this).html();
					  jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
					});
					
					jQuery('.plan-{$blockkey} .billinging_wrapr').click(function(){
						var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
						var disBtnUrlFetch = jQuery(this).closest('.plan-{$blockkey} .plan__body').find('.btn-primary').attr('href');
						var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
						var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
						var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
						
						jQuery(this).closest('.plan-{$blockkey} .plan__body').find('.btn-primary').attr('href',disBtnUrlFinal);
						var crosPricingTable = jQuery(this).closest('.plan-{$blockkey} .plan__body');
						
						crosPricingTable.find('.pricing_main').each(function() {
							var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
							if (currentBilCycle === disBtnBilCycle) {
								jQuery(this).removeClass('w-hidden');
							} else {
								jQuery(this).addClass('w-hidden');
							}
						});				
					});
				{/if}
			{/if}
	
		});
	</script>
	
	{elseif $block.ptstyle == 'pts_3'}
	
		<div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
			<div class="container">
				
				{if $block.caption || $block.sectitle || $block.subtitle}
					<div class="sec-description">
						{if $block.caption}
							<div class="sec-caption">
								<span class="rounded">{$block.caption}</span>
							</div>
						{/if}
						{if $block.sectitle}
							<h2 class="sec-title">{$block.sectitle}</h2>
						{/if}
						{if $block.subtitle}
							<div class="sec-subtitle">{$block.subtitle}</div>
						{/if}
					</div>
				{/if}
				
				<div class="cros-pricing-container">
					{if $block.SbSwitcher && !$block.DisableSwitcher}
						{if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
							{assign var="cycles" value=$block.switcherCycles}
						{else}
							{assign var="cycles" value=$allCycles}
						{/if}
						{if !$block.bsco}
							{assign var="cycles" value=$cycles|@array_reverse}
						{/if}
						<div class="product-billing-switcher-{$blockkey}">
							<div class="btn-group white border d-none d-sm-inline-block" role="group">						
								{foreach $cycles as $cycle}
									<button type="button" class="btn cycle-change" data-cycle="{$cycle}">
										<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
									</button>
								{/foreach}
							</div>
							<div class="btn-group white border d-inline-block d-sm-none">
								<span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
								<button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
									<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
								</button>					
								<ul class="dropdown-menu">
									{foreach $cycles as $cycle}
										<li class="dropdown-item cycle-change" data-cycle="{$cycle}">
											<span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
										</li>
									{/foreach}								
								</ul>
							</div>
						</div>
					{/if}
					<div class="pricing_style_2">					
						<div class="swiper" id="pricing-tables-{$blockkey}">
							<div class="row row-eq-height{if !$block.DisplayInGrid} flex-nowrap{/if} pricing-slider swiper-wrapper pricing-{$blockkey}">
								{if count($block.table) > 0}
								{foreach from=$block.table item=$ditem key=$kk}
									<div class="col-12{if $block.itemcounts == "2"} col-md-6{elseif $block.itemcounts == "3"} col-md-6 col-lg-4 col-xl-4{elseif $block.itemcounts == "4"} col-md-6 col-lg-4 col-xl-3{/if} products-slide">
										<div class="cros-pricing-table overflow-hidden mt-0 mb-4 border-0 p-0{if $block.ststyle} {$block.ststyle}{/if}{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if}{if $ditem['Featured']} active{/if}">							
											{if $ditem['Graphic']}
												<div class="graphics">
													{if !$ditem['Graphic']|strstr:"fa-"}
														<img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="h-rounded img-fluid">
													{/if}
													<div class="d-flex flex-column p-3{if $block.centered} align-items-center{/if}">
														<div class="h4 mb-2">{$ditem['productdetails']['name']}</div>
														{if $ditem['Featured']}
															{if $block.ststyle}
																<div class="feature-sticker mb-2">
																	<span class="st-sm">
																		{if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
																	</span>
																</div>
															{else}
																<div class="sticker-wrapper">
																	<div class="sticker">
																		{if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
																	</div>
																</div>
															{/if}
														{/if}
														{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
									
															{if $block.bsco}
																{foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}							
																	{$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
																{/foreach}
															{/if}

															{assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
															{assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
															{assign var="taxtype" value=$dropdownprice['taxtype'] nocache}	
															{assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
														
															<div class="billing-cycle-pricing mt-0 mb-2 float{if $block.descp == "below"} desc_belwo{/if}">
																{if !$block.SbSwitcher}
																<div class="btn-group dropup">
																	<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
																		<div class="pricing_wrapr">
																			{$dropdownprice['billingcycle']} @ {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if}
																		</div>
																		<span class="fal fa-angle-down"></span>
																	</a>
																	<ul class="dropdown-menu">
																		{if $ditem["dropdown"][$ditem['Plan']]}										
																		{foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
																			<li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
																				<div class="pricing_wrapr">
																					{$dropdownprice['billingcycle']} @ {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if}
																				</div>
																			</li>
																		{/foreach}										
																		{/if}
																	</ul>
																</div>
																{/if}
															</div>
														{/if}
														
														<div class="d-flex align-items-center mt-auto">
															<div class="mr-auto">
																{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
																	<div class="billing-cycle-pricing m-0 float{if $block.descp == "below"} desc_belwo{/if}">
																	{if $ditem["dropdown"][$ditem['Plan']]}
																		<div class="product_pricing">
																			{if $block.SbSwitcher}
																				<div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
																					{if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
																						<div class="regular_pricing">
																							{if $dropdownprice['hasconfigoptions']}
																								<span class="small text-muted">{$WLANG.startingat}</span>
																							{/if}																
																							{if $dropdownprice['save']}
																								{if $dropdownprice['dollar'] && !$block.DisableBrekdown}
																									<span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
																								{/if}
																								{if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
																							{/if}																
																						</div>
																					{/if}											
																					<div class="price">
																						<span class="cost cost-small">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
																						{if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
																					</div>
																					<div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
																					{if $dropdownprice['setup'] > 0}
																						<div class="small text-muted">
																							<span><i class="fal fa-plus"></i></span>
																							<span>{$dropdownprice['prefix']}</span>
																							{$dropdownprice['setup']}
																							<span>{$dropdownprice['suffix']}</span>
																							{$WLANG.ordersetupfee}
																						</div>
																					{/if}				
																				</div>
																			{/if}												
																			{foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}										
																				<div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
																					{if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
																						<div class="regular_pricing">
																							{if $dropdownprice['hasconfigoptions']}
																								<span class="small text-muted">{$WLANG.startingat}</span>
																							{/if}																
																							{if $dropdownprice['save']}
																								{if $dropdownprice['dollar'] && !$block.DisableBrekdown}
																									<span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
																								{/if}
																								{if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
																							{/if}
																						</div>
																					{/if}											
																					<div class="price">
																						<span class="cost cost-small">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
																						{if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
																					</div>
																					<div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
																					{if $dropdownprice['setup'] > 0}
																						<div class="small text-muted">
																							<span><i class="fal fa-plus"></i></span>
																							<span>{$dropdownprice['prefix']}</span>
																							{$dropdownprice['setup']}
																							<span>{$dropdownprice['suffix']}</span>
																							{$WLANG.ordersetupfee}
																						</div>
																					{/if}				
																				</div>
																			{/foreach}
																		</div>
																		{/if}
																	</div>
																{else}
																	<div class="product_pricing_single m-0">
																		{if $block.DisableBrekdown}
																			{if isset($ditem.dropdown) && is_array($ditem.dropdown)}
																				{foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
																					{assign var="firstCycle" value=$dropdown|@end}
																					{if $firstCycle.hasconfigoptions}
																						<div class="regular_pricing">
																							<span class="small text-muted">{$WLANG.startingat}</span>
																						</div>
																					{/if}															
																					<div class="price">
																						<span class="cost cost-small">
																							{$firstCycle.prefix}{$firstCycle.price}
																						</span>
																						<span class="suffix">
																							{$firstCycle.suffix}
																						</spn>
																					</div>
																					<div class="cycle small text-muted">
																						{$firstCycle.cycle|capitalize}
																					</div>
																				{/foreach}
																			{/if}
																			
																		{else}
																		
																			{if $ditem["price"] == 'FREE'}
																				<span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>										
																			{else}
																				{if $ditem["productdetails"]['hasconfigoptions']}
																					<div class="regular_pricing">
																						<span class="small text-muted">{$WLANG.startingat}</span>
																					</div>
																				{/if}
																				<div class="price">									
																					{assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
																					<span class="cost cost-small">{$ditem["productdetails"]["price"]['simple']}</span>
																					{if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
																				</div>
																				{if $ditem["billingcycle"] != ""}
																					<div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
																				{elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
																					<div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
																				{/if}
																				{if $ditem["productdetails"]["price"]["setupFee"]}
																					<div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
																				{/if}												
																			{/if}
																		{/if}																		
																	</div>
																{/if}
															</div>
															{if $ditem['ProductLink']}
																<a href="{if $ditem['link'] == 'domainregister'}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&domain=register{elseif $ditem['link'] == 'domaintransfer'}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&domain=transfer{else}{$WEB_ROOT}/{$ditem['link']}{/if}" class="btn btn-sm w-auto mt-0 btn-primary">
																	{if $ditem['ProductbtnText']}{$ditem['ProductbtnText']}{else}{$WLANG.learnmore}{/if}
																</a>															
															{else}
																<a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-sm w-auto mt-0 btn-order-link btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
																	{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
																</a>
															{/if}
														</div>
													</div>
												</div>												
											{else}
												<div class="d-flex align-items-center justify-content-center p-3 h-100">
													<div class="alert alert-danger text-center">
														Must required graphic for this type of product section.
													</div>
												</div>
											{/if}
										</div>
									</div>				
								{/foreach}
								{/if}
							</div>
						</div>
						{if !$block.DisplayInGrid}
							{if !$block.slidertype}
								<div class="swiper-pagination pricing-tables_{$blockkey}"></div>
							{else}
								<div class="swiper-button-prev pricing-tables_{$blockkey}_prev">
									<span class="btn_icon_large"><i class="far fa-long-arrow-left"></i></span>				
								</div>
								<div class="swiper-button-next pricing-tables_{$blockkey}_next">
									<span class="btn_icon_large"><i class="far fa-long-arrow-right"></i></span>
								</div>
							{/if}
						{/if}
					</div>
				</div>
			</div>
		</div>

		<script>
			jQuery(document).ready(function () {
				{if !$block.DisplayInGrid}
					var swiper = new Swiper('#pricing-tables-{$blockkey}', {
					  slidesPerView: 1,
					  preventClicks: true,
					  slideClass: 'products-slide',
					  {if !$block.slidertype}
						  pagination: {
							el: '.swiper-pagination.pricing-tables_{$blockkey}',
							clickable: true,
						  },
					  {else}
						  navigation: {
							nextEl: '.pricing-tables_{$blockkey}_next',
							prevEl: '.pricing-tables_{$blockkey}_prev',
						  },
					  {/if}
					  breakpoints: {
						0: {
							slidesPerView: 1
						},
						768: {
						  slidesPerView: 2
						},
						992: {
						  slidesPerView:{if $block.itemcounts == "2"} 2{else} 3{/if}
						},
						1200: {
						  slidesPerView:{if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if}
						},
					  }
					  
					});
				{/if}

				{if $block.SbSwitcher && !$block.DisableSwitcher}
					jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
					  var selText = jQuery(this).html();
					  jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
					});
					
					jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
						var newCycle = jQuery(this).data('cycle');
						var disBtnBilCycle = jQuery(this).data('cycle');
						jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
						jQuery('.pricing-{$blockkey} .' + newCycle).show();
						jQuery(this).addClass('active').siblings().removeClass('active');
						
						jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
							var btnOrder = jQuery(this).find('.btn-order-link');
							
							if (btnOrder.length) {
								var disBtnUrlFetch = btnOrder.attr('href');
								var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
								var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv) + '&billingcycle=' + disBtnBilCycle;
								
								btnOrder.attr('href', disBtnUrlFinal);
							}
							
							if (jQuery(this).find('.' + newCycle).length <= 0) {
								jQuery(this).find('.pricing_main_default').show();
								btnOrder.addClass('disabled');
							} else {
								jQuery(this).find('.pricing_main_default').hide();
								btnOrder.removeClass('disabled');
							}
						});
					});
					jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
				
				{else}
					{if !$block.DisableSwitcher}
						jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
						  var selText = jQuery(this).html();
						  jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
						});
						
						jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
							var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
							var btnOrder = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-order-link');
							
							if (btnOrder.length) {
								var disBtnUrlFetch = btnOrder.attr('href');
								var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
								var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv) + '&billingcycle=' + disBtnBilCycle;
								
								btnOrder.attr('href', disBtnUrlFinal);
							}

							var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
							
							crosPricingTable.find('.pricing_main').each(function() {
								var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
								if (currentBilCycle === disBtnBilCycle) {
									jQuery(this).removeClass('w-hidden');
								} else {
									jQuery(this).addClass('w-hidden');
								}
							});
						});
					{/if}
				{/if}
			
			});
		</script>	
	
	{/if}
	
{/if}