TYPOGRAPHY

There are several things you need to know while examining the typography of JTB_MD.

Global settings

The basic text design includes the following attributes in JTB_MD:

  • Color: jtbNavy
  • Font Family: 'Roboto', sans-serif;
  • Font Size: 18px
  • Background: #FFFFFF

Headings

All HTML headings, <h1> through <h6>, are available. Note that these headers are not responsive to the width of the screen.

h1. JTB Heading

h2. JTB Heading

h3. JTB Heading

h4. JTB Heading

h5. JTB Heading
h6. JTB Heading
		Copy
		<h1>h1. JTB Heading</h1>
<h2>h2. JTB Heading</h2>
<h3>h3. JTB Heading</h3>
<h4>h4. JTB Heading</h4>
<h5>h5. JTB Heading</h5>
<h6>h6. JTB Heading</h6>
	

Display headings

It is possible to create a customized, displayer, headings <h1> through <h4>. Note that these displaying headers are responsive to the width of the screen.

h1. JTB Heading

h2. JTB Heading

h3. JTB Heading

h4. JTB Heading

		Copy
		<h1 class='jtbDisplayHeader'>h1. JTB Heading</h1>
<h2 class='jtbDisplayHeader'>h2. JTB Heading</h2>
<h3 class='jtbDisplayHeader'>h3. JTB Heading</h3>
<h4 class='jtbDisplayHeader'>h4. JTB Heading</h4>
	

Lists

Unstyled lists

It is possible to make an unbulleted list via using .jtbListUnstyled class.

  • List Item
  • List Item
  • List Item
  • List Item
  • List Item
    • Nested List Item
    • Nested List Item
    • Nested List Item
    • Nested List Item
  • List Item
  • List Item
			Copy
			<ul class='jtbListUnstyled'>
	<li>List Item</li>
	<li>List Item</li>
	<li>List Item</li>
	<li>List Item</li>
	<li>List Item</li>
	<ul>
		<li>Nested List Item</li>
		<li>Nested List Item</li>
		<li>Nested List Item</li>
		<li>Nested List Item</li>
	</ul>
	<li>List Item</li>
	<li>List Item</li>
</ul>
		

Inline lists

It is possible to make an inline list via using .jtbListInline class.

  • List Item
  • List Item
  • List Item
			Copy
			<ul class='jtbListInline'>
	<li>List Item</li>
	<li>List Item</li>
	<li>List Item</li>
</ul>