<div class="carrusel-items"></div>
<div class="row">
    <a href="https://wa.me/<?php echo $suc_celular; ?>?text=Hola! Me interesa saber acerca de los productos de esta tienda <?php echo utf8_decode($emp_nombre) ?>"
        class="whatsapp" target="_blank"> <i class="fa fa-whatsapp whatsapp-icon"></i></a>
</div>










 

<footer class="footer_widgets">
    <div class="footer_seven_inner">
        <div class="container">
            <div class="footer_top">
                <div class="row">
                    <div class="col-lg-7 ">
                        <div class="social_icone">

                            <ul style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; list-style: none; padding: 0;">
                                <?php if ($face != '') { ?>
                                    <li>
                                        <a href="<?php echo $face ?>" target="_blank" title="Facebook">
                                            <img src="img/ico_redes/facebook.png" alt="Facebook" style="width: 24px; height: 24px;">
                                        </a>
                                        <div class="social_title">
                                            <h3><a href="<?php echo $face ?>" target="_blank">Facebook</a></h3>
                                        </div>
                                    </li>
                                <?php } else { ?>
                                    <li>
                                        <a target="_blank" title="Facebook">
                                            <img src="img/ico_redes/facebook.png" alt="Facebook" style="width: 24px; height: 24px;">
                                        </a>
                                        <div class="social_title">
                                            <h3><a target="_blank">Facebook</a></h3>
                                        </div>
                                    </li>
                                <?php } ?>

                                <?php if ($insta != '') { ?>
                                    <li>
                                        <a href="<?php echo $insta ?>" target="_blank" title="Instagram">
                                            <img src="img/ico_redes/instagram.png" alt="Instagram" style="width: 24px; height: 24px;">
                                        </a>
                                        <div class="social_title">
                                            <h3><a href="<?php echo $insta ?>" target="_blank">Instagram</a></h3>
                                        </div>
                                    </li>
                                <?php } else { ?>
                                    <li>
                                        <a target="_blank" title="Instagram">
                                            <img src="img/ico_redes/instagram.png" alt="Instagram" style="width: 24px; height: 24px;">
                                        </a>
                                        <div class="social_title">
                                            <h3><a target="_blank">Instagram</a></h3>
                                        </div>
                                    </li>
                                <?php } ?>

                                <?php if ($tik != '') { ?>
                                    <li>
                                        <a href="<?php echo $tik ?>" target="_blank" title="Tiktok">
                                            <img src="img/ico_redes/tik-tok.png" alt="Tiktok" style="width: 24px; height: 24px;">
                                        </a>
                                        <div class="social_title">
                                            <h3><a href="<?php echo $tik ?>" target="_blank">Tiktok</a></h3>
                                        </div>
                                    </li>
                                <?php } else { ?>
                                    <li>
                                        <a target="_blank" title="Tiktok">
                                            <img src="img/ico_redes/tik-tok.png" alt="Tiktok" style="width: 24px; height: 24px;">
                                        </a>
                                        <div class="social_title">
                                            <h3><a target="_blank">Tiktok</a></h3>
                                        </div>
                                    </li>
                                <?php } ?>



                                <?php if ($x != '') { ?>
                                    <li>
                                        <a href="<?php echo $x ?>" target="_blank" title="X">
                                            <img src="img/ico_redes/x.png" alt="X" style="width: 24px; height: 24px;">
                                        </a>
                                        <div class="social_title">
                                            <h3><a href="<?php echo $x ?>" target="_blank">X</a></h3>
                                        </div>
                                    </li>
                                <?php }  ?>


                                <?php if ($you != '') { ?>
                                    <li>
                                        <a href="<?php echo $you ?>" target="_blank" title="Youtube">
                                            <img src="img/ico_redes/youtube.png" alt="Youtube" style="width: 24px; height: 24px;">
                                        </a>
                                        <div class="social_title">
                                            <h3><a href="<?php echo $you ?>" target="_blank">Youtube</a></h3>
                                        </div>
                                    </li>
                                <?php } ?>

                            </ul>

                        </div>
                    </div>
                    <div class="col-lg-5 ">
                        <a href="index.html"></a>
                        <div class="footer_contact">
                            <ul>


                                <?php if ($suc_direccion != '' && $suc_direccion != 'NULL') { ?>
                                    <li><i class="zmdi zmdi-home"></i><span>Dirección: </span><?php echo $suc_direccion ?></li>
                                <?php } ?>


                                <?php if ($suc_telefono != '' && $suc_telefono != 'NULL') { ?>
                                    <li><i class="zmdi zmdi-phone-setting"></i><span>Telefono: </span><?php echo $suc_telefono  ?></li>
                                <?php } ?>

                                <?php if ($suc_celular != '' && $suc_celular != 'NULL') { ?>
                                    <li><i class="zmdi zmdi-phone-setting"></i><span>Celular: </span><?php echo $suc_celular  ?></li>
                                <?php } ?>

                                <?php if ($suc_correo != '' && $suc_correo != 'NULL') { ?>
                                    <li><i class="zmdi zmdi-email"></i><span>Correo Electrónico: </span><?php echo $suc_correo  ?></li>
                                <?php } ?>


                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="footer_bottom footer_bottom_seven">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12 col-md-12" style="text-align: center;">
                        <div class="copyright_area">
                            <p>Copyright &copy; 2023 <a style="color:white;" href="https://vicpos2.com/VICPOS/" target="_blank"> vicpos </a></p>
                        </div>
                    </div>

                </div>
            </div>
        </div>
</footer>
<script type="text/javascript">
   



    const carrusel = document.querySelector(".carrusel-items");
    let maxScrollLeft = carrusel.scrollWidth - carrusel.clientWidth;
    let intervalo = null;
    let step = 1;
    const start = () => {
        intervalo = setInterval(function() {
            carrusel.scrollLeft = carrusel.scrollLeft + step;
            if (carrusel.scrollLeft === maxScrollLeft) {
                step = step * -1;
            } else if (carrusel.scrollLeft === 0) {
                step = step * -1;
            }
        }, 15);
    };
    const stop = () => {
        clearInterval(intervalo);
    };
    carrusel.addEventListener("mouseover", () => {
        stop();
    });
    carrusel.addEventListener("mouseout", () => {
        start();
    });
    start();
</script>