Resize with Bootstrap slideShowGallery

I have a slideshow gallery. But I need to use the bootstrap classes to be able to resize it on mobile devices, since on the html page it works perfectly for me. But when I use it on mobile devices as I mention them the code is not responsive.

<!-- div para el slideshow gallery -->
        <div class="slideshowGallery ">



               <div class="container">

                <div class="mySlides">
                <div class="numbertext">1 / 6</div>
                <img src="/images/slideshowGallery/1.jpg" style="width: 100%" alt="">

            </div>

              <div class="mySlides">
                <div class="numbertext">2 / 6</div>
                <img src="/images/slideshowGallery/2.jpg" style="width:100%" alt="">
              </div> 

              <div class="mySlides">
                <div class="numbertext">3 / 6</div>
                <img src="/images/slideshowGallery/1.jpg" style="width:100%" alt="">
              </div>

              <div class="mySlides">
                <div class="numbertext">4 / 6</div>
                <img src="/images/slideshowGallery/2.jpg" style="width:100%" alt="">
              </div>

              <div class="mySlides">
                <div class="numbertext">5 / 6</div>
                <img src="/images/slideshowGallery/1.jpg" style="width:100%" alt="">
              </div>

              <div class="mySlides">
                <div class="numbertext">6 / 6</div>
                <img src="/images/slideshowGallery/2.jpg" style="width:100%" alt="">
              </div>

              <a class="prev" onclick="plusSlides(-1)">❮</a>
              <a class="next" onclick="plusSlides(1)">❯</a>

              <div class="caption-container container-fluid">
                <p id="caption"></p>
              </div>

              <div class="row">
                <div class="column">
                  <img class="demo cursor active" src="/images/slideshowGallery/1.jpg" style="width:100%" onclick="currentSlide(1)" alt="The Woods">
                </div>
                <div class="column">
                  <img class="demo cursor" src="/images/slideshowGallery/2.jpg" style="width:100%" onclick="currentSlide(2)" alt="Trolltunga, Norway">
                </div>
                <div class="column">
                  <img class="demo cursor" src="/images/slideshowGallery/1.jpg" style="width:100%" onclick="currentSlide(3)" alt="Mountains and fjords">

                </div>
                <div class="column">
                  <img class="demo cursor" src="/images/slideshowGallery/2.jpg" style="width:100%" onclick="currentSlide(4)" alt="Northern Lights">
                </div>
                <div class="column">
                  <img class="demo cursor" src="/images/slideshowGallery/1.jpg" style="width:100%" onclick="currentSlide(5)" alt="Nature and sunrise">
                </div>    
                <div class="column">
                  <img class="demo cursor" src="/images/slideshowGallery/2.jpg" style="width:100%" onclick="currentSlide(6)" alt="Snowy Mountains">
                </div>
              </div>
            </div>

            <!-- cierra slideshow gallery -->
        </div>