Text Modules

Text samples

For text align use classes .text-center, .text-start, .text-end. To change color use classes .text-color-{ color name } or shorten .tc-{ color name }

Neque aliquet in nullam

Nunc aliquam est

Pellentesque feugiat

Egestas eu non

Consequat sed faucibus

Viverra ac nibh risus, rhoncus, tortor at. Sit viverra a purus et feugiat vel. Nascetur accumsan, nam pretium massa. Viverra massa ut pellentesque hendrerit. Tempus, penatibus etiam egestas blandit et in. Nunc, ultricies lobortis velit eget iaculis sodales arcu ipsum. Varius ullamcorper magna sit hac velit. Nisi adipiscing nibh enim eget faucibus. Mattis amet dictum interdum netus. Aliquet nulla mi nibh vulputate tempor, fermentum diam. Volutpat, proin amet tellus nibh mauris odio dictum. Amet blandit.

Tellus blandit ut ultrices mollis adipiscing aliquam diam. Tincidunt nibh quam nibh mauris, fringilla mauris. In tellus urna eget vestibulum blandit magna semper. Viverra eu sagittis amet, in maecenas pellentesque nunc, porta. Nisl dolor orci id ridiculus suspendisse lectus in purus congue. In gravida sollicitudin viverra id augue tortor nec.

Sed integer elementum, faucibus massa a consequat, et sit sapien. Volutpat vulputate egestas eu mattis. Consequat facilisi commodo nisl at etiam massa morbi. Dui mus in consectetur id et. Integer venenatis magna in sed. Morbi massa urna amet, eros, mi auctor. Egestas proin sagittis ultricies convallis mattis malesuada dictum nibh diam. Et placerat enim placerat aliquam. Sed sed gravida.

Feugiat

Montes ut


<h1>Neque aliquet in nullam</h1>
<h2>Neque aliquet in nullam</h2>
<h3>Neque aliquet in nullam</h3>
<h4>Neque aliquet in nullam</h4>
<h4>Neque aliquet in nullam</h4>
<p class="big font-weight-bold">Consequat sed faucibus</p>
<p class="big">Viverra ac nibh risus, rhoncus, tortor at. Sit viverra a purus et feugiat vel. Nascetur accumsan, nam pretium massa. Viverra massa ut pellentesque hendrerit. Tempus, penatibus etiam egestas blandit et in. Nunc, ultricies lobortis velit eget iaculis sodales arcu ipsum. Varius ullamcorper magna sit hac velit. Nisi adipiscing nibh enim eget faucibus. Mattis amet dictum interdum netus. Aliquet nulla mi nibh vulputate tempor, fermentum diam. Volutpat, proin amet tellus nibh mauris odio dictum. Amet blandit.</p>
<p>Tellus blandit ut ultrices mollis adipiscing aliquam diam. Tincidunt nibh quam nibh mauris, fringilla mauris. In tellus urna eget vestibulum blandit magna semper. Viverra eu sagittis amet, in maecenas pellentesque nunc, porta. Nisl dolor orci id ridiculus suspendisse lectus in purus congue. In gravida sollicitudin viverra id augue tortor nec.</p>
<p class="font-weight-bold">Sed integer elementum, faucibus massa a consequat, et sit sapien. Volutpat vulputate egestas eu mattis. Consequat facilisi commodo nisl at etiam massa morbi. Dui mus in consectetur id et. Integer venenatis magna in sed.
  Morbi massa urna amet, eros, mi auctor. Egestas proin sagittis ultricies convallis mattis malesuada dictum nibh diam. Et placerat enim placerat aliquam. Sed sed gravida.</p>
<p class="cta">Feugiat</p>

Text columns

Vision

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut l labore.

Mission

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut l labore.

Values

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut l labore.


<div class="text-columns">
  <div class="row text-center justify-content-center">
    <div class="col-12 col-md-6 col-lg-4 mb-5">
      <h3 class="text-color-green-dark mb-4 pb-2">Vision</h3>
      <p class="big">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut l labore.</p>
    </div>
    <div class="col-12 col-md-6 col-lg-4 mb-5">
      <h3 class="text-color-green-dark mb-4  pb-2">Mission</h3>
      <p class="big">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut l labore.</p>
    </div>
    <div class="col-12 col-md-6 col-lg-4 mb-5">
      <h3 class="text-color-green-dark mb-4 pb-2">Values</h3>
      <p class="big">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut l labore.</p>
    </div>
  </div>
  <div class="row text-center pt-3">
    <div class="col-12">
      <a href="#" class="button"><span>More</span></a>
    </div>
  </div>
</div>

Table

For green table add .table--green class to table element. Default table color is light.

Naziv piškotka	Strežnik	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.
JSESSIONID	krka.biz	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.
JSESSIONID	krka.biz	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.
JSESSIONID	krka.biz	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.
JSESSIONID	krka.biz	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.

* Sit phasellus turpis enim sed mattis tristique tempor. Rhoncus augue aliquam quis et nunc leo. Sit viverra adipiscing quis purus. Est, convallis mauris eget in lacus, massa mauris, sociis pretium. Pellentesque neque lectus urna quisque scelerisque id aenean. Erat ullamcorper tellus risus, volutpat risus odio convallis. Est fermentum ipsum semper vitae hac dictum.

Naziv piškotka	Strežnik	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.
JSESSIONID	krka.biz	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.
JSESSIONID	krka.biz	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.
JSESSIONID	krka.biz	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.
JSESSIONID	krka.biz	Poteče ob koncu seje	Osnovno delovanje spletnih strani	Slovenija	KRKA d.d.


<div class="table-wrap">
<table class="table table--green">
<thead>
  <tr>
    <th scope="col">Naziv piškotka</th>
    <th scope="col">Strežnik</th>
    <th scope="col">Poteče ob koncu seje</th>
    <th scope="col">Osnovno delovanje spletnih strani</th>
    <th scope="col">Slovenija</th>
    <th scope="col">KRKA d.d.</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>JSESSIONID</td>
    <td>krka.biz</td>
    <td>Poteče ob koncu seje</td>
    <td>Osnovno delovanje spletnih strani</td>
    <td>Slovenija</td>
    <td>KRKA d.d.</td>
  </tr>
  <tr>
    <td>JSESSIONID</td>
    <td>krka.biz</td>
    <td>Poteče ob koncu seje</td>
    <td>Osnovno delovanje spletnih strani</td>
    <td>Slovenija</td>
    <td>KRKA d.d.</td>
  </tr>
  <tr>
    <td>JSESSIONID</td>
    <td>krka.biz</td>
    <td>Poteče ob koncu seje</td>
    <td>Osnovno delovanje spletnih strani</td>
    <td>Slovenija</td>
    <td>KRKA d.d.</td>
  </tr>
  <tr>
    <td>JSESSIONID</td>
    <td>krka.biz</td>
    <td>Poteče ob koncu seje</td>
    <td>Osnovno delovanje spletnih strani</td>
    <td>Slovenija</td>
    <td>KRKA d.d.</td>
  </tr>
</tbody>
</table>
</div>
<p class="small px-4 mt-1">* Sit phasellus turpis enim sed mattis tristique tempor. Rhoncus augue aliquam quis et nunc leo. Sit viverra adipiscing quis purus. Est, convallis mauris eget in lacus, massa mauris, sociis pretium. Pellentesque neque lectus urna quisque scelerisque id aenean. Erat ullamcorper tellus risus, volutpat risus odio convallis. Est fermentum ipsum semper vitae hac dictum.

List

One
Two
Three


<ul class="bullet-text">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
</ul>