<div class="slideshow-banner">

  <div class="row">

    <div class="col-sm-24">

      <div class="slideshow-container homeslideshowpc hidden-xs hidden-sm">

        <div class="ecom-slideshow">

          <div class="slider-wrapper theme-default loading" style="min-height:430px">

            <div class="owl-carousel owl-theme 66dff14cf92970b2fa38066ad3695cf3">

              <?php foreach($banner as $item): ?>

              <?php if($item->position=='Slider'): ?>

              <div class="slider-item"> <img class="owl-lazy" data-src='<?php echo e($item->link); ?>' alt="<?php echo e($item->title); ?>" title="<?php echo e($item->title); ?>" class="img-responsive"/>

                <div class="ecom-slideshow-description">

                  <div class=" ecom-owlcarousel-des"><?php echo $item->description; ?></div>

                </div>

              </div>

              <?php endif; ?>

              <?php endforeach; ?>

            </div>

          </div>

        </div>

        <script type="text/javascript">

          require(['jquery','owlSlider','domReady!'],function($){

           var owl = $('.66dff14cf92970b2fa38066ad3695cf3');      

           if(owl.length){

            owl.on('initialized.owl.carousel', function(e) {            

              var parentDiv = $(this).parent();             

              if(parentDiv.hasClass('loading')) 

              {

               parentDiv.removeClass('loading');

               parentDiv.removeAttr('style');

             }        

             var firstImage = parentDiv.find('div.f-image'); 

             firstImage.fadeTo('fast',0);

             firstImage.remove();



           });

            owl.owlCarousel({

             animateOut: "fadeOut",

             animateIn: "fadeIn",

             items: 1,

             loop: true,

             center: true,

                      //rewind: false,



                      startPosition: 0,

                      rtl: ThemeOptions.rtl_layout == 1 ? true : false,                                   



                      autoplay : true,

                      

                      autoplayHoverPause : false,

                      autoplaySpeed: false,

                      nav: true,

                      dots: true,

                      lazyLoad: true,

                      URLhashListener: false,



                    });                 



            if($(window).width()<640)

            {

              $(".slideshow-banner").width($(window).width());

            }

          }

        });           

      </script> 

    </div>

    <div class="slideshow-container homeslideshowmb hidden-lg hidden-md">

      <div class="ecom-slideshow">

        <div class="slider-wrapper theme-default loading" style="min-height:440px">

          <div class="slider-item f-image"> <a href="/blog/thi-cong-noi-that-tang-sofa-chat/"> <img src="assets/media/goretail/slideshow/w/e/web_tcnt-rsfc-02_1.jpg"                              

            alt="/blog/thi-cong-noi-that-tang-sofa-chat/" title="/blog/thi-cong-noi-that-tang-sofa-chat/" /> </a>

            <div class="ecom-slideshow-description">

              <div class="ecom-owlcarousel-des"> </div>

            </div>

          </div>

          <div class="owl-carousel owl-theme a9babf51d189f9a55cf9ab7de045be05">

            <div class="slider-item"> <a href="/blog/thi-cong-noi-that-tang-sofa-chat/"> <img 



              src='assets/media/goretail/slideshow/w/e/web_tcnt-rsfc-02_1.jpg'



              alt="/blog/thi-cong-noi-that-tang-sofa-chat/" title="/blog/thi-cong-noi-that-tang-sofa-chat/" 

              class="img-responsive"

              /> </a>

              <div class="ecom-slideshow-description">

                <div class=" ecom-owlcarousel-des"> </div>

              </div>

            </div>

            <div class="slider-item"> <img 



              class="owl-lazy" data-src='assets/media/goretail/slideshow/m/o/mobile.jpg'



              alt="" title="" 

              class="img-responsive"

              />

              <div class="ecom-slideshow-description">

                <div class=" ecom-owlcarousel-des"> </div>

              </div>

            </div>

            <div class="slider-item"> <img 



              class="owl-lazy" data-src='assets/media/goretail/slideshow/v/e/veneto_web2-01.jpg'





              alt="" title="" 

              class="img-responsive"

              />

              <div class="ecom-slideshow-description">

                <div class=" ecom-owlcarousel-des"> </div>

              </div>

            </div>

          </div>

        </div>

      </div>

      <script type="text/javascript">

        require(['jquery','owlSlider','domReady!'],function($){

         var owl = $('.a9babf51d189f9a55cf9ab7de045be05');      

         if(owl.length){

          owl.on('initialized.owl.carousel', function(e) {            

            var parentDiv = $(this).parent();             

            if(parentDiv.hasClass('loading')) 

            {

             parentDiv.removeClass('loading');

             parentDiv.removeAttr('style');

           }        

           var firstImage = parentDiv.find('div.f-image'); 

           firstImage.fadeTo('fast',0);

           firstImage.remove();



         });

          owl.owlCarousel({

           animateOut: "fadeOut",

           animateIn: "fadeIn",

           items: 1,

           loop: false,

           center: true,

                      //rewind: false,



                      startPosition: 0,

                      rtl: ThemeOptions.rtl_layout == 1 ? true : false,                                   



                      autoplay : true,

                      

                      autoplayHoverPause : false,

                      autoplaySpeed: false,

                      nav: false,

                      dots: true,

                      lazyLoad: true,

                      URLhashListener: false,



                    });                 



          if($(window).width()<640)

          {

            $(".slideshow-banner").width($(window).width());

          }

        }

      });           

    </script> 

  </div>

</div>

</div>

</div>