Skip to main content

# Style GuideStyle Guide

## On this page you will find an inventory of UI elements to be used on pages.

This is content that is aligned with the left edge of the page title found in the banner above.

This is content that is aligned with the left edge of the page container.

# Heading Level 1 (reserved for title found in the banner)

## Heading Level 2 (with blue modifier)

### Heading Level 3

#### Heading Level 4

##### Heading Level 5

Paragraph text: Loremsup ipsumsub 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 ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Paragraph text: 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 ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

1
11
2
10
3
9
4
8
5
7
6
6
12

- Unordered List Item
- Unordered List Item
  - Nested Unordered List Item
  - Nested Unordered List Item
  - Nested Unordered List Item
- Unordered List Item
- Unordered List Item
- Unordered List Item

1. Ordered List Item
2. Ordered List Item
   1. Nested Ordered List Item
   2. Nested Ordered List Item
   3. Nested Ordered List Item
3. Ordered List Item
4. Ordered List Item
5. Ordered List Item

Table Heading | Table Heading | Table Heading | Table Heading | Table Heading
--- | --- | --- | --- | ---
Table Cell | Table Cell | Table Cell | Table Cell | Table Cell
Table Cell | Table Cell | Table Cell | Table Cell | Table Cell
Table Cell | Table Cell | Table Cell | Table Cell | Table Cell
Table Cell | Table Cell | Table Cell | Table Cell | Table Cell
Table Cell | Table Cell | Table Cell | Table Cell | Table Cell

> This is a blockquote: 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 ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Text Field*
Email Field*
Select Field
Radio group Radio button 1 Radio button 2 Radio button 3
Checkboxes Checkbox 1 Checkbox 2 Checkbox 3
Textarea Field*

## This is a popup

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 ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Tooltip Top

Tooltip Right

Tooltip Bottom

Tooltip Left

## Prefooter content

Button Link