<?php 
if(get_theme_mod('pricing_area_disable') != 'on' ){ ?>
    <?php 
    if( get_theme_mod('pricing_areaTpadding',true) ) {
     $pricing_areaTpadding = 'padding-top:'.esc_attr(get_theme_mod('pricing_areaTpadding')).';';
 }
 if( get_theme_mod('pricing_areaBpadding',true) ) {
     $pricing_areaBpadding = 'padding-bottom:'.esc_attr(get_theme_mod('pricing_areaBpadding')).';';
 }

 ?>	
 <div class="pricing-area" id="pricing" style="<?php echo esc_attr($pricing_areaTpadding); ?>" "<?php echo esc_attr($pricing_areaBpadding); ?>"> 
    <div class="container">
        <?php
            $pricing_page_maintitle = get_theme_mod('pricing_page_maintitle', 'Pricing Plan');
        ?>
        <div class="row justify-content-center">
            <?php if($pricing_page_maintitle){ ?>    
            <div class="section-title">
                    <h2><?php echo ($pricing_page_maintitle);  ?></h2>
            </div>
            <?php }?>
        </div>
    </div>
    <div class="container"> 
        <?php pricingShortcode(); ?>
    </div>
</div>

<script type="text/javascript">
    var title = 0;
    jQuery(".pricing-area .single-pricing").each(function(){
      if ($(this).height() > title) { title = $(this).height(); }
    });
    jQuery(".pricing-area .single-pricing").height(title);


    // on Resize change height

    jQuery(window).resize(function(){
      jQuery(".pricing-area .single-pricing").height("");
      var title = 0;
      jQuery(".pricing-area .single-pricing").each(function(){
        if ($(this).height() > title) { title = $(this).height(); }
      });
      jQuery(".pricing-area .single-pricing").height(title);
    });
</script>

<?php }