x-large
				
			

Heading H1 (optional/secondary)

				
					large
				
			

Page Heading H1 = large (default)

				
					regular
				
			

Row Heading h2 = regular

				
					small
				
			

Row Sub-heading h3 = small

				
					x-small
				
			

Highlighted text h4 = x-small

				
					small
				
			
Highlighted text h5 or h6 = xx-small

button styles - class names:

				
					primary (default)
				
			
				
					primary two
				
			
				
					secondary
				
			
				
					secondary two
				
			
				
					theme-dark
				
			

Heading H1 = x-large (optional/secondary)

Page Heading H1 = large (default)

Row Heading h2 = regular

Row Sub-heading h3 = small

Highlighted text h4 = x-small

Highlighted text h5 or h6 = xx-small

button styles - class names:

				
					primary (default)
				
			
				
					primary two
				
			
				
					secondary
				
			
				
					secondary two
				
			
				
					theme-light
				
			

Heading H1 = x-large (optional/secondary)

Page Heading H1 = large (default)

Row Heading h2 = regular

Row Sub-heading h3 = small

Highlighted text h4 = x-small

Highlighted text h5 or h6 = xx-small
				
					x-large
				
			

Body, x-large, Roboto, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

				
					large
				
			

Body, large, Roboto, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

				
					regular
				
			

Body, regular, Roboto, regular (font-size 18/28) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

				
					small
				
			

Body, small, Roboto regular (font-size 15/24) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

				
					x-small
				
			

Body, x-small, Roboto, regular (font-size 13/22) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

Body, x-large, Roboto, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Body, large, Roboto, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Body, regular, Roboto, bold (font-size 18/28) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

Body, small, Roboto bold (font-size 15/24) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

Body, x-small, Roboto, bold (font-size 13/22) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

Body, x-large, Roboto, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Body, large, Roboto, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Body, regular, Roboto, regular (font-size 18/28) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

Body, small, Roboto regular (font-size 15/24) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

Body, x-small, Roboto, regular (font-size 13/22) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

Body, x-large, Roboto, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Body, large, Roboto, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Body, regular, Roboto, bold (font-size 18/28) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

Body, small, Roboto bold (font-size 15/24) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

Body, x-small, Roboto, bold (font-size 13/22) Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla.

==========================
Headings (h1,h2,h3,h4,h5):Class names used to set custom font size to any heading (h1,h2,h3,h4,h5) regardless if their default sizes:
50px = x-large
40px = large
30px = regular
26px = small
20px = x-small
18px = xx-small (same size as p but bold)

Heading default font sizes:
50px = h1 = x-large (optional/secondary h1)
40px = h1 = large (default)
30px = h2 = regular
26px = h3 = small
20px = h4 = x-small
18px = h5 = xx-small

SEO best practice – where to use headings:
h1 = Page Title
h2 = Row Title
h3 = Row Sub-section title
h4 = Articles/blogs/legal pages with more text that require extra highlighting
h5 = Articles/blogs/legal pages with more text that require extra highlighting

==========================
Body (p,a,span,li):

Class names used to set custom font size to any body element (p,a,span,li):
30px = x-large
20px = large
18px = regular
15px = small
13px = x-small

Where to use different body text sizes (p,a,span,li):
x-large = (Page Sub-title under h1)
large = (Row Sub-title under h2)
regular = (main body text)
small = (secondary body text)
x-small = (legal text, footer links)

==========================
Main Menu (li a):
16px = menu links