JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<form method="POST" action="../views/menu.php?pag=finalizados">
<div class="form-group">
<div id="aposta_filtro">
<div class="row">
<div class="form-group form-group-jogo col-xl-3 col-lg-3 col-md-3 col-sm-12 col-xs-12">
<label for="regional_aposta">Regional</label>
<select class="form-control" id="regional_aposta" name="ra">
<option>teste</option>
<option>teste2</option>
<option>teste3</option>
</select>
</div>
<div class="form-group form-group-jogo col-xl-3 col-lg-3 col-md-3 col-sm-12 col-xs-12">
<label for="regional_aposta">Cambista</label>
<select class="form-control" id="regional_aposta" name="ra">
<option>teste</option>
<option>teste2</option>
<option>teste3</option>
</select>
</div>
<div class="form-group form-group-jogo col-xl-2 col-lg-2 col-md-2 col-sm-12 col-xs-12">
<label for="filtroInicial">Data Inicial</label>
<input type="text" class="form-control js_date"
id="filtroInicial"
required="true"
name="data_inicial"
value="" >
</div>
<div class="form-group form-group-jogo col-xl-2 col-lg-2 col-md-2 col-sm-12 col-xs-12">
...
CSS
.form-group{
float: none;
display: table-cell;
vertical-align: bottom;
}