{{#header}} {{>lab1-header}} {{/header}}
<main class="container" role="main">
  <form class="" action="" method="">
    <div class="row d-flex justify-content-center">
      <div class="col-lg-12">
        {{#headline}} {{>atoms-headlines}} {{/headline}}
      </div>
      <div class="col-lg-8">
        <div class="card card--shadow">
          <div class="card-body">
            <div class="input-relative">
              <figure class="text-center">
                <img src="{{img_src}}/kreditka/card.png" alt="platební karta">
              </figure>
              <input type="text" name="" value="15 000" class="form-control form-control-lg w-25">
            </div>
            <div class="text-center mb-4">
              <input type="range" class="w-75" name="" value="">
            </div>


            <div class="row">
              <div class="col-lg-6">
                <button type="button" class="btn btn-block btn-secondary" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">Informace</button>
              </div>
              <div class="col-lg-6">
                {{#continue}} {{>atoms-buttons}} {{/continue}}
              </div>
            </div>
          </div>
        </div>
      </div>
  </form>
</main>
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-left" role="document">
    <div class="modal-content">
      <div class="modal-header">

        <button type="button" class="close" data-dismiss="modal" aria-label="close" data-toggle="" data-target=""></button>

      </div>

      <div class="modal-body">
        <h4 class="h4 pb-0">Podrobné informace a ceny</h4>
        {{}}

          <table class="table">
            <thead>
             <tr>
               <th scope="col">#</th>
               <th scope="col">First</th>
               <th scope="col">Last</th>
             </tr>
           </thead>
           <tbody>
             <tr>
               <th scope="row">Bezúročné období</th>
               <td>Mark</td>
               <td>Otto</td>
             </tr>
             <tr>
               <th scope="row">2</th>
               <td>Jacob</td>
               <td>Thornton</td>
             </tr>
             <tr>
               <th scope="row">3</th>
               <td>Larry</td>
               <td>the Bird</td>
             </tr>
           </tbody>
          </table>

        <p class="text-primary">
          *) Výběry v bankomatech budete mít levnější po překročení útraty 2 999 Kč v daném měsíci, do té doby platíte 39 Kč za každý výběr <br>
          **) Cena platí za jednu transakci <br>
          ***) MMB - Moneta Money Bank bankomat
        </p>
        <p class="text-secondary">
          Reprezentativní příklad revolvingového úvěru a kreditní karty MoneyCard Smart vychází z předpokladů, že úvěrový rámec 30 000 Kč je vyčerpán okamžitě v plné výši, bezhotovostním způsobem čerpání a je splácen
          12 stejně vysokými splátkami placenými měsíčně ve výši 2 871,14 Kč. Kreditní karta umožňuje splácení různě vysokými měsíčními částkami, minimálně však 2 %
          z vyčerpaného úvěrového rámce. Doba trvání úvěru: neurčitá. Roční úroková sazba činí 22,99 %. Poplatky související s úvěrem: měsíční poplatek za vedení karty 49 Kč, náklady na distribuci výpisu elektronicky 0 Kč. RPSN 29,79 %, celková částka splatná spotřebitelem
          34 453,68 Kč. Při častějších nebo vyšších splátkách anebo při bezhotovostním čerpání s využitím bezúročného období mohou být údaje uvedené
          u reprezentativního příkladu odlišné.
        </p>
      </div>

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