<?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 Packages');
            $pricing_page_text = get_theme_mod('pricing_page_text', 'Choose Your Best Plan');
             
        ?>  
        <div class="row justify-content-center">
            <?php if($pricing_page_maintitle || $pricing_page_text){ ?> 
            <div class="section-title">
                <h2><?php echo ($pricing_page_maintitle);  ?></h2>     
                <h1><?php echo ($pricing_page_text);  ?></h1>
            </div>
            <?php }?>
        </div> 
    </div>
    <div class="container"> 
        <div class="row mr-0">  <?php pricingShortcode();?></div>
    </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 }