Custom Typography Elements

Custom Font

Etiam condimentum ultrices est, eu dapibus magna mollis at. Donec sit amet sem ut ex gravida scelerisque at in nulla. Nulla rhoncus tortor id risus tempus egestas. Pellentesque libero diam, venenatis ac magna a, pretium blandit tortor. Vestibulum in vulputate eros.

<span class="eds_customFont">Etiam condimentum ultrices est, eu dapibus magna mollis at. Donec sit amet sem ut ex gravida scelerisque at in nulla. Nulla rhoncus tortor id risus tempus egestas. Pellentesque libero diam, venenatis ac magna a, pretium blandit tortor. Vestibulum in vulputate eros.</span>

Text Color

Primary Color

<span class="eds_primaryColor">Primary Color</span>

Primary Color Darker

<span class="eds_primaryColorDarker">Primary Color Darker</span>

Secondary Color

<span class="eds_secondaryColor">Secondary Color</span>

Secondary Color Darker

<span class="eds_secondaryColorDarker">Secondary Color Darker</span>

Light Text

<span class="eds_lightText">Light Text</span>

White Color

<span class="eds_whiteColor">White Color</span>

Dark Color

<span class="eds_darkColor">Dark Color</span>

Text sizes

Larger Text

<p class="eds_largerText">Larger Text</p>

Large Text

<p class="eds_largeText">Large Text</p>

Medium Large Text

<p class="eds_mediumLargeText">Medium Large Text</p>

Extra Large Text

<p class="eds_extraLargeText">Extra Large Text</p>

Anchor

Custom list styles

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem at massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit

<ul class="eds_listCircle">
	<li>Lorem ipsum dolor sit amet</li>
	<li>Consectetur adipiscing elit</li>
	<li>Integer molestie lorem at massa</li>
	<li>Facilisis in pretium nisl aliquet</li>
	<li>Nulla volutpat aliquam velit</li>
</ul>

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem at massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit

<ul class="eds_listStar">
	<li>Lorem ipsum dolor sit amet</li>
	<li>Consectetur adipiscing elit</li>
	<li>Integer molestie lorem at massa</li>
	<li>Facilisis in pretium nisl aliquet</li>
	<li>Nulla volutpat aliquam velit</li>
</ul>

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem at massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit

<ul class="eds_listCheckSquare">
	<li>Lorem ipsum dolor sit amet</li>
	<li>Consectetur adipiscing elit</li>
	<li>Integer molestie lorem at massa</li>
	<li>Facilisis in pretium nisl aliquet</li>
	<li>Nulla volutpat aliquam velit</li>
</ul>

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem at massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit

<ul class="eds_listChevronCircle">
	<li>Lorem ipsum dolor sit amet</li>
	<li>Consectetur adipiscing elit</li>
	<li>Integer molestie lorem at massa</li>
	<li>Facilisis in pretium nisl aliquet</li>
	<li>Nulla volutpat aliquam velit</li>
</ul>

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem at massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit

<ul class="eds_listCircleO">
	<li>Lorem ipsum dolor sit amet</li>
	<li>Consectetur adipiscing elit</li>
	<li>Integer molestie lorem at massa</li>
	<li>Facilisis in pretium nisl aliquet</li>
	<li>Nulla volutpat aliquam velit</li>
</ul>

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem at massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit

<ul class="eds_listCheck">
	<li>Lorem ipsum dolor sit amet</li>
	<li>Consectetur adipiscing elit</li>
	<li>Integer molestie lorem at massa</li>
	<li>Facilisis in pretium nisl aliquet</li>
	<li>Nulla volutpat aliquam velit</li>
</ul>

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem at massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit

<ul class="eds_listCheckSquareO">
	<li>Lorem ipsum dolor sit amet</li>
	<li>Consectetur adipiscing elit</li>
	<li>Integer molestie lorem at massa</li>
	<li>Facilisis in pretium nisl aliquet</li>
	<li>Nulla volutpat aliquam velit</li>
</ul>

Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Integer molestie lorem at massa
Facilisis in pretium nisl aliquet
Nulla volutpat aliquam velit

<ul class="eds_listPaperclip">
	<li>Lorem ipsum dolor sit amet</li>
	<li>Consectetur adipiscing elit</li>
	<li>Integer molestie lorem at massa</li>
	<li>Facilisis in pretium nisl aliquet</li>
	<li>Nulla volutpat aliquam velit</li>
</ul>

Horizontal rules

<hr>

<hr class="eds_style2">

<hr class="eds_style3">

<hr class="eds_style4">

<hr class="eds_style5">

Main Title

Heading 2

Heading 3

Paragraph In id diam non dolor bibendum ornare a at sapien. Curabitur interdum, purus a tristique consectetur, urna mi facilisis mauris, at hendrerit ex lectus ac tortor.

<div class="eds_mainTitle">
	<h2>Heading 2</h2>
	<h3>Heading 3</h3>
	<p>Paragraph In id diam non dolor bibendum ornare a at sapien. Curabitur interdum, purus a tristique consectetur, urna mi facilisis mauris, at hendrerit ex lectus ac tortor.</p>
</div>

Title Border

H1 Title Border

<h1 class="eds_titleBorder">H1 Title Border</h1>

H2 Title Border

<h2 class="eds_titleBorder">H2 Title Border</h2>

H3 Title Border

<h3 class="eds_titleBorder">H3 Title Border</h3>

H4 Title Border

<h4 class="eds_titleBorder">H4 Title Border</h4>

H5 Title Border

<h5 class="eds_titleBorder">H5 Title Border</h5>

H6 Title Border

<h6 class="eds_titleBorder">H6 Title Border</h6>

Thin Text

<h1 class="eds_thinText">Thin Text</h1>

DDR Menu