<?php
/**
 * Template part for displaying slider section
 *
 * @package Babysitter Childcare
 * @subpackage babysitter_childcare
 */

?>
<?php
$babysitter_childcare_static_image = get_stylesheet_directory_uri() . '/assets/images/header_img.png';
if (get_theme_mod('babysitter_childcare_slider_arrows', true) != '') : ?>
    <section id="banner">
        <div class="container-fuild">
            <div class="row">
                <div class="col-lg-2 col-md-2 counter-box">
                    <?php if (get_theme_mod('babysitter_childcare_total_no_babysitter_center') != '') { ?>
                        <div class="text-center no-center">
                            <i class="fas fa-building"></i><div class="baby-centers"><?php echo esc_html(get_theme_mod('babysitter_childcare_total_no_babysitter_center', '')); ?></div>
                            <div class="baby-centers-text"><?php esc_html_e('Babysitter Centers in All Our World', 'babysitter-childcare'); ?></div>
                        </div>
                    <?php } ?>
                </div>
                <div class="col-lg-8 col-md-8 col-12">
                    <div class="banner-main text-center">
                        <?php if (get_theme_mod('babysitter_childcare_slider_short_heading') != '') { ?>
                            <p class="slidetop-text"><?php echo esc_html(get_theme_mod('babysitter_childcare_slider_short_heading', '')); ?></p>
                        <?php } ?>
                        <?php if (get_theme_mod('babysitter_childcare_slider_heading') != '') { ?>
                            <h1 class="slider-head px-lg-5 mx-lg-5"><?php echo esc_html(get_theme_mod('babysitter_childcare_slider_heading', '')); ?></h1>
                        <?php } ?>
                        <div class="slider-buttons mt-3">
                            <?php if (get_theme_mod('babysitter_childcare_banner_btn_text1') != '' && get_theme_mod('babysitter_childcare_banner_btn_link1')) { ?>
                                <a class="text-capitalize slider-btn1 me-md-3 mb-4" href="<?php echo esc_url(get_theme_mod('babysitter_childcare_banner_btn_link1')); ?>"><?php echo esc_html(get_theme_mod('babysitter_childcare_banner_btn_text1')); ?><span class="screen-reader-text"><?php echo esc_html(get_theme_mod('babysitter_childcare_banner_btn_text1')); ?></span></a>
                            <?php } ?>
                            <?php if (get_theme_mod('babysitter_childcare_banner_btn_text2') != '' && get_theme_mod('babysitter_childcare_banner_btn_link2')) { ?>
                                <a class="text-capitalize slider-btn2 mb-4" href="<?php echo esc_url(get_theme_mod('babysitter_childcare_banner_btn_link2')); ?>"><?php echo esc_html(get_theme_mod('babysitter_childcare_banner_btn_text2')); ?><span class="screen-reader-text"><?php echo esc_html(get_theme_mod('babysitter_childcare_banner_btn_text2')); ?></span></a>
                            <?php } ?>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-3 col-md-3 col-3 px-lg-4 px-1 sliderimg first mb-md-0 mb-3">
                            <?php if (get_theme_mod('babysitter_childcare_banner_image1') != '') { ?>
                                <img src="<?php echo esc_url(get_theme_mod('babysitter_childcare_banner_image1')); ?>" alt="" />
                            <?php } ?>
                        </div>
                        <div class="col-lg-3 col-md-3 col-3 px-lg-4 px-1 sliderimg second mb-md-0 mb-3">
                            <?php if (get_theme_mod('babysitter_childcare_banner_image2') != '') { ?>
                                <img src="<?php echo esc_url(get_theme_mod('babysitter_childcare_banner_image2')); ?>" alt="" />
                            <?php } ?>
                        </div>
                        <div class="col-lg-3 col-md-3 col-3 px-lg-4 px-1 sliderimg third mb-md-0 mb-3">
                            <?php if (get_theme_mod('babysitter_childcare_banner_image3') != '') { ?>
                                <img src="<?php echo esc_url(get_theme_mod('babysitter_childcare_banner_image3')); ?>" alt="" />
                            <?php } ?>
                        </div>
                        <div class="col-lg-3 col-md-3 col-3 px-lg-4 px-1 sliderimg fourth mb-md-0 mb-3">
                            <?php if (get_theme_mod('babysitter_childcare_banner_image4') != '') { ?>
                                <img src="<?php echo esc_url(get_theme_mod('babysitter_childcare_banner_image4')); ?>" alt="" />
                            <?php } ?>
                        </div>
                    </div>
                </div>
                <div class="col-lg-2 col-md-2">
                    <?php if (get_theme_mod('babysitter_childcare_total_no_happy_parents') != '') { ?>
                        <div class="happy-parents counter-box">
                            <div class="row">
                                <div class="col-lg-3 col-md-4 align-self-center">
                                     <i class="fas fa-users"></i>
                                </div>
                                <div class="col-lg-9 col-md-8 align-self-center">
                                    <div class="happy-parents-no baby-centers"><?php echo esc_html(get_theme_mod('babysitter_childcare_total_no_happy_parents', '')); ?></div>
                                    <div class="baby-centers-text"><?php esc_html_e('Happy Parents', 'babysitter-childcare'); ?></div>
                                </div>
                            </div>
                        </div>
                    <?php } ?>
                    <?php if (get_theme_mod('babysitter_childcare_total_no_babysitter') != '') { ?>
                        <div class="no-babysitter counter-box">
                            <div class="row">
                                <div class="col-lg-3 col-md-4 align-self-center">
                                    <i class="fas fa-child"></i>
                                </div>
                                <div class="col-lg-9 col-md-8 align-self-center">
                                    <div class="happy-parents-no baby-centers"><?php echo esc_html(get_theme_mod('babysitter_childcare_total_no_babysitter', '')); ?></div>
                                    <div class="baby-centers-text"><?php esc_html_e('Baby Sitter', 'babysitter-childcare'); ?></div>
                                </div>
                            </div>
                        </div>
                    <?php } ?>
                </div>
            </div>
            <div class="row">
                <div class="col-4 align-self-center">
                    <?php if (get_theme_mod('babysitter_childcare_total_no_babysitter_center') != '') { ?>
                        <div class="text-center no-center counter-box-mobile">
                            <i class="fas fa-building"></i><div class="baby-centers"><?php echo esc_html(get_theme_mod('babysitter_childcare_total_no_babysitter_center', '')); ?></div>
                            <div class="baby-centers-text"><?php esc_html_e('Babysitter Centers in All Our World', 'babysitter-childcare'); ?></div>
                        </div>
                    <?php } ?>
                </div>
                <div class="col-4 align-self-center">
                    <?php if (get_theme_mod('babysitter_childcare_total_no_happy_parents') != '') { ?>
                        <div class="happy-parents text-center counter-box-mobile">
                            <i class="fas fa-users"></i>
                            <div class="happy-parents-no baby-centers"><?php echo esc_html(get_theme_mod('babysitter_childcare_total_no_happy_parents', '')); ?></div>
                            <div class="baby-centers-text"><?php esc_html_e('Happy Parents', 'babysitter-childcare'); ?></div>
                        </div>
                    <?php } ?>
                </div>
                <div class="col-4 align-self-center">
                    <?php if (get_theme_mod('babysitter_childcare_total_no_babysitter') != '') { ?>
                        <div class="text-center no-babysitter counter-box-mobile">
                            <i class="fas fa-child"></i>
                            <div class="happy-parents-no baby-centers"><?php echo esc_html(get_theme_mod('babysitter_childcare_total_no_babysitter', '')); ?></div>
                            <div class="baby-centers-text"><?php esc_html_e('Baby Sitter', 'babysitter-childcare'); ?></div>
                        </div>
                    <?php } ?>
                </div>
            </div>
        </div>
    </section>
<?php endif; ?>
