Page Headings

Page headings can be added by .heading class.

Page Heading 1

Page Heading 2

Page Heading 3

Page Heading 4

Page Heading 5

Page Heading 6

<!-- Page Headings -->

<h1 class="heading">Page Heading 1</h1>
<h2 class="heading">Page Heading 2</h2>
<h3 class="heading">Page Heading 3</h3>
<h4 class="heading">Page Heading 4</h4>
<h5 class="heading">Page Heading 5</h5>
<h6 class="heading">Page Heading 6</h6>
								  

Paragraph Leading Word Decoration

There is two classes to decorate the starting wordof any paragraph
.big-letter class change the size of first letter of paragraph and
.big-letter-bg class give it a specific background color and color according to color theme
You can acheive many styles by adding several other classes with them like .circle, .rounded etc...

Paragraph with .big-letter .txt-sm classes

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate

Paragraph with .big-letter .big-letter-bg .txt-sm classes

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate

Paragraph with .big-letter .big-letter-bg .rounded .txt-sm classes

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate

Paragraph with .big-letter .big-letter-bg .rounded-2x .txt-sm classes

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate

Paragraph with .big-letter .big-letter-bg .rounded-3x .txt-sm classes

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate

Paragraph with .big-letter .big-letter-bg .rounded-4x .txt-sm classes

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate

Paragraph with .big-letter .big-letter-bg .circular .txt-sm classes

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate

<!-- Paragraph Leading Word Decoration -->

<p><span class="big-letter txt-sm">L</span>orem ipsum dolor sit amet...</p>
								  
<p><span class="big-letter big-letter-bg txt-sm">L</span>orem ipsum dolor sit amet...</p>
								  
<p><span class="big-letter big-letter-bg rounded txt-sm">L</span>orem ipsum dolor sit amet...</p>
								   
<p><span class="big-letter big-letter-bg rounded-2x txt-sm">L</span>orem ipsum dolor sit amet...</p>

<p><span class="big-letter big-letter-bg rounded-3x txt-sm">L</span>orem ipsum dolor sit amet...</p>

<p><span class="big-letter big-letter-bg rounded-4x txt-sm">L</span>orem ipsum dolor sit amet...</p>

<p><span class="big-letter big-letter-bg circular txt-sm">L</span>orem ipsum dolor sit amet...</p>
								  
								  

Text Size

There sre four text size classes .txt-lg, .txt-md, .txt-sm and .txt-xs which can change the size of any text element

Heading with .txt-lg

Heading with .txt-md

Heading with .txt-sm

Heading with .txt-xs

<!-- Text Size classes -->

<h3 class="heading txt-lg">Heading with .txt-lg</h3>
<h3 class="heading txt-md">Heading with .txt-md</h3>
<h3 class="heading txt-sm">Heading with .txt-sm</h3>
<h3 class="heading txt-xs">Heading with .txt-xs</h3>