<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="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div id="top-filter" class="top-filter tfilter-box"data-spy="affix" data-offset-top="197" > <div class="container"> <div class="row"> <div class="col-sm-2"> <div class="row"> <div class="col-md-12"> <input class="form-control" placeholder="Search by car number" type="text"> </div> </div> </div> <div class="col-sm-2"> <select class="form-control" > <option value="0" selected="selected"> Zone </option> <option value="1"> North </option> <option value="2"> South </option> <option value="3"> East </option> <option value="4"> West </option> </select> </div> <div class="col-sm-2"> <select class="form-control"> <option value="0" selected="selected"> State </option> <option value="1"> New Delhi </option> <option value="2"> Haryana </option> <option value="3"> Jaipur </option> <option value="4"> Rajasthan </option> <option value="5"> Himachal Pradesh </option> <option value="6"> Jharkhand </option> </select> </div> <div class="col-sm-2"> <select class="form-control"> <option value="0" selected="selected"> Brand </option> <option value="1"> Honda </option> <option value="2"> Toyota </option> <option value="3"> Skoda </option> <option value="4"> Volkswagen </option> <option value="5"> Tata </option> <option value="6"> Renault </option> </select> </div> <div class="col-sm-2"> <select class="form-control"> <option value="0" selected="selected"> Model </option> <option value="1"> Verna </option> <option value="2"> Wagon R </option> <option value="3"> Alto </option> <option value="4"> Activa </option> <option value="5"> Ace </option> <option value="6"> Corolla </option> </select> </div> <div class="col-sm-1"> <button type="button" class="btn btn-primary site-btn">Submit</button> </div> </div> </div> </div>

/* Top Filter Box */ .tfilter-box { padding:15px 0px 15px 0px; border: 1px solid #ababab; background-color : #f2f2f2; z-index:1000; } .form-control, select { display: block; width: 100%; height: 48px; border: 1px solid #ededed; border-radius: 0; background-color: #fff; background-image: none; box-shadow: none; color: #000; font-size: 14px; line-height: 1.42857143; } /******************** CARD CSS *******************/ .card { background: #fff none repeat scroll 0 0; box-shadow: 0 2px 5px -1px rgba(0, 0, 0, 0.16); margin-bottom: 30px; overflow: hidden; display: block; width: 100%; position: relative; border: 1px solid #e5e5e5; } .card:hover {box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);} .card-block { padding: 15px 15px 0 15px; background: #fff none repeat scroll 0 0; } .card-img { border-radius: 0px 0px 0 0; max-height: 180px; overflow: hidden; } .card-footer { background: #fff none repeat scroll 0 0; overflow: hidden; width: 100%; border-top: 1px solid #e5e5e5; padding:5px 0px 5px 5px; } .card-bid-btn { display: inline-block; margin-top: 8px; padding-left: 14px; margin-bottom: 0; } .card-footer ul li a { border-left: 1px solid #e5e5e5; display: block; height: inherit; margin-top: 8px; text-align: center; width: 30px; padding-left:5px; } .card-footer ul li a:hover {background:#dd0000;}