<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<section style="background: url('https://d32d8xzgnjxuvk.cloudfront.net/places/1-0/img/hero-bg.jpg') no-repeat;" class="hero d-flex align-items-center">
<div class="container">
<p class="small-text-hero"><i class="icon-localizer text-primary mr-1"></i>Lorem ipsum <span class="text-primary">dolor sit</span> amet</p>
<h1>Let's <span class="text-primary">go </span> anywhere</h1>
<p class="text-hero">Lorem ipsum dolor sit amet, consectetur adipiscing elit</p>
<div class="search-bar">
<form action="#">
<div class="row">
<div class="form-group rightLine col-lg-2 col-sm-2 col-md-2">
<input type="text" name="location" placeholder="Location" id="location">
<label for="location" class="location"><i class="fa fa-dot-circle-o"></i></label>
</div>
<div class="form-group rightLine col-lg-2 col-sm-2 col-md-2">
<div class="btn-group bootstrap-select listing-categories dropdown">
<button class="btn dropdown-toggle bs-placeholder btn-default" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"><span id="locationtext">Bhopal</span> </button>
<ul class="dropdown-menu locationLink" aria-labelledby="dropdownMenu1">
<li><p>Bhopal</p></li>
<li role="separator" class="divider"></li>
<li><p>Indore</p></li>
<li role="separator" class="divider"></li>
<li><p>Delhi</p></li>
<li role="separator" class="divider"></li>
<li><p>Kolkata</p></li>
</ul>
</div>
</div>
<div class="form-group col-lg-6 col-sm-6 col-md-6">
<input type="search" name="search" placeholder="What are you searching for?">
</div>
<div class="form-group col-lg-2 col-sm-2 col-md-2">
<input type="submit" value="Search" class="submit">
