Text and Font

This font is the standard web font and size you will find throughout the website. It is known as 'Paragraph'.

There are also Heading fonts which can be used when adding headings to sections of landing pages. These are as follows: 

Heading 1 

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

There is also an assortment of colours which can be used as standard on the website. These colours can be applied to editorial blocks but also download blocks and content navigation blocks.

Dark Primary Secondary Success Info Warning Danger Light Gray White

These colours can be applied to editorial blocks as the colour of font or backgrounds, and also download blocks and content navigation blocks.

Download Block

A Download Block can be used to show an image and two buttons.

You can add a link to the image and to the buttons - You can choose to show zero, one or two buttons. 

The settings below are the standard settings we use for 'DB'.

A Download Block can also be used to just show one button, for example when a price list is available for download:

Grid Block & Grid Items

A Grid Block can display 4 Grid Items which flip when you hover over them.

The block can be used to display an image on one side, with more information and a link when it is hovered over.

A grid block will always feature 4 grid items across.

See below how a grid block should be used as standard on the website:

Landing Page Header

When creating a header for a landing page, please use an Image block (IB) in the following sizes for desktop and mobile (Please note: mobile will not appear this size when displayed on a mobile screen). 

Container Blocks

Container Blocks can be used to hold blocks within one section of a page.

For example text and a button on the left, with an image on the right.

A colour can be applied to the background of the container block. These can be any colours with a HEX code.

The container block needs css adding of M-0, P-0.

Both the image and editorial block will need M-0 adding to their css.