nanlabsweb

<h1>h1. Bootstrap heading</h1>
<h2>h2. Bootstrap heading</h2>
<h3>h3. Bootstrap heading</h3>
<h4>h4. Bootstrap heading</h4>
<h5>h5. Bootstrap heading</h5>
<h6>h6. Bootstrap heading</h6>

nanlabsweb

<div>
  <h1 class="lead-title"><strong>Small enough to care, big enough to get the job done.</strong></h1>
</div>
<div>
  <h1 class="composed-title"><small>Software</small> Solutions</h1>
  <h1 class="composed-title brand-dark"><small>Research &amp;</small> Development</h1>
</div>
<h2><strong>Digital</strong> Marketing</h2>
<h2 class="brand-dark"><strong>Network</strong> Discovery</h2>
<h4><strong>Case Stude #01</strong></h4>

nanlabsweb

<p><strong>Regular paragraph:</strong> Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p>
<p class="mono">&lt; comment element /&gt;</p>

nanlabsweb

<p><strong>Regular paragraph:</strong> Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p>
<p class="mono">&lt; comment element /&gt;</p>

nanlabsweb

<button class="btn btn-default">Let's Talk</button>
<button class="btn btn-primary">Let's Talk</button>
<button class="btn btn-link">Let's Talk</button>
<button class="btn btn-info">Let's Talk</button>
<button class="btn btn-default btn-sm">Let's Talk</button>
<button class="btn btn-default btn-lg">Let's Talk</button>

nanlabsweb

<div style="width: 100px;">
  <div class="isotype" data-type="svg" data-src="/wp-content/themes/nanlabs/dist/images/icon/isotype.svg"></div>
</div>
<div>
  <code>width: 100px;</code>
  <br><br>
</div>
<div style="width: 150px;">
  <div class="isotype" data-type="svg" data-src="/wp-content/themes/nanlabs/dist/images/icon/isotype.svg"></div>
</div>

nanlabsweb

<div class="imagetype small">
  <div class="isotype" data-type="svg" data-src="/wp-content/themes/nanlabs/dist/images/icon/isotype.svg"></div>
  <div class="logotype dark" data-type="svg" data-src="/wp-content/themes/nanlabs/dist/images/icon/logotype.svg"></div>
</div>
<br><br>
<div class="imagetype">
  <div class="isotype" data-type="svg" data-src="/wp-content/themes/nanlabs/dist/images/icon/isotype.svg"></div>
  <div class="logotype dark" data-type="svg" data-src="/wp-content/themes/nanlabs/dist/images/icon/logotype.svg"></div>
</div>

nanlabsweb

<div>
  <figure class="figure">+28k</figure>
  <span class="stitch small"></span>
  <h4 class="brand-dark">Venues Accounts</h4>
</div>
<div>
  <figure class="figure">1.15M</figure>
  <span class="stitch small"></span>
  <h4 class="brand-dark">Submissions Sent</h4>
</div>

nanlabsweb

<div style="width: 100px;">
  <div data-type="svg" data-src="/wp-content/themes/nanlabs/dist/images/icon/number-01.svg"></div>
</div>
<div style="width: 100px;">
  <div data-type="svg" data-src="/wp-content/themes/nanlabs/dist/images/icon/number-02.svg"></div>
</div>
<div style="width: 100px;">
  <div data-type="svg" data-src="/wp-content/themes/nanlabs/dist/images/icon/number-03.svg"></div>
</div>

nanlabsweb

$brand-color-unit:          6%;

$brand-primary:             #5d73f5 !default;
$brand-primary-light:       lighten($brand-primary, $brand-color-unit) !default;
$brand-primary-lighter:     lighten($brand-primary, $brand-color-unit*2) !default;

$brand-info:                #65efe2 !default;
$brand-info-light:          lighten($brand-info, $brand-color-unit) !default;
$brand-info-lighter:        lighten($brand-info, $brand-color-unit*2) !default;