how-to-change-4-image-layout

                <div class="container">

                    <h2>Meet the <strong>Team</strong></h2>

                    <ul class="nav nav-pills sort-source" data-sort-id="team" data-option-key="filter">
                        <li class="nav-item" data-option-value="*"><a class="nav-link active" href="#">Show All</a></li>
                        <li class="nav-item" data-option-value=".leadership"><a class="nav-link" href="#">Leadership</a></li>
                        <li class="nav-item" data-option-value=".marketing"><a class="nav-link" href="#">Marketing</a></li>
                        <li class="nav-item" data-option-value=".development"><a class="nav-link" href="#">Development</a></li>
                        <li class="nav-item" data-option-value=".design"><a class="nav-link" href="#">Design</a></li>
                    </ul>

                    <div class="sort-destination-loader sort-destination-loader-showing mt-4 pt-2">
                        <div class="row team-list sort-destination" data-sort-id="team">
                            <div class="col-12 col-sm-6 col-lg-4 isotope-item leadership">
                                <span class="thumb-info thumb-info-hide-wrapper-bg mb-4">
                                    <span class="thumb-info-wrapper">
                                        <a href="about-me.html">
                                            <img src="img/team/team-1.jpg" class="img-fluid" alt="">
                                            <span class="thumb-info-title">
                                                <span class="thumb-info-inner">John Doe</span>
                                                <span class="thumb-info-type">CEO</span>
                                            </span>
                                        </a>
                                    </span>
                                    <span class="thumb-info-caption">
                                        <span class="thumb-info-caption-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac ligula mi, non suscipitaccumsan.</span>
                                        <span class="thumb-info-social-icons">
                                            <a target="_blank" href="http://www.facebook.com"><i class="fab fa-facebook-f"></i><span>Facebook</span></a>
                                            <a href="http://www.twitter.com"><i class="fab fa-twitter"></i><span>Twitter</span></a>
                                            <a href="http://www.linkedin.com"><i class="fab fa-linkedin-in"></i><span>Linkedin</span></a>
                                        </span>
                                    </span>
                                </span>
                            </div>
                            <div class="col-12 col-sm-6 col-lg-4 isotope-item marketing">
                                <span class="thumb-info thumb-info-hide-wrapper-bg mb-4">
                                    <span class="thumb-info-wrapper">
                                        <a href="about-me.html">
                                            <img src="img/team/team-2.jpg" class="img-fluid" alt="">
                                            <span class="thumb-info-title">
                                                <span class="thumb-info-inner">Jessica Doe</span>
                                                <span class="thumb-info-type">Marketing</span>
                                            </span>
                                        </a>
                                    </span>
                                    <span class="thumb-info-caption">
                                        <span class="thumb-info-caption-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac ligula mi, non suscipitaccumsan.</span>
                                        <span class="thumb-info-social-icons">
                                            <a target="_blank" href="http://www.facebook.com"><i class="fab fa-facebook-f"></i><span>Facebook</span></a>
                                            <a href="http://www.twitter.com"><i class="fab fa-twitter"></i><span>Twitter</span></a>
                                            <a href="http://www.linkedin.com"><i class="fab fa-linkedin-in"></i><span>Linkedin</span></a>
                                        </span>
                                    </span>
                                </span>
                            </div>
                            <div class="col-12 col-sm-6 col-lg-4 isotope-item development">
                                <span class="thumb-info thumb-info-hide-wrapper-bg mb-4">
                                    <span class="thumb-info-wrapper">
                                        <a href="about-me.html">
                                            <img src="img/team/team-3.jpg" class="img-fluid" alt="">
                                            <span class="thumb-info-title">
                                                <span class="thumb-info-inner">Rick Edward Doe</span>
                                                <span class="thumb-info-type">Developer</span>
                                            </span>
                                        </a>
                                    </span>
                                    <span class="thumb-info-caption">
                                        <span class="thumb-info-caption-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac ligula mi, non suscipitaccumsan.</span>
                                        <span class="thumb-info-social-icons">
                                            <a target="_blank" href="http://www.facebook.com"><i class="fab fa-facebook-f"></i><span>Facebook</span></a>
                                            <a href="http://www.twitter.com"><i class="fab fa-twitter"></i><span>Twitter</span></a>
                                            <a href="http://www.linkedin.com"><i class="fab fa-linkedin-in"></i><span>Linkedin</span></a>
                                        </span>
                                    </span>
                                </span>
                            </div>
                            <div class="col-12 col-sm-6 col-lg-4 isotope-item design">
                                <span class="thumb-info thumb-info-hide-wrapper-bg mb-4">
                                    <span class="thumb-info-wrapper">
                                        <a href="about-me.html">
                                            <img src="img/team/team-4.jpg" class="img-fluid" alt="">
                                            <span class="thumb-info-title">
                                                <span class="thumb-info-inner">Melinda Doe</span>
                                                <span class="thumb-info-type">Design</span>
                                            </span>
                                        </a>
                                    </span>
                                    <span class="thumb-info-caption">
                                        <span class="thumb-info-caption-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac ligula mi, non suscipitaccumsan.</span>
                                        <span class="thumb-info-social-icons">
                                            <a target="_blank" href="http://www.facebook.com"><i class="fab fa-facebook-f"></i><span>Facebook</span></a>
                                            <a href="http://www.twitter.com"><i class="fab fa-twitter"></i><span>Twitter</span></a>
                                            <a href="http://www.linkedin.com"><i class="fab fa-linkedin-in"></i><span>Linkedin</span></a>
                                        </span>
                                    </span>
                                </span>
                            </div>
                            <div class="col-12 col-sm-6 col-lg-4 isotope-item development">
                                <span class="thumb-info thumb-info-hide-wrapper-bg mb-4">
                                    <span class="thumb-info-wrapper">
                                        <a href="about-me.html">
                                            <img src="img/team/team-5.jpg" class="img-fluid" alt="">
                                            <span class="thumb-info-title">
                                                <span class="thumb-info-inner">Robert Doe</span>
                                                <span class="thumb-info-type">Design</span>
                                            </span>
                                        </a>
                                    </span>
                                    <span class="thumb-info-caption">
                                        <span class="thumb-info-caption-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac ligula mi, non suscipitaccumsan.</span>
                                        <span class="thumb-info-social-icons">
                                            <a target="_blank" href="http://www.facebook.com"><i class="fab fa-facebook-f"></i><span>Facebook</span></a>
                                            <a href="http://www.twitter.com"><i class="fab fa-twitter"></i><span>Twitter</span></a>
                                            <a href="http://www.linkedin.com"><i class="fab fa-linkedin-in"></i><span>Linkedin</span></a>
                                        </span>
                                    </span>
                                </span>
                            </div>
                            <div class="col-12 col-sm-6 col-lg-4 isotope-item marketing">
                                <span class="thumb-info thumb-info-hide-wrapper-bg mb-4">
                                    <span class="thumb-info-wrapper">
                                        <a href="about-me.html">
                                            <img src="img/team/team-6.jpg" class="img-fluid" alt="">
                                            <span class="thumb-info-title">
                                                <span class="thumb-info-inner">Melissa Doe</span>
                                                <span class="thumb-info-type">Marketing</span>
                                            </span>
                                        </a>
                                    </span>
                                    <span class="thumb-info-caption">
                                        <span class="thumb-info-caption-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac ligula mi, non suscipitaccumsan.</span>
                                        <span class="thumb-info-social-icons">
                                            <a target="_blank" href="http://www.facebook.com"><i class="fab fa-facebook-f"></i><span>Facebook</span></a>
                                            <a href="http://www.twitter.com"><i class="fab fa-twitter"></i><span>Twitter</span></a>
                                            <a href="http://www.linkedin.com"><i class="fab fa-linkedin-in"></i><span>Linkedin</span></a>
                                        </span>
                                    </span>
                                </span>
                            </div>
                            <div class="col-12 col-sm-6 col-lg-4 isotope-item development">
                                <span class="thumb-info thumb-info-hide-wrapper-bg mb-4">
                                    <span class="thumb-info-wrapper">
                                        <a href="about-me.html">
                                            <img src="img/team/team-7.jpg" class="img-fluid" alt="">
                                            <span class="thumb-info-title">
                                                <span class="thumb-info-inner">Will Doe</span>
                                                <span class="thumb-info-type">Developer</span>
                                            </span>
                                        </a>
                                    </span>
                                    <span class="thumb-info-caption">
                                        <span class="thumb-info-caption-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac ligula mi, non suscipitaccumsan.</span>
                                        <span class="thumb-info-social-icons">
                                            <a target="_blank" href="http://www.facebook.com"><i class="fab fa-facebook-f"></i><span>Facebook</span></a>
                                            <a href="http://www.twitter.com"><i class="fab fa-twitter"></i><span>Twitter</span></a>
                                            <a href="http://www.linkedin.com"><i class="fab fa-linkedin-in"></i><span>Linkedin</span></a>
                                        </span>
                                    </span>
                                </span>
                            </div>
                            <div class="col-12 col-sm-6 col-lg-4 isotope-item development">
                                <span class="thumb-info thumb-info-hide-wrapper-bg mb-4">
                                    <span class="thumb-info-wrapper">
                                        <a href="about-me.html">
                                            <img src="img/team/team-8.jpg" class="img-fluid" alt="">
                                            <span class="thumb-info-title">
                                                <span class="thumb-info-inner">Jerry Doe</span>
                                                <span class="thumb-info-type">Developer</span>
                                            </span>
                                        </a>
                                    </span>
                                    <span class="thumb-info-caption">
                                        <span class="thumb-info-caption-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac ligula mi, non suscipitaccumsan.</span>
                                        <span class="thumb-info-social-icons">
                                            <a target="_blank" href="http://www.facebook.com"><i class="fab fa-facebook-f"></i><span>Facebook</span></a>
                                            <a href="http://www.twitter.com"><i class="fab fa-twitter"></i><span>Twitter</span></a>
                                            <a href="http://www.linkedin.com"><i class="fab fa-linkedin-in"></i><span>Linkedin</span></a>
                                        </span>
                                    </span>
                                </span>
                            </div>
                        </div>

                    </div>

                </div>