JSFiddle - React, Tailwind, and code Playground

HTML

<section class="wrapper style1">
    <div class="container">
        <div id="content">
            <!-- Content -->
            <article>
                <header>
                     <h2>Before and After</h2>

                </header>
                <div class="row text-center">
                    <div class="col-xs-offset-3 col-xs-3">
                        <div >
                            <img id="graft1" src="http://sdz-upload.s3.amazonaws.com/prod/tutorialHeadlines/bootstrap.png" alt="" />
                            <label class="caption">Before</label>
                        </div>
                    </div>
                    <div class="col-xs-3">
                        <div class="thumbnail">
                            <img id="graft2" src="http://sdz-upload.s3.amazonaws.com/prod/tutorialHeadlines/bootstrap.png" alt="" />
                            <label class="caption">After</label>
                        </div>
                    </div>
                </div> <!-- End of ROW -->
            </article>
        </div>
    </div>
</section>

CSS

/*img {
    max-width: 30%;
    max-height: 30%;
}*/
.thumbnail {
    border: none;
}