<?php
$html_id = pxl_get_element_id($settings);
?>
<div class="pxl-process-box pxl-process-box1 <?php echo esc_attr($settings['pxl_animate'].' '.$settings['popular']); ?>" data-wow-delay="<?php echo esc_attr($settings['pxl_animate_delay']); ?>ms">
    <div class="pxl-process-inner">
        <div class="pxl-item-number">
            <?php echo esc_attr($settings['number']); ?>
        </div>
        <div class="pxl-content-section">
            <div class="pxl-item-content">
                <div class="pxl-item-title">
                    <?php echo esc_attr($settings['title']); ?>
                </div>
                <div class="pxl-item-desc">
                    <?php echo esc_attr($settings['desc']); ?>
                </div>
            </div>
            <?php if(!empty($settings['image']['id'])) : 
                $image_size = !empty($settings['img_size']) ? $settings['img_size'] : '800x524'; 
                $img = pxl_get_image_by_size( array(
                    'attach_id'  => $settings['image']['id'],
                    'thumb_size' => $image_size,
                ));
                $thumbnail = $img['thumbnail'];
                ?>
                <div class="pxl-item--img">
                    <div class="pxl-image">
                        <?php echo pxl_print_html($thumbnail); ?>
                    </div>
                </div>
            <?php endif; ?>
        </div>
    </div>
</div>