<section id="aboutus-section" class="aboutus-area home-aboutus <?php if(esc_attr(get_theme_mod('home_roofing_services_about_section_width','Full Width')) == 'Box Width'){ ?>container pd-0 <?php } elseif(esc_attr(get_theme_mod('home_roofing_services_about_section_width','Box Width')) == 'Box Width'){ ?> container-fluid <?php }?>">

    <?php
        $aboutus_image = get_theme_mod('aboutus_image'); 
        $aboutus_image2 = get_theme_mod('aboutus_image2'); 
        $aboutus_image3 = get_theme_mod('aboutus_image3'); 
    ?>
	<div class="<?php if(esc_attr(get_theme_mod('home_roofing_services_aboutus_section_width','Box Width')) == 'Full Width'){ ?>container-fluid pd-0 <?php } elseif(esc_attr(get_theme_mod('home_roofing_services_aboutus_section_width','Box Width')) == 'Box Width'){ ?> container <?php }?>">
    	<div class="row m-0">  
            <div class="imgbx">
                <div class="abt-image">
                    <div class="abticon">   
                        <div class="abtimg3">              
                            <?php 
                                if(!empty($aboutus_image3)){
                                    echo '<img alt="'. esc_html(get_the_title()) .'" src="'.esc_url($aboutus_image3).'" class="peccular-aboutus-imgboxshape" />';
                                }else{
                                    echo '<img src="'.get_template_directory_uri().'/assets/images/abt-icn.png" class="peccular-aboutus-imgboxshape" />';
                                }
                            ?> 
                        </div>
      
                        <div class="abtimg1">              
                            <?php 
                                if(!empty($aboutus_image)){
                                    echo '<img alt="'. esc_html(get_the_title()) .'" src="'.esc_url($aboutus_image).'" class="peccular-aboutus-imgboxshape" />';
                                }else{
                                    echo '<img src="'.get_template_directory_uri().'/assets/images/aboutimg2.png" />';
                                }
                            ?>
                        </div>
                        <div class="abtimg2">
                            <?php 
                                if(!empty($aboutus_image2)){
                                    echo '<img alt="'. esc_html(get_the_title()) .'" src="'.esc_url($aboutus_image2).'" class="peccular-aboutus-imgboxshape" />';
                                }else{
                                    echo '<img src="'.get_template_directory_uri().'/assets/images/aboutimg3.png" />';
                                }
                            ?>
                        </div>
                    </div>
    			</div>
    		</div>
            <div class="abtdetail">
                <div class="abt-dbx">
                    <div class="abt_subtitle">
                        <h3><?php echo esc_html(get_theme_mod('aboutus_heading')); ?></h3>
                        <i class="fa fa-minus" aria-hidden="true"></i>
                        <i class="fa fa-window-minimize" aria-hidden="true"></i>
                        <i class="fa fa-minus" aria-hidden="true"></i>
                    </div>

                    <h2><?php echo esc_html(get_theme_mod('aboutus_subheading')); ?></h2>
                    <p><?php echo esc_html(get_theme_mod('aboutus_description')); ?></p>
                    
                </div>
                <div class="lists">
                    <h4><i class="fa fa-angle-right" ></i> <?php echo esc_html(get_theme_mod('aboutus_list1')); ?></h4>
                    <h4><i class="fa fa-angle-right" ></i> <?php echo esc_html(get_theme_mod('aboutus_list2')); ?></h4>
                    <h4><i class="fa fa-angle-right" ></i> <?php echo esc_html(get_theme_mod('aboutus_list3')); ?></h4>
                    <h4><i class="fa fa-angle-right" ></i> <?php echo esc_html(get_theme_mod('aboutus_list4')); ?></h4>    
                </div>
                <div class="abt-btn">
                    <a href="<?php echo esc_html(get_theme_mod('aboutus_readmorebtn_link')); ?>">
                        <?php esc_html_e('Read More','home-roofing-services'); ?>
                    </a>
                </div>
                <div class="phnoffertext">
                    <div class="offernum"  style="text-transform:  capitalize ">
                       <p> <?php echo esc_html(get_theme_mod('aboutus_offernum')); ?></p>
                    </div>
                    <div class="about-exp-txt">
                        <svg viewBox="0 0 300.837 127.34">
                          <path id="Subtraction_1" data-name="Subtraction 1" d="M2097.46,124.795H1796.623l218.7-126.266a8,8,0,0,1,10.928,2.928l71.209,123.339v0h0Z" transform="translate(-1796.623 2.545)" fill="#978052"></path>
                        </svg>
                        <div class="phtx"><i class="fa fa-phone" aria-hidden="true"></i>
                        <a href="tel:<?php echo esc_html(get_theme_mod('aboutus_phonetext')); ?>"><?php echo esc_html(get_theme_mod('aboutus_phonetext')); ?></a></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
