<?php
if(get_theme_mod('luzuk_about_area_disable') != 'on' ){
  ?>
  <!-- About Area Start -->
  <?php 
        if( get_theme_mod('about_areaTpadding',true) ) {
          $about_areaTpadding = 'padding-top:'.esc_attr(get_theme_mod('about_areaTpadding')).';';
        }
        if( get_theme_mod('about_areaBpadding',true) ) {
          $about_areaBpadding = 'padding-bottom:'.esc_attr(get_theme_mod('about_areaBpadding')).';';
        }
        if( get_theme_mod('about_areawave',true) ) {
          $about_areawave = 'top:'.esc_attr(get_theme_mod('about_areawave')).';';
        }
        ?>      
  <div class="about-area bg-img-1" id="about">  
     <div class="container">
      <?php
        $about_page_id = get_theme_mod('about_page');
        $about_subtitle = get_theme_mod('about_subtitle', 'About Us');
        $abouttitle = get_theme_mod('about_title', 'We Help Our Clients To Achieve Their Industry Goals');
        $abouttext = get_theme_mod('about_text', 'There are many variations of new passages of Lorem Ipsum available But Some the majority have suffered alteration some form by injected new passages');

        $aboutus_page_text = get_theme_mod('aboutus_page_text', 'There are many variations of passages of Lorem Ipsum available, but the majority have suffered in some form injected');
        $iframe = get_theme_mod('vide_url', 'Add your Embed Video in customizer');
            
      ?>

      <div class=" abtimg">
          <div class="col-md-6 col-sm-6 abtimginn ">
            <div class="abou-img3">
              <?php 
                  $about_image3 = get_theme_mod('about_image3');
                  if(!empty($about_image3)){
                    echo '<img alt="'. esc_html(get_the_title()) .'" src="'.esc_url($about_image3).'" class="img-responsive secondry-bg-img" />';
                  }else{
                    echo '<img alt="About us" src="'.get_template_directory_uri().'/images/About3.jpg" class="img-responsive" />';
                  }
              ?>
              <?php if( get_theme_mod('about_icon_button_display','show' ) == 'show') :
              ?>
                <div class="about_icon">    
                    <i class="fa fa-bar-chart"></i>
                </div>
              <?php endif ?>
              <div class="clearfix"></div>
            </div>

            
         <div class="clearfix"></div>
      </div>
      <div class="col-md-6 col-sm-6 about-rhs " data-wow-duration="1s">
          <div class="about-right">
                <div class="row">
                    <div class="section-title">
                        <div class="sub-title"><?php echo ($about_subtitle);  ?></div>
                        <?php if($abouttitle ){ ?>
                          <h2><?php echo ($abouttitle);  ?></h2>  
                      <?php }?>
                    </div>
                    <div class="htext"><?php echo ($abouttext);  ?></div>
                </div>    
                
                <div class="clearfix"></div>

              <?php
                $showStatic = true;
                for( $i = 1; $i < 11; $i++ ){
                  $aboutus_page_id = get_theme_mod('aboutus_page_icon'.$i); 
                  if(!empty($aboutus_page_id)){
                    $showStatic = false;
                    break;
                  }
                }
                ?>
                <div class="col-lg-5 col-md-12 Col-sm-12">
                  <div class=""><a href="#" target="_blank"><?php echo $iframe; ?></a></div> 
                </div>

                <div class="col-lg-7 col-md-12 Col-sm-12 aboutus-post-wrap">
                  <?php
                  $cols = get_theme_mod('aboutus_npp_count', 2);
                  $cols++;
                  // echo '$cold: '.$cols;
                  switch($cols){
                    case 1:
                    $colCls = 'col-md-12 col-sm-12 col-xs-12';
                    break;
                    case 2:
                    case 4:
                    case 8:
                    case 7:
                    case 10:
                    case 11:
                    case 12:
                    $colCls = 'col-md-12 col-sm-12 col-xs-12';
                    break;
                    default: 
                    $colCls = 'col-md-12 col-sm-12 col-xs-12';
                    break;
                  }
                  $icons = array(1=>'heart', 2=>'star', 3=>'flash', 4=>'bell',5=>'heart', 6=>'star', 7=>'flash', 8=>'bell');
                  ?>
                  <div class="row aboutus-post-boxes">
                    <?php
                    for( $i = 1; $i <= $cols; $i++ ){
                        if($showStatic === false){
                          $aboutus_page_id = get_theme_mod('aboutus_page'.$i); 
                          $aboutus_page_title = get_theme_mod('aboutus_page_title'.$i, 'We’re Professional Contractors');
                          
                          
                          $aboutus_page_icon = get_theme_mod('aboutus_page_icon'.$i);
                          if($aboutus_page_icon){
                            
                          ?>
                          <div class="<?php echo $colCls;?> pd-0">
                            <?php if($aboutus_page_title ){ ?>
                              <div class="aboutus-single">
                                <div class="col-md-1 col-sm-1 col-xs-1 pd-0">
                                    <div class="hi-icon">
                                        <span class="<?php echo $aboutus_page_icon; ?>"></span>
                                    </div>
                                </div>  
                                <div class="col-md-11 col-sm-11 col-xs-11 ">
                                    <div class="about-area-data">
                                        <h4 class="inner-area-title"><?php echo $aboutus_page_title; ?></h4>
                                    </div>
                                </div>
                              <div class="clearfix"></div>
                              </div>
                              <?php } ?>
                              <div class="clearfix"></div>
                          </div>
                          <?php
                              
                          }
                        }else{?>
                          <div class="<?php echo $colCls;?> pd-0">
                              <div class="aboutus-single">
                                  <div class="col-md-1 col-sm-1 col-xs-1 pd-0">
                                      <div class="hi-icon">
                                          <span class="fa fa-check-square-o"></span>
                                      </div>
                                  </div>
                                  <div class="col-md-11 col-sm-11 col-xs-11 ">
                                      <div class="about-area-data">
                                            <h4 class="inner-area-title">We’re Professional Contractors</h4>
                                      </div>
                                  </div>
                                  <div class="clearfix"></div>            
                              </div>
                              <div class="clearfix"></div>
                          </div>
                        <?php }
                    }?>
                    <div class="clearfix"></div>
                  </div>
                  
                </div>
                <div class="clearfix"></div>
                <div class="lastdiv">
                     <p><?php echo $aboutus_page_text; ?></p> 
                </div>
                <div class="clearfix"></div>
                <?php
                    $about_link = get_theme_mod('about_link', '');
                    $about_button = get_theme_mod('about_button1', 'Read More');
                ?>
                  <?php if($about_button ){ ?>
                    <div class="readmore">
                        <a href="<?php echo $about_link ?>"> <?php echo $about_button ?> </a>
                    </div>
                 <?php }?>
          </div>
      </div>
      <div class="clearfix"></div>
    </div>
    <div class="clearfix"></div> 
  </div>
</div>
  <!-- About Area End -->
<?php }  