https://i.sstatic.net/VbMhX.png
This is the image in my navbar. I am looking to eliminate the background and border of select options, as well as add some spacing between the two select options and the search bar. How can this be achieved? Additionally, any suggestions on aligning the items horizontally within the navbar?
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="test.php"><i class="fa fa-home">Home</i><span class="sr-only">(current)</span></a>
</li>
<form class="form-inline" action="./test.php?id=1" method="POST">
<li class="nav-item">
<div class="form-group">
<select class="custom-select custom-select-lg mb-3" name="objectType">
<option selected>Object Type</option>
<option value="Toy">Toy</option>
<option value="Furniture">Furniture</option>
<option value="Gift">Gift</option>
<option value="Household">Household</option>
<option value="Instrument">Instrument</option>
</select>
</div>
</li>
<li class="nav-item">
<div class="form-group">
<select class="custom-select custom-select-lg mb-3" name="materialType">
<option selected>Material Type</option>
<option value="Mud">Mud</option>
<option value="Cloth">Cloth</option>
<option value="Thread">Thread</option>
<option value="Jute">Jute</option>
<option value="Cotton">Cotton</option>
<option value="Can">Can</option>
<option value="Bamboo">Bamboo</option>
</select>
</div>
</li>
<li class="nav-item">
<div class="form-group">
<div class="input-group">
<input class="form-control" type="search" placeholder="Search" name="imageName">
<span class="input-group-btn">
<button class="btn btn-outline-secondary" type="submit" id="searchSubmit"><i class="fa fa-search"></i>
</button>
</span>
</div>
</div>
</li>
</form>
To view the complete navbar code, visit newnavbar.php