<!--Carousel Wrapper-->

<div id="multi-item-example" class="carousel slide carousel-multi-item" data-ride="carousel">

​

  <!--Controls-->

  <div class="controls-top">

    <a class="btn-floating" href="#multi-item-example" data-slide="prev"><i class="fas fa-chevron-left"></i></a>

    <a class="btn-floating" href="#multi-item-example" data-slide="next"><i

        class="fas fa-chevron-right"></i></a>

  </div>

  <!--/.Controls-->

​

  <!--Indicators-->

  <ol class="carousel-indicators">

    <li data-target="#multi-item-example" data-slide-to="0" class="active"></li>

    <li data-target="#multi-item-example" data-slide-to="1"></li>

    <li data-target="#multi-item-example" data-slide-to="2"></li>

  </ol>

  <!--/.Indicators-->

​

  <!--Slides-->

  <div class="carousel-inner" role="listbox">

​

    <!--First slide-->

    <div class="carousel-item active">

​

      <div class="col-md-6">

        <div class="card mb-2">

          <img class="card-img-top"

            src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/4-col/img%20(34).webp"

            alt="Card image cap">

          <div class="card-body">

            <h4 class="card-title">Card title</h4>

            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the

              card's content.</p>

            <a class="btn btn-primary">Button</a>

          </div>

        </div>

      </div>

​

      <div class="col-md-6">

        <div class="card mb-2">

          <img class="card-img-top"

            src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/4-col/img%20(18).webp"

            alt="Card image cap">

          <div class="card-body">

            <h4 class="card-title">Card title</h4>

            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the

              card's content.</p>

            <a class="btn btn-primary">Button</a>

          </div>

        </div>

      </div>

​

    </div>

    <!--/.First slide-->

​

    <!--Second slide-->

    <div class="carousel-item">

​

      <div class="col-md-6">

        <div class="card mb-2">

          <img class="card-img-top"

            src="https://mdbootstrap.com/img/Photos/Horizontal/City/4-col/img%20(60).webp" alt="Card image cap">

          <div class="card-body">

            <h4 class="card-title">Card title</h4>

            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the

              card's content.</p>

            <a class="btn btn-primary">Button</a>

          </div>

        </div>

      </div>

​

      <div class="col-md-6">

        <div class="card mb-2">

          <img class="card-img-top"

            src="https://mdbootstrap.com/img/Photos/Horizontal/City/4-col/img%20(47).webp" alt="Card image cap">

          <div class="card-body">

            <h4 class="card-title">Card title</h4>

            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the

              card's content.</p>

            <a class="btn btn-primary">Button</a>

          </div>

        </div>

      </div>

    </div>

    <!--/.Second slide-->

​

    <!--Third slide-->

    <div class="carousel-item">

​

      <div class="col-md-6">

        <div class="card mb-2">

          <img class="card-img-top"

            src="https://mdbootstrap.com/img/Photos/Horizontal/Food/4-col/img%20(53).webp" alt="Card image cap">

          <div class="card-body">

            <h4 class="card-title">Card title</h4>

            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the

              card's content.</p>

            <a class="btn btn-primary">Button</a>

          </div>

        </div>

      </div>

​

      <div class="col-md-6">

        <div class="card mb-2">

          <img class="card-img-top"

            src="https://mdbootstrap.com/img/Photos/Horizontal/Food/4-col/img%20(45).webp" alt="Card image cap">

          <div class="card-body">

            <h4 class="card-title">Card title</h4>

            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the

              card's content.</p>

            <a class="btn btn-primary">Button</a>

          </div>

        </div>

      </div>

​

    </div>

    <!--/.Third slide-->

​

  </div>

  <!--/.Slides-->

​

</div>

<!--/.Carousel Wrapper-->