Isotop/Portfolio Type 2 | HTML Code

<section id="section-portfolio" class="section light">

    <!-- start container -->
    <div class="container">

        <!-- start section content -->
        <div class="section-content">

            <!-- start section header -->
            <header class="content-header section-header text-center">
                <h2>Featured Projects</h2>
                <p class="lead">Lorem ipsum veniam adipisicing cupidatat dolor do adipisicing commodo</p>
            </header>
            <!-- end section header -->

            <!-- start projects -->
            <div class="projects row">

                <!-- project 1 -->
                <div class="col-lg-4 web">
                    <article class="project">
                        <figure class="project-thumb">
                            <img src="assets/images/portfolio-1.jpg" alt="project-1">
                            <figcaption class="middle">
                                <div>
                                    <a href="assets/images/portfolio-1.jpg" class="icon circle medium lightbox" title="My Project 1"><i class="fa fa-search"></i></a>
                                    <a href="project.html" class="icon circle medium"><i class="fa fa-link"></i></a>
                                </div>
                            </figcaption>
                        </figure>

                        <header class="project-header">
                            <h4 class="project-title"><a href="project.html">Project Title Here</a></h4>
                            <div class="project-meta">Photography</div>
                        </header>
                    </article>
                </div>

                <!-- project 2 -->
                <div class="col-lg-4 photo">
                    <article class="project">
                        <figure class="project-thumb">
                            <img src="assets/images/portfolio-2.jpg" alt="project-2">
                            <figcaption class="middle">
                                <div>
                                    <a href="assets/images/portfolio-2.jpg" class="icon circle medium lightbox" title="My Project 2"><i class="fa fa-search"></i></a>
                                    <a href="project.html" class="icon circle medium"><i class="fa fa-link"></i></a>
                                </div>
                            </figcaption>
                        </figure>

                        <header class="project-header">
                            <h4 class="project-title"><a href="project.html">Project Title Here</a></h4>
                            <div class="project-meta">Photography</div>
                        </header>
                    </article>
                </div>

                <!-- project 3 -->
                <div class="col-lg-4 app">
                    <article class="project">
                        <figure class="project-thumb">
                            <img src="assets/images/portfolio-3.jpg" alt="project-3">
                            <figcaption class="middle">
                                <div>
                                    <a href="assets/images/portfolio-3.jpg" class="icon circle medium lightbox" title="My Project 3"><i class="fa fa-search"></i></a>
                                    <a href="project.html" class="icon circle medium"><i class="fa fa-link"></i></a>
                                </div>
                            </figcaption>
                        </figure>

                        <header class="project-header">
                            <h4 class="project-title"><a href="project.html">Project Title Here</a></h4>
                            <div class="project-meta">Mobile Apps</div>
                        </header>
                    </article>
                </div>

            </div>
            <!-- end projects -->

        </div>
        <!-- end section content -->

    </div>
    <!-- end container -->

</section>
<!-- end section -->