<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <section id="services" class="home-services"> <div class="container"> <div class="row"> <div class="col-xs-4"> <div class="service-single text-center wow fadeInDown" data-wow-delay="0.2s"> <div class="box-top"> <i class="fa fa-windows"></i> <h2>Windows</h2> </div> <div class="box-down"> <p>Easy Bootstrap Shortcode enable you to add bootstrap 3.0.3 styles in your pages with this code.</p> <div class="smooth"><a href="#contact" class="btn btn-holly">Order Now</a></div> </div> </div> </div> <div class="col-xs-4"> <div class="service-single text-center wow fadeInDown" data-wow-delay="0.4s"> <div class="box-top"> <i class="fa fa-apple"></i> <h2>IOS</h2> </div> <div class="box-down"> <p>Service Box Easy Bootstrap. Bootstrap Review / service Design code example snippet for Bootstrap. </p> <div class="smooth"><a href="#contact" class="btn btn-holly">Order Now</a></div> </div> </div> </div> <div class="col-xs-4"> <div class="service-single text-center wow fadeInDown" data-wow-delay="0.6s"> <div class="box-top"> <i class="fa fa-android"></i> <h2>Android</h2> </div> <div class="box-down"> <p>bootstrap box with rounded corners. Library of precisely prepared monochromatic icons and symbols.</p> <div class="smooth"><a href="#contact" class="btn btn-holly">Order Now</a></div> </div> </div> </div> <div class="col-xs-4"> <div class="service-single text-center wow fadeInDown" data-wow-delay="0.8s"> <div class="box-top"> <i class="fa fa-linux"></i> <h2>Linux</h2> </div> <div class="box-down"> <p>Best free font icons to use with Bootstrap, including a description and explaining how to use them.</p> <div class="smooth"><a href="#contact" class="btn btn-holly">Order Now</a></div> </div> </div> </div> </div> </div> </section>

.service-single{ margin-top: 30px; padding-bottom: 10px; border: 1px solid #e8e8e8; box-shadow: 0 0 10px #e8e8e8; } .service-single .box-top{ background: #FFA500; padding: 30px; color: #fff; } .service-single .box-top i{ font-size: 50px; padding: 20px 0; } .service-single .box-top h2{ font-size: 16px; text-transform: uppercase; margin-bottom: 45px; } .service-single .box-down{ max-width: 350px; margin: 0 auto; border-radius: 100%; background: #fff; margin-top: -50px; padding: 50px 25px 10px 25px; } .service-single .btn-holly{ background: #fff; border:1px solid #f0f0f0; border-radius: 20px; color: #FFA500; } .service-single .btn-holly:hover{ background: #FFA500; border-color: #FFA500; color: #fff; }