<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/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 ----------> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <div class="container-fluid"> <div class="row"> <div class="col-sm-12" style=""> <img src="https://www.gettyimages.ca/gi-resources/images/Homepage/Hero/UK/CMS_Creative_164657191_Kingfisher.jpg" style="width:100%;height:300px;object-fit:cover;"> </div> </div> </div> <section class="module services"> <div class="container"> <div class="row"> <div class="col-lg-4 col-md-4"> <div class="service-item shadow-hover"> <i class="fa fa-home"></i> <h4>Sell Property</h4> <p>Morbi accumsan ipsum velit Nam nec tellus a odio tincidunt auctor a ornare odio sedlon maurisvitae erat consequat auctor</p> </div> </div> <div class="col-lg-4 col-md-4"> <div class="service-item shadow-hover"> <i class="fa fa-group"></i> <h4>Expert Agents</h4> <p>Morbi accumsan ipsum velit Nam nec tellus a odio tincidunt auctor a ornare odio sedlon maurisvitae erat consequat auctor</p> </div> </div> <div class="col-lg-4 col-md-4"> <div class="service-item shadow-hover"> <i class="fa fa-file-text"></i> <h4>Daily Listings</h4> <p>Morbi accumsan ipsum velit Nam nec tellus a odio tincidunt auctor a ornare odio sedlon maurisvitae erat consequat auctor</p> </div> </div> </div><!-- end row --> </div><!-- end container --> </section> <!--===============================header code==========================-->

.module { position: relative; padding: 70px 0px 70px 0px; } .services .service-item { background: whitesmoke; padding: 0% 10% 12% 10%; text-align: center; line-height: 1.6; font-size: 14px; position: relative; z-index: 10; } .shadow-hover { transition: all 0.4s linear; } .shadow-hover:hover { box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.15); } .services { padding-top: 0; } .services .service-item .fa { width: 110px; height: 110px; color: white; background: #003366; font-size: 45px; padding-top: 25px; border-radius: 100px; margin-top: -40px; margin-bottom: 30px; border: 5px solid white; transition: all 0.4s; } .services .service-item h4 { font-weight: 700; font-size: 18px; color: #323746; margin-bottom: 20px; } /*========================================================*/