Website Theme & Style Guide
Colour Palette
New Green
1. Accent [Buttons]
#7B9833
Original Green
2. Alt Accent [Hover]
#8FB23C
Limed Spruce
3. Strongest Text
#33474F
Casal
4. Strong Text
#2C5B68
Astral
5. Medium Text
#35809C
New Norburn Blue
6. Subtle Text
#7B9934
Fern Frond
10. Dark Accent
#526623
Yellow Green
11. Background
#D1E4A2
Original Blue
Not Used
#0FAFE9
Timberwolf
7. Subtle Background
#D8D5CC
Pampas
8. Lighter Background
#F0EDE5
White
9. Page Background
#FFFFFF
Typography
Managed in Customize > Colours & Fonts > Typography
Heading Font: Montserrat 600 Semi-Bold
Base Font: Default
Font size: 16px
Font line height: 1.5em
Font weight: 400 (normal)
Type Samples: H1 Heading goes here. H1 Heading goes here. H1 Heading goes here.
H2 Heading goes here. H2 Heading goes here. H2 Heading goes here.
H3 Heading goes here. H3 Heading goes here. H3 Heading goes here.
H4 Heading goes here. H4 Heading goes here. H4 Heading goes here. H4 Heading goes here.
Here is a paragraph of text. This is a link. Here is a paragraph of text. Here is a paragraph of text. This is a link. Here is a paragraph of text. Here is a paragraph of text. Here is a paragraph of text.
This is a blockquote. This is a blockquote. This is a blockquote. This is a blockquote. This is a blockquote. This is a blockquote. This is a blockquote.
- Bulleted List Item
- Bulleted List Item
- Sub Item
- Bulleted List Item
- Bulleted List Item
- Sub Item
Desktop Layout Specs
- Default Layout: 1140px Design Grid (header/footer, generic content, blog pages, 3-column grids)
- 3 x 360px design columns
- 30px gutters
- Wide Layout: CSS 1440 Grid (wider home page content, 4-column grids for product listings etc)
- 4 x 330px columns
- 30px gutters
Mobile Layout Specs
- Tablet (iPad): 2 columns Canvas width: 768px
- Handheld (iPhone): 1 column Canvas width: 375px
- 360px design columns from desktop layout may be pasted in and stacked