Modals

<!-- Button trigger modal -->
<button type="button" class="c-btn c-btn--info" data-toggle="modal" data-target="#modal1">
  Launch Basic Modal
</button>

<!-- Modal -->
<div class="c-modal modal fade" id="modal1" tabindex="-1" role="dialog" aria-labelledby="modal1">
    <div class="c-modal__dialog modal-dialog" role="document">
        <div class="modal-content">
            <div class="c-card u-p-medium u-mh-auto" style="max-width:500px;">
                <h3>Modal Title</h3>
                <p class="u-text-mute u-mb-small">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum similique, dolores dolorem perferendis inventore illum dicta. Nostrum, officiis alias distinctio deleniti aliquid eum dolorum sed fugit omnis molestias! Magnam, animi.</p>
                <button class="c-btn c-btn--info" data-dismiss="modal">
                    Ok, just close this modal
                </button>
            </div>
        </div>
    </div>
</div>

<!-- Button trigger modal -->
<button type="button" class="c-btn c-btn--info" data-toggle="modal" data-target="#modal2">
  Launch Standard Modal
</button>

<!-- Modal -->
<div class="c-modal modal fade" id="modal2" tabindex="-1" role="dialog" aria-labelledby="modal2">
    <div class="c-modal__dialog modal-dialog" role="document">
        <div class="c-modal__content">
            <div class="c-modal__body">
                <span class="c-modal__close" data-dismiss="modal" aria-label="Close">
                    <i class="feather icon-x"></i>
                </span>

                <span class="c-icon c-icon--large u-mb-small">
                  <i class="feather icon-anchor"></i>
                </span>
                <h3 class="u-mb-small">This is the modal title</h3>
                
                <p class="u-mb-medium">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo, ratione quibusdam? Consequuntur natus praesentium adipisci eos, reiciendis distinctio error nostrum animi quos hic perferendis eius fugiat fuga sunt fugit deserunt!</p>

                <div class="o-line">
                  <a href="#" class="c-btn c-btn--info c-btn--outline">Previous</a>
                  <a href="#" class="c-btn c-btn--info">Next</a>
                </div>
            </div>
        </div><!-- // .c-modal__content -->
    </div><!-- // .c-modal__dialog -->
</div><!-- // .c-modal -->