<div class="tab-conteiner">
<div class="w-container container">
    <div class="w-row">
        <div class="w-col w-col-12">
            <!--<div class="tab-conteiner w-col w-col-2">-->
            <!-- Навигация -->
            <ul class="nav nav-tabs row" role="myTabs">
                <li class="active w-col-4"><a href="#home" aria-controls="home" role="tab"
                                              data-toggle="tab"><h3>Для дома</h3></a>
                </li>
                <li class="w-col-4"><a href="#foo" aria-controls="profile" role="tab"
                                       data-toggle="tab"><h3>Для кафе</h3></a></li>
                <li class="w-col-4"><a href="#bar" aria-controls="messages" role="tab" data-toggle="tab"><h3>
                    Для Отдыха</h3></a>
                </li>
            </ul>
            <!-- Содержимое вкладок -->
            <div class="tab-content">
                <div role="tabpanel" class="tab-pane  fade in active" id="home">
                    <div class="slidersection">
                        <!-- Swiper -->
                        <div class="swiper-container1">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide"><img src="images/slider/slider1.jpg"
                                                               alt="image01"/></div>
                                <div class="swiper-slide"><img src="images/slider/slider2.jpg"
                                                               alt="image02"/></div>
                                <div class="swiper-slide"><img src="images/slider/slider3.gif"
                                                               alt="image03"/></div>
                            </div>
                            <div class="swiper-pagination1"></div>
                            <div class="swiper-button-next1"></div>
                            <div class="swiper-button-prev1"></div>
                        </div>
                    </div>
                </div>
                <div role="tabpanel" class="tab-pane  " id="foo">
                    <div class="slidersection">
                        <!-- Swiper -->
                        <div class="swiper-container2">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide"><img src="images/slider/slider4.jpg"
                                                               alt="image01"/></div>
                                <div class="swiper-slide"><img src="images/slider/slider5.jpg"
                                                               alt="image02"/></div>
                                <div class="swiper-slide"><img src="images/slider/slider6.gif"
                                                               alt="image03"/></div>
                            </div>
                            <div class="swiper-pagination2"></div>
                            <div class="swiper-button-next2"></div>
                            <div class="swiper-button-prev2"></div>
                        </div>
                    </div>
                </div>
                <div role="tabpanel" class="tab-pane  in " id="bar">
                    <div class="slidersection">
                        <!-- Swiper -->
                        <div class="swiper-container3">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide"><img src="images/slider/slider7.jpg"
                                                               alt="image01"/></div>
                                <div class="swiper-slide"><img src="images/slider/slider8.jpg"
                                                               alt="image02"/></div>
                                <div class="swiper-slide"><img src="images/slider/slider9.gif"
                                                               alt="image03"/></div>
                            </div>
                            <div class="swiper-pagination3"></div>
                            <div class="swiper-button-next3"></div>
                            <div class="swiper-button-prev3"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
       var swiper = new Swiper('.swiper-container1', {
        pagination: '.swiper-pagination1',
        nextButton: '.swiper-button-next1',
        prevButton: '.swiper-button-prev1',
        paginationClickable: true,
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: null,
        autoplayDisableOnInteraction: false
    });
    var swiper = new Swiper('.swiper-container2', {
        pagination: '.swiper-pagination2',
        nextButton: '.swiper-button-next2',
        prevButton: '.swiper-button-prev2',
        paginationClickable: true,
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: null,
        autoplayDisableOnInteraction: false
    });
    var swiper = new Swiper('.swiper-container3', {
        pagination: '.swiper-pagination3',
        nextButton: '.swiper-button-next3',
        prevButton: '.swiper-button-prev3',
        paginationClickable: true,
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: null,
        autoplayDisableOnInteraction: false
    });

});