<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 href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous"> <section> <div class="container"> <div class="row text-center"> <div class="col-md-2"> <div class="card"> <button type="button" class="btn btn-outline-secondary">Tata</button> </div> </div> <div class="col-md-2"> <div class="card"> <button type="button" class="btn btn-outline-secondary">Maruti</button> </div> </div> <div class="col-md-2"> <div class="card"> <button type="button" class="btn btn-outline-secondary">Skoda</button> </div> </div> <div class="col-md-2"> <div class="card"> <button type="button" class="btn btn-outline-secondary">Hyundai</button> </div> </div> <div class="col-md-2"> <div class="card"> <button type="button" class="btn btn-outline-secondary">Mahindra</button> </div> </div> <div class="col-md-2"> <div class="card"> <button type="button" class="btn btn-outline-secondary">Volvo</button> </div> </div> </div> </div> </section> <div class="pt-5"></div> <section> <div class="container"> <div class="row text-center"> <div class="col-md-2"> <div class="card border"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <a href="#">Dropbox</a> </div> </div> </div> <div class="col-md-2"> <div class="card border"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <a href="#">Dropbox</a> </div> </div> </div> <div class="col-md-2"> <div class="card border"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <a href="#">Dropbox</a> </div> </div> </div> <div class="col-md-2"> <div class="card border"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <a href="#">Dropbox</a> </div> </div> </div> <div class="col-md-2"> <div class="card border"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <a href="#">Dropbox</a> </div> </div> </div> <div class="col-md-2"> <div class="card border"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <a href="#">Dropbox</a> </div> </div> </div> </div> </div> </section> <div class="pt-5"></div> <section> <div class="container"> <div class="row text-center"> <div class="col-md-12"> <div class="card-group"> <div class="card border"> <a href="#"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <h6 class="card-title">C</h6> </div> </a> </div> <div class="card border"> <a href="#"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <h6 class="card-title">Card title</h6> </div> </a> </div> <div class="card border"> <a href="#"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <h6 class="card-title">Card title</h6> </div> </a> </div> <div class="card border"> <a href="#"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <h6 class="card-title">Card title</h6> </div> </a> </div> <div class="card border"> <a href="#"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <h6 class="card-title">Card title</h6> </div> </a> </div> <div class="card border"> <a href="#"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <h6 class="card-title">Card title</h6> </div> </a> </div> <div class="card border"> <a href="#"> <div class="card-body"> <i class="fa fa-dot-circle-o"></i> <h6 class="card-title">Card title</h6> </div> </a> </div> </div> </div> </div> </div> </section> <div class="pt-5"></div> <section class="banner-img py-5"> <div class="container"> <div class="row text-center"> <div class="col-md-12"> <h3>Find the best deal in your locality</h3> </div> </div> <div class="pt-5"></div> <div class="row"> <div class="col-md-2"> <ul class="list-unstyled"> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> </ul> </div> <div class="col-md-2"> <ul class="list-unstyled"> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> </ul> </div> <div class="col-md-2"> <ul class="list-unstyled"> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> </ul> </div> <div class="col-md-2"> <ul class="list-unstyled"> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> </ul> </div> <div class="col-md-2"> <ul class="list-unstyled"> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> </ul> </div> <div class="col-md-2"> <ul class="list-unstyled"> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> <a href="#"><li>Cars in New Delhi</li></a> </ul> </div> </div> </div> </section>

.banner-img {background: url(https://images.pexels.com/photos/395198/pexels-photo-395198.jpeg?auto=compress&cs=tinysrgb&h=650&w=940) center top;}