Is it possible to do slider like this one https://jsfiddle.net/redcats/84h3nm9w/, but inside another? 'cause I have some problem with adding it inside my code (anomalous behavior: slides stretch, disappear, appear and deform when switched). I'm using swiperjs, but mb someone knows how to add slider like this in my code without using library or with another.

<style>
            html,
            body {
              position: relative;
              height: 100%;
            }
        
            body {
              background: #eee;
              margin: 0;
              padding: 0;
            } 
        
            .swiper {
              width: 100%;
              height: 100%;
              background: rgb(rgb(149, 149, 150));
            }
        
            .swiper-slide {
              font-size: 18px;
              color: #fff;
              -webkit-box-sizing: border-box;
              box-sizing: border-box;
              padding: 40px 60px;
            }
            
            .bg {
              position: absolute;
              width: 405%;
              height: 105vh;
              top: -3vh;
              left: -3vh;
              -webkit-background-size: cover;
              background-size: cover;
              background-position: center;
            }
    
            li {
              list-style-type: none; /* Removing markers */
            }
    </style>
    
    <!-- Slider main container -->
            <div class="swiper">  
              <div class="bg">
                <video autoplay muted loop>
                  <source src="./assets/videos/0181-0238.mp4" type="video/mp4">
                </video>
              </div>
              <div class="swiper-wrapper">          
                    <!-- MAIN --> 
                    <div class="swiper-slide">
                      <div class="buttons" id="btns_main">
                        <button class="page1">Portfolio</button>
                        <button class="page2">About me</button>
                        <button class="page3">Contacts</button>
                      </div>
                    </div>
        
                    <!-- PORTFOLIO --> 
                    <div class="swiper-slide">
                      
                      <div class="buttons">
                        <button class="back" id="back">Back</button>
                      </div>
                    </div>