Как выровнять форму по центру bootstrap 3?

Есть на картинка на которую нужно наложить форму и выровнять по центру.

    `<div class="container-fluid">
      <div class="row">
      <div class="img-wrap">  
    <img class="img-responsive" style="margin: 0;padding: 0px;" src="img/bgform.jpg">
    <img src="img/sale.jpg" class="img-responsive img-thumbnail" id="sale">
    <form id="form" role="form" action="" method="post" class="center-block">
    <div class="row">
        <div class="form-group col-xs-3 text-center">
            <div class="control-group required">
                <div class="controls" style="margin-bottom: 10px">     
                    <input class="form-control" placeholder="Введите Ваше имя" id="name" maxlength="30" name="username" type="text" />
                </div>
                <div class="controls" style="margin-bottom: 10px">     
                    <input class="form-control" placeholder="Введите Ваш телефон" id="phone" maxlength="30" name="username" type="text" />
                </div>
                <input class="btn btn-success" type="submit" class="button" value="Отправить"/>
            </div>
        </div>
    </div>
</form>
</div>
</div>`

СSS:

.img-wrap {
  position: relative;
  color:#ffc000;[![Форма в углу нужно центрировать её по вертикали и горизонтали][1]][1]
}
.img-wrap h1 {
  position: absolute;
  top: 0;
  left: 1%;
  bottom: 0;
  width: 100%;
}
.img-wrap #sale {
  position: absolute;
  top: 10%;
  left: 1%;
  bottom: 0;
  width: 400px;
  height: auto;
}
.img-wrap #form {
  position: absolute;
  top: 0;
  left: 1%;
  bottom: 0;
  width: 100%;
}

Заранее спасибо!