<div class="row center">
    <div class="col-lg-6">
        <div class="thumbnail">
             
            <div class="caption">
            <i class="fa fa-address-book-o fa-2x" aria-hidden="true"> 未出席名單</i>
              <span class="badge badge-danger">未出席名單</span>
                <ul>
                  <br>
                  <h4><span style="width:100%" class="badge badge-primary">Allen 已經未出席35分鐘</span></h4>
                  <h4><span style="width:100%" class="badge badge-light">Lorem ipsum donec id elit non</span></h4>
                  <h4><span style="width:100%" class="badge badge-secondary">Lorem ipsum donec id elit non</span></h4>
                  <h4><span style="width:100%" class="badge badge-light">Lorem ipsum donec id elit non</span></h4>                
                  <h4><span style="width:100%" class="badge badge-secondary">Lorem ipsum donec id elit non</span></h4>
                  <h4><span style="width:100%" class="badge badge-light">Lorem ipsum donec id elit non</span></h4>                
                  <h4><span style="width:100%" class="badge badge-secondary">Lorem ipsum donec id elit non</span></h4>
                  <h4><span style="width:100%" class="badge badge-light">Lorem ipsum donec id elit non</span></h4>     
                </ul>
            </div>
        </div>
      </div>
  <div class="col-lg-6">
    <div class="thumbnail">
        <div class="caption">
        <i class="fa fa-calendar-o fa-2x" aria-hidden="true"> 待審核事項</i>
            <span class="badge badge-danger">待審核事項</span>
          <ul>
              <br>
                <h4><span style="width:100%" class="badge badge-primary">2019-09-27 17:12 Allen 提出加班申請</span></h4>
                <h4><span style="width:100%" class="badge badge-light">2019-09-27 17:12 Lai 提出加班申請</span></h4>
                <h4><span style="width:100%" class="badge badge-secondary">Lorem ipsum donec id elit non</span></h4>
                <h4><span style="width:100%" class="badge badge-success">Lorem ipsum donec id elit non</span></h4>                
                <h4><span style="width:100%" class="badge badge-secondary">Lorem ipsum donec id elit non</span></h4>
                <h4><span style="width:100%" class="badge badge-success">Lorem ipsum donec id elit non</span></h4>                
                <h4><span style="width:100%" class="badge badge-secondary">Lorem ipsum donec id elit non</span></h4>
                <h4><span style="width:100%" class="badge badge-success">Lorem ipsum donec id elit non</span></h4>                
          </ul>
      </div>
    </div>
  </div>
  <div class="container h-100">
  <div class="row justify-content-center">
  <form class="col-6">
  <div class="form-group row">
    <label for="staticEmail" class="col-sm-2 col-form-label">Email</label>
    <div class="col-sm-10">
      <input type="text" readonly class="form-control-plaintext" id="staticEmail" value="email@example.com">
    </div>
  </div>
  <div class="form-group row">
    <label for="inputPassword" class="col-sm-2 col-form-label">Password</label>
    <div class="col-sm-10">
      <input type="password" class="form-control" id="inputPassword" placeholder="Password">
    </div>
  </div>
  <div style="text-align:center">
  <button type="submit" class="btn btn-primary">Sign in</button>
</div>
<div class="custom-control custom-radio">
          <input type="radio" class="custom-control-input" id="defaultUnchecked" name="defaultExampleRadios">
          <label class="custom-control-label" for="defaultUnchecked">Default unchecked</label>
        </div>
        <div class="custom-control custom-radio">
          <input type="radio" class="custom-control-input" id="defaultChecked" name="defaultExampleRadios" checked="">
          <label class="custom-control-label" for="defaultChecked">Default checked</label>
        </div>
</form>
</div>
</div>