l<div class="flexi-container">
  <header role="banner">
    <div class="card card-body">
      <div class="row">
        <div class="col-lg-3">
          <p class="h4 mb-0"> <i class="icon icon--phone"></i> 224 444 555</p>
        </div>
        <div class="col-lg-6">
          <h1 class="h4 text-center">
            Flexikredit žádost
          </h1>
        </div>
        <div class="col-lg-3">
          <button type="button" class="btn btn-secondary btn-sm float-right" name="button">Uložit a ukončit</button>
        </div>
      </div>
      <div class="line">

      </div>
    </div>
  </header>
  <div class="modl">
    <div class="card card-body">
      <div class="row">
        <div class="col-lg-3 pl-5">
          <ul class="stepper mt-2 pl-0">
            <li class="stepper-item"><span class="badge badge-primary badge-rounded badge-stepper stepper-done mr-4"><i class="icon icon--old-tick"></i> </span> text</li>
            <li class="stepper-item"><span class="badge badge-primary badge-rounded badge-stepper mr-4">2</span>Žádost</li>
            <li class="stepper-item stepper-item--mid"><span class="badge badge-primary badge-rounded badge-stepper--mid-step"></span> text </li>
            <li class="stepper-item stepper-item--mid stepper-item--disabled"><span class="badge badge-primary badge-rounded badge-stepper--mid-step badge-stepper--mid-step__disabled"></span> text </li>
            <li class="stepper-item stepper-item--disabled"><span class="badge badge-primary badge-rounded badge-stepper mr-4">3</span>Smlouva</li>
            <li class="stepper-item stepper-item--disabled"><span class="badge badge-primary badge-rounded badge-stepper mr-4">4</span>Peníze</li>
          </ul>
        </div>
        <div class="col-lg-9 pr-5">
          <h2 class="h2">
            <strong>
              Kontokorent jsme Vám schválili takto. <br>
              Je to v pořádku?
            </strong>
          </h2>

          <h4 class="h4 pb-3">Váš flexikredit</h4>
          <table class="table table-striped">
            <tbody>
              <tr>
                <td class="pl-4">Výše rezervy</td>
                <td class="text-right pr-4 text-success">15 000 Kč</td>
              </tr>
              <tr>
                <td class="pl-4">Poplatek za sjednání</td>
                <td class="text-right pr-4 text-success"> 0 Kč</td>
              </tr>
              <tr>
                <td class="pl-4">Poplatek za vedení</td>
                <td class="text-right pr-4 text-success"> 0 Kč</td>
              </tr>
              <tr>
                <td class="pl-4">Měsíční poplatek za čerpání</td>
                <td class="text-right pr-4 text-success"> 0 Kč</td>
              </tr>
            </tbody>
          </table>

          <div class="card card-body text-center mb-4 card--bg__gray">
            <p class="text-primary pb-0"><strong>Kolik při čerpání kontokorentu zaplatíte? </strong></p>
            <p class="text-primary pb-0">
              Např. pokud vyčerpáte úvěr 15 000 CZK v plné výši po dobu 3 měsíců, roční úroková sazba bude 21,99 %, poplatek za čerpání 0 CZK, RPSN 27,21 % a celková splatná částka 15 912 CZK.
            </p>
          </div>

          <form class="" action="" metdod="">

            <label class="custom-control custom-checkbox">
              <input type="checkbox" class="custom-control-input" name="" value="">
              <span class="custom-control-indicator"></span>
              <span class="custom-control-description">
                Zajistím, aby mi na účet přišlo každý měsíc alespoň požadované minimum 22 500 Kč
              </span>
            </label>
            <div class="card card-body">
              <div class="row">
                <div class="col-lg-12">
                  <button type="button" class="btn btn-primary float-right" name="button">Pokračovat</button>
                </div>
              </div>
            </div>
          </form>

        </div>
      </div>
    </div>
  </div>
</div>