Style Guide
Brand
Brand
Colors
Primary Colors
Navy - #214964
Blue - #2676aa
Blue Light - #dee7f1
Secondary Colors
Gold - #ffc637
Neutral Colors
Dark - #222222
Dark Grey - #444444
Medium Grey #666666
Light Grey #cccccc
Lightest Grey- #f1f2f7
Typography
Font Family

Inter

Inter is the standard font to be used for all body and block text.

Normal
/
400
Bold
/
700
Download Google Font
Headings
Font Size: 48px / 3rem
Font Weight: 700
Line Height: 120%
Font Family: Inter
Color: #222222

Heading 1

Font Size: 40px / 2.5rem
Font Weight: 700
Line Height: 130%
Font Family: Inter
Color: #222222

Heading 2

Font Weight: 700
Line Height: 130%
Font Size: 32px / 2rem
Font Family: Inter
Color: #222222

Heading 3

Font Size: 24px / 1.5rem
Font Weight: 700
Line Height: 130%
Font Family: Inter
Color: #222222

Heading 4

Font Size: 20px / 1.25rem
Font Weight: 700
Line Height: 140%
Font Family: Inter
Color: #222222
Heading 5
Font Size: 16px / 1rem
Font Weight: 700
Line Height: 150%
Font Family: Inter
Color: #222222
Heading 6
Font Size: 16px / 1rem
Font Weight: 400
Line Height: 150%
Font Family: Inter
Color: #222222
Body Text - Sample text is being used as a placeholder for real text. Sample text is being used as a placeholder for real text. Sample text is being used as a placeholder for real text.
Rich Text

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Sample text with a link is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text. Sample text is being used as a placeholder for real text. Sample text is being used as a placeholder for real text.

  • Sample text is being used as a placeholder for real text that is normally present.
  • Sample text is being used as a placeholder for real text that is normally present.
  • Sample text is being used as a placeholder for real text that is normally present.
  1. Sample text is being used as a placeholder for real text that is normally present.
  2. Sample text is being used as a placeholder for real text that is normally present.
  3. Sample text is being used as a placeholder for real text that is normally present.
Sample text is being used as a placeholder for real text that is normally present. Sample text helps you understand how real text may look on your website. Sample text is being used as a placeholder for real text that is normally present.
Icons
ARROW Icons
CATEGORY Icons
Social Icons
Form
Form Example
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Images
Inline Images
Caption Goes Here
FAQ
Accordion

Question

faq expand icon

Question

faq expand icon