Callout

<div class="section-polygonal-primary">
  <div class="opacity-layer section section-xs section-both">
    <div class="row">
      <div class="col-sm-12 text-center">
        <h3 class="title-lg text-theme hr">Callout Example Primary Color</h3>
        <a href="#" class="btn btn-ghost-white btn-lg text-theme">Get Started</a>
      </div>
    </div>
  </div>
</div>

<div class="section-polygonal-light">
  <div class="opacity-layer section section-xs section-both">
    <div class="row">
      <div class="col-sm-12 text-center">
        <h3 class="title-lg text-theme hr">Callout Example Light Color</h3>
        <a href="#" class="btn btn-ghost-black btn-lg text-theme">Get Started</a>
      </div>
    </div>
  </div>
</div>

<div class="section-polygonal-black">
  <div class="opacity-layer section section-xs section-both">
    <div class="row">
      <div class="col-sm-12 text-center">
        <h3 class="title-lg text-theme hr">Callout Example Black Color</h3>
        <a href="#" class="btn btn-ghost-white btn-lg text-theme">Get Started</a>
      </div>
    </div>
  </div>
</div>

<div class="section-polygonal-primary">
  <div class="opacity-layer section section-xs section-both section-call-to">
    <div class="row text-center-xs padding-vertical-32">
      <div class="col-sm-8">
        <h3 class="title-md">Z-Theme is a Multipurpose</h3>
      </div>
      <div class="col-sm-4 text-right text-center-xs">
        <a class="btn btn-ghost-white btn-lg"><i class="fa fa-cloud-download"></i>Download Now</a>
      </div>
    </div>
  </div>
</div>

<div class="section-polygonal-light">
  <div class="opacity-layer section section-xs section-both section-call-to">
    <div class="row text-center-xs padding-vertical-32">
      <div class="col-sm-8">
        <h3 class="title-md">Z-Theme is a Multipurpose</h3>
      </div>
      <div class="col-sm-4 text-right text-center-xs">
        <a class="btn btn-ghost-black btn-lg"><i class="fa fa-cloud-download"></i>Download Now</a>
      </div>
    </div>
  </div>
</div>

<div class="section-polygonal-black">
  <div class="opacity-layer section section-xs section-both section-call-to">
    <div class="row text-center-xs padding-vertical-32">
      <div class="col-sm-8">
        <h3 class="title-md">Z-Theme is a Multipurpose</h3>
      </div>
      <div class="col-sm-4 text-right text-center-xs">
        <a class="btn btn-ghost-white btn-lg"><i class="fa fa-cloud-download"></i>Download Now</a>
      </div>
    </div>
  </div>
</div>

<div class="section section-xs section-both section-primary section-call-to">
  <div class="row text-center-xs padding-vertical-32">
    <div class="col-sm-8">
      <h3 class="title-md">Z-Theme is a Multipurpose</h3>
    </div>
    <div class="col-sm-4 text-right text-center-xs">
      <a class="btn btn-ghost-white btn-lg"><i class="fa fa-cloud-download"></i>Download Now</a>
    </div>
  </div>
</div>

<div class="section section-xs section-both section-light section-call-to">
  <div class="row text-center-xs padding-vertical-32">
    <div class="col-sm-8">
      <h3 class="title-md">Z-Theme is a Multipurpose</h3>
    </div>
    <div class="col-sm-4 text-right text-center-xs">
      <a class="btn btn-ghost-black btn-lg"><i class="fa fa-cloud-download"></i>Download Now</a>
    </div>
  </div>
</div>

<div class="section section-xs section-both section-black section-call-to">
  <div class="row text-center-xs padding-vertical-32">
    <div class="col-sm-8">
      <h3 class="title-md">Z-Theme is a Multipurpose</h3>
    </div>
    <div class="col-sm-4 text-right text-center-xs">
      <a class="btn btn-ghost-white btn-lg"><i class="fa fa-cloud-download"></i>Download Now</a>
    </div>
  </div>
</div>

<div class="section section-xs section-both section-arrow-bottom section-primary">
  <div class="row">
    <div class="col-sm-12 text-center">
      <h3 class="title-lg text-theme hr">Callout Example Primary Color</h3>
      <a href="#" class="btn btn-ghost-white btn-lg text-theme">Get Started</a>
    </div>
  </div>
</div>

<div class="section section-xs section-both section-arrow-bottom section-light">
  <div class="row">
    <div class="col-sm-12 text-center">
      <h3 class="title-lg text-theme hr">Callout Example Light Color</h3>
      <a href="#" class="btn btn-ghost-black btn-lg text-theme">Get Started</a>
    </div>
  </div>
</div>

<div class="section section-xs section-both section-arrow-bottom section-black">
  <div class="row">
    <div class="col-sm-12 text-center">
      <h3 class="title-lg text-theme hr">Callout Example Black Color</h3>
      <a href="#" class="btn btn-ghost-white btn-lg text-theme">Get Started</a>
    </div>
  </div>
</div>

<div class="section section-xs section-both section-arrow-top section-primary">
  <div class="row">
    <div class="col-sm-12 text-center">
      <h3 class="title-lg text-theme hr">Callout Example Primary Color</h3>
      <a href="#" class="btn btn-ghost-white btn-lg text-theme">Get Started</a>
    </div>
  </div>
</div>

<div class="section section-xs section-both section-arrow-top section-light">
  <div class="row">
    <div class="col-sm-12 text-center">
      <h3 class="title-lg text-theme hr">Callout Example Light Color</h3>
      <a href="#" class="btn btn-ghost-black btn-lg text-theme">Get Started</a>
    </div>
  </div>
</div>

<div class="section section-xs section-both section-arrow-top section-black">
  <div class="row">
    <div class="col-sm-12 text-center">
      <h3 class="title-lg text-theme hr">Callout Example Black Color</h3>
      <a href="#" class="btn btn-ghost-white btn-lg text-theme">Get Started</a>
    </div>
  </div>
</div>