This page is provided as a guide to assist with managing your website, as well as ensuring brand consistency with offline and other digital assets.

Colours   |   Image sizes   |   Text styles   |   Content templates   |   Buttons   |   Alternate styles

Colours

These are the main colours we have used around your website:

Blue: #0097a9

Light Grey: #f5f5f5

Dark Blue-Grey: #3d4c5b

Dark Grey (almost black): #222221

Image Sizes

Below are our recommended image sizes for the various images you may use around your website.

We suggest saving most images as jpgs, and compress them if possible to reduce the loading time of your website.

Content

Homepage carousel: 1920 x 700

Content pages: Maximum width 820px

Landing page images: 500 x 300

News thumbnail: 500 x 300

Events / Campaigns

Thumbnail: 580 x 370

Hero image: 1920 x 500

Fundraising

Default fundraiser image: 300 x 300

Badges: 200 x 200 (requires both 'active' and 'inactive' versions)

Merchandise

Product thumbnail: 360 x 360

Text styles

Below are the text styles available for use around your website.

Headings: Oswald, #0097a9 or #3d4c5b

Paragraph text: Open Sans, #222221

Heading 1

Example paragraph. Linked text. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Heading 2

Unordered list:

• 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.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Heading 3

Ordered List:

1. Ut enim ad minim veniam
2. Quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
3. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Heading 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Heading 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Content templates

The below are templates that can be placed within the content areas of your website

FAQ

Buttons

Default: Used for general buttons, such as 'Find out more'

Primary: Used for main call-to-action buttons, such as 'Register'

Secondary: Used for secondary actions with less importance, such as 'Show more'