Info Boxes Last updated: 01.07.2020

Info Box 1

  • opd-green
  • opd-lgreen
  • opd-blue
  • opd-lblue
  • edu-green
  • edu-lgreen
  • edu-blue
  • edu-lblue
  • cjp-green
  • cjp-lgreen
  • cjp-blue
  • cjp-lblue
  • cjp-orange
  • bsd-pink
  • bsd-lpink
  • bsd-purple
  • bsd-lpurple
  • bsd-red
  • msw-dblue
  • msw-lblue
  • had-green
  • had-orange
  • text
  • gray-1
  • gray-2
  • gray-3
  • gray-4
  • gray-5
  • white
  • black
  • reset

When you are finished, copy the code above and paste into WordPress for your site.

Example:
Bachelor's
51,730
Output HTML:
                    <div class="tl-info-box-short">

    <div class="title">
        <span>Bachelor's</span>
    </div>

    <div class="desc">
        <span class="salary">51,730</span>
    </div>
</div>

                  
&lt;div class=&quot;tl-info-box-short&quot;&gt; &lt;div class=&quot;title&quot;&gt; &lt;span&gt;Bachelor's&lt;/span&gt; &lt;/div&gt; &lt;div class=&quot;desc&quot;&gt; &lt;span class=&quot;salary&quot;&gt;51,730&lt;/span&gt; &lt;/div&gt; &lt;/div&gt;

Info Box 2

  • opd-green
  • opd-lgreen
  • opd-blue
  • opd-lblue
  • edu-green
  • edu-lgreen
  • edu-blue
  • edu-lblue
  • cjp-green
  • cjp-lgreen
  • cjp-blue
  • cjp-lblue
  • cjp-orange
  • bsd-pink
  • bsd-lpink
  • bsd-purple
  • bsd-lpurple
  • bsd-red
  • msw-dblue
  • msw-lblue
  • had-green
  • had-orange
  • text
  • gray-1
  • gray-2
  • gray-3
  • gray-4
  • gray-5
  • white
  • black
  • reset

When you are finished, copy the code above and paste into WordPress for your site.

Example:
Lorem ipsum dolor sit amet, consectetur adipiscing elit

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.

Output HTML:
                    <div class="tl-info-box-long">

    <div class="title">
        <span>Lorem ipsum dolor sit amet, consectetur adipiscing elit</span>
    </div>

    <div class="desc">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
    </div>
</div>

                  
&lt;div class=&quot;tl-info-box-long&quot;&gt; &lt;div class=&quot;title&quot;&gt; &lt;span&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit&lt;/span&gt; &lt;/div&gt; &lt;div class=&quot;desc&quot;&gt; &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.&lt;/p&gt; &lt;/div&gt; &lt;/div&gt;