<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="bg-gray section pt-120 pb-90"> <div class="container"> <div class="row"> <div class="col-md-6 col-md-offset-3"> <div class="section-title text-center mb-80"> <h2>Our core feature</h2> <p>t90 comes with some Powerful features that make t90 easily customizable and scalable.</p> </div> </div> </div> <div class="row"> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>bootstrap v4</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>html5</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>css3</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>jquery</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>Owl Slider</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>fontAwesome icon</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>Material Icon</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>google font</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>magnific popup</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>fully responsive</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>W3C Validation</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>ajax contact form</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>Clean Code</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>Speed Optimized</h4> </div> </div> <div class="col-lg-3 col-md-4 col-12 mb-30"> <div class="feature-item"> <img src="http://d29u17ylf1ylz9.cloudfront.net/p2/img/t90-v1/bootstrap.png" alt=""> <h4>Well Documented</h4> </div> </div> </div> </div> </div>

.bg-gray { background-color: #f6f6f6; } .section { float: left; position: relative; width: 100%; } .pb-90 { padding-bottom: 90px; } .pt-120 { padding-top: 120px; } .mb-30 { margin-bottom: 30px; } .feature-item { background-color: #ffffff; border-radius: 5px; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); padding: 45px 15px; text-align: center; }