<?php 
  /*
  $image =  For Image
  $heading = For Heading
  $subheading =  For SubHeading
  $button =  For Button
  $buttonlink =  For Button Link
  $style= For Styling
*/

  $image = wp_get_attachment_image_src( $image, 'small-thumb');
  $image = $image[0];
 
  
      if($style=='style1'){
              echo '<div class="who_we_area col-md-4 col-sm-6 col-4pad wow fadeInUp"><div class="service-1">';
                        if ( ! empty( $image )){
                      echo '<div class="servise-top wow fadeInUp">
                               <img src="'.$image.'">
                           </div>';}
                        if ( ! empty( $heading )){   
                      echo  '<h2 class="unify">'.$heading.'</h2>';
                          }
                        if ( ! empty( $subheading )){
                      echo  '<p class="bottom-s">'.$subheading.'</p>';
                          }
                        if ( ! empty( $button ) || ! empty( $buttonlink )){
                      echo  '<div class="top-banner wow fadeInRight" style="visibility: visible; animation-name: fadeInRight;">
                              <a href="'.esc_url($buttonlink).'" class="btn btn-default btn_text_cap   wow fadeInUp  js-scroll-trigger" data-wow-delay="0.5s" style="visibility: visible; animation-delay: 1s; animation-name: fadeInUp;"><span class="skew_14">'.$button.'</span></a>
                           </div>';
                            }
                      echo   '</div></div>';
                      } 
        else if($style=='style2'){ ?>
              <div class="who_we_area col-md-4 col-sm-6  wow fadeInUp m_t60">
                  <div class="services-service">
                   <?php if ( ! empty( $image )){?>
                     <div class="servise wow fadeInUp">
                        <img src="<?php echo $image; ?>">
                     </div>
                   <?php } ?>

                   <?php if ( ! empty( $heading )){?>
                     <h2 class="unify_about"><?php echo $heading; ?></h2>
                   <?php } ?>
                   <?php if ( ! empty( $subheading )){?>
                   <p ><?php echo $subheading; ?></p>
                   <?php } ?>

                     <div class="top-service_btn wow fadeInRight" style="visibility: visible; animation-name: fadeInRight;">

                      <?php if ( ! empty( $button ) || ! empty( $buttonlink )){?>
                        <a id="#services" href="<?php echo esc_url($buttonlink); ?>" class="btn btn-default btn_text_cap   wow fadeInUp  js-scroll-trigger" data-wow-delay="0.5s" style="visibility: visible; animation-delay: 1s; animation-name: fadeInUp;"><span class="skew_14"><?php echo $button; ?> </span></a>
                        <?php } ?>
                     </div>
                  </div>
               </div>
             <?php } 
                  else if($style=='style3'){ ?>
                <div class="who_we_area col-md-4 col-sm-6 px_10 wow fadeInUp" style="visibility: visible; animation-name: fadeInUp;">
                  <div class="service-about-services">
                    <?php if ( ! empty( $image )){?>
                     <div class=" wow fadeInUp" style="visibility: visible; animation-name: fadeInUp;">
                        <img src="<?php echo $image; ?>">
                     </div>
                     <?php } ?>
                    <?php if ( ! empty( $heading )){?>
                     <h2 class="unify_about"> <?php echo $heading; ?> </h2>
                     <?php } ?>
                     <?php if ( ! empty( $subheading )){?>
                     <p><?php echo $subheading; ?> </p>
                     <?php } ?>
                  </div>
               </div>

              <?php    } ?>


<?php

        // This is where you run the code and display the output
?>