<?php
if (get_theme_mod('islamic_trust_about_enable', false) != '') : ?>
    <section id="about" class="clearfix my-md-5 my-3 px-md-0 px-2">
        <div class="container">
            <div class="row">
                <?php
                $islamic_trust_about_page = array();
                $islamic_trust_mod = absint(get_theme_mod('islamic_trust_about_page',get_page_id_by_slug('about-page')));
                if ('page-none-selected' != $islamic_trust_mod) {
                    $islamic_trust_about_page[] = $islamic_trust_mod;
                }
                if (!empty($islamic_trust_about_page)) :
                    $islamic_trust_args = array(
                        'post_type' => 'page',
                        'post__in' => $islamic_trust_about_page,
                        'orderby' => 'post__in',
                    );
                    $islamic_trust_query = new WP_Query($islamic_trust_args);
                    if ($islamic_trust_query->have_posts()) :
                        while ($islamic_trust_query->have_posts()) : $islamic_trust_query->the_post(); ?>
                          <div class="col-lg-6 col-md-6 col-12 mb-md-2 mb-5 align-self-center wow fadeInLeft" data-wow-delay="0.5s">
                            <div class="position-relative">
                              <div class="row">
                                <div class="col-lg-7 col-md-8 position-relative">
                                  <div class="about-main-img mb-3">
                                    <?php if (has_post_thumbnail()) { ?>
                                        <img src="<?php the_post_thumbnail_url('full'); ?>" alt="<?php the_title_attribute(); ?>" />
                                    <?php } else { ?>
                                        <div class="about-color"></div>
                                    <?php } ?>
                                  </div>
                                </div>
                                <div class="col-lg-5 col-md-4 about-img px-md-0">
                                    <div class="bg-about">
                                        <?php if (get_theme_mod('islamic_trust_abt_image') != '') { ?>
                                            <img src="<?php echo esc_url(get_theme_mod('islamic_trust_abt_image')); ?>" alt="" />
                                        <?php } ?>
                                    </div>
                                </div>
                              </div>
                            </div>
                          </div>
                        <?php endwhile; ?>
                        <div class="col-lg-6 col-md-6 about-box align-self-center wow fadeInRight" data-wow-delay="0.5s">
                            <?php if (get_theme_mod('islamic_trust_about_short_heading') != '') { ?>
                                <h2 class="abt-title text-uppercase"><?php echo esc_html(get_theme_mod('islamic_trust_about_short_heading', '')); ?></h2>
                            <?php } ?>
                            <?php while ($islamic_trust_query->have_posts()) : $islamic_trust_query->the_post(); ?>
                                <h3 class="my-3"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
                                <p class="about-content"><?php echo wp_trim_words(get_the_content(), 28); ?></p>
                                <div class="our-serv my-xl-4 my-3">
                                    <div class="row">
                                        <div class="col-lg-4 col-md-4 col-4 align-self-center">
                                            <?php if (get_theme_mod('islamic_trust_total_no_supporters') != '') { ?>
                                                <div class="text-center">
                                                    <div class="trust-counter mb-1"><?php echo esc_html(get_theme_mod('islamic_trust_total_no_supporters', '')); ?></div>
                                                    <div class="trust-counter-text"><?php esc_html_e('Our Supporters', 'islamic-trust'); ?></div>
                                                </div>
                                            <?php } ?>
                                        </div>
                                        <div class="col-lg-4 col-md-4 col-4 align-self-center">
                                            <?php if (get_theme_mod('islamic_trust_total_no_amount_raised') != '') { ?>
                                                <div class="text-center">
                                                    <div class="trust-counter mb-1"><?php echo esc_html(get_theme_mod('islamic_trust_total_no_amount_raised', '')); ?></div>
                                                    <div class="trust-counter-text"><?php esc_html_e("We've Helped Raise", 'islamic-trust'); ?></div>
                                                </div>
                                            <?php } ?>
                                        </div>
                                        <div class="col-lg-4 col-md-4 col-4 align-self-center">
                                            <?php if (get_theme_mod('islamic_trust_total_year_experience') != '') { ?>
                                                <div class="text-center">
                                                    <div class="trust-counter mb-1"><?php echo esc_html(get_theme_mod('islamic_trust_total_year_experience', '')); ?></div>
                                                    <div class="trust-counter-text"><?php esc_html_e('Year Experience', 'islamic-trust'); ?></div>
                                                </div>
                                            <?php } ?>
                                        </div>
                                    </div>
                                </div>
                                <div class="abt-btn mt-5 mb-3">
                                    <a href="<?php the_permalink(); ?>"><?php esc_html_e('Get Started', 'islamic-trust'); ?></a>
                                </div>
                            <?php endwhile; ?>
                            <?php wp_reset_postdata(); ?>
                        </div>
                    <?php else : ?>
                        <div class="no-postfound"><?php esc_html_e('No posts found', 'islamic-trust'); ?></div>
                    <?php endif; ?>
                <?php endif; ?>
                <div class="clearfix"></div>
            </div>
        </div>
    </section>
<?php endif; ?>