JSFiddle - React, Tailwind, and code Playground

HTML

<form id="bookingForm">
        <div class="col-md-6">
            <div class="input-group">
                <span class="input-group-addon">
                    <img src="/media/img/clock-grey.png" />
                </span>
                <select class="form-control">
                    <option>
                        hr
                    </option>
                </select>
                <select class="form-control">
                    <option>
                        min
                    </option>
                </select>
                <select class="form-control">
                    <option>
                        AM
                    </option>
                </select>
            </div>
        </div>
    <div class="row">
        <div class="col-md-6">
            &nbsp;
        </div>
    </div>
</form>

CSS

.input-group select {
	background: url("http://www.invlocate.com/assets/images/arrow-10x10.gif") no-repeat right 5% bottom 40% #000;
	width: 20%;
	font-family: 'Open Sans', sans-serif;
	font-size: .25em;
    line-height: 10px;
	color: #FFF;
	padding: 1% 15% 1% 4%;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #fff;
	-webkit-appearance: none;
}