{{-- <section class="intro-section container">
    <div
        style="
        background-color: #efefef;
        position: relative;
        width: 100%;
        padding: 28.70%;
        overflow: hidden;
    ">
        <div style="
            display: flex;
            justify-content: center;
            position:  absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            text-align: center;
            font-size: 20px;
            color: white;
        "
            class="owl-carousel owl-theme row owl-dot-inner owl-dot-white intro-slider animation-slider cols-1 gutter-no"
            data-owl-options="{
            'nav': false,
            'dots': true,
            'loop': true,
            'items': 1,
            'autoplay': true,
            'autoplayTimeout': 8000
            }"
            id="webBanner">
        </div>
    </div>

</section> --}}
<banner src="/api/v2/banners/web" id="webBanner"></banner>
{{--
<div class="intro-section container"
style="background-color: #efefef;
        position: relative;
        overflow:hidden;
    width: 100%;max-height:50vh">
    <div class="swiper" id="webBanner" style="
                display: flex;
            ">
        <!-- Additional required wrapper -->
        <div class="swiper-wrapper">
        </div>
        <!-- If we need pagination -->
        <div class="swiper-pagination"></div>

        <!-- If we need navigation buttons -->
        <div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>

        <!-- If we need scrollbar -->
        <div class="swiper-scrollbar"></div>
    </div>
</div> --}}


{{-- <div class="owl-carousel owl-theme">
  <div> Your Content </div>
  <div> Your Content </div>
  <div> Your Content </div>
  <div> Your Content </div>
  <div> Your Content </div>
  <div> Your Content </div>
  <div> Your Content </div>
</div> --}}
{{--
<div class="keen-slider" id="keen-banner">
    <div class="keen-slider__slide number-slide1">1</div>
    <div class="keen-slider__slide number-slide2">2</div>
    <div class="keen-slider__slide number-slide3">3</div>
    <div class="keen-slider__slide number-slide4">4</div>
    <div class="keen-slider__slide number-slide5">5</div>
    <div class="keen-slider__slide number-slide6">6</div>
</div> --}}