You'll see that these typography elements don't have classes. That's because on this page, we want to edit the styles after selecting "All H1 Headings" for example, so that it will effect all the elements on the site. To do this, select the H1 below, click where it says "Select a Class or Tag" and select "All H1 Headings" at the bottom of the list.

Heading 1

H1

Heading 2

H2

Heading 3

H3

Heading 4

H4
Heading 5
H5
Heading 6
H6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.

Paragraph
Lorem ipsum dolor sit amet
Block Quote

Block Quote

With icon

Block Quote with icon
Lorem ipsum
Text Link
TOP LINK

Type

These are a few example components.

Download
Download
Button WITHOUT ICON
Email Lizzie
BUTTON WITH ICON
Join us
Open the handbook
Button right arrow
Partners only
open to all
PARTNERS LABEL
CASE STUDY
CASE STUDY LABEL
contact avatar

James explains the OISC process

"Hi folks! We are going to talk about immigration advice and registering with the OISC."

Watch the video

COMPONENTS

guide wrapper
CARD ITEM

BECOME A PARTNER

To access some of our programmes, you need to become a FIAP partner.

Join us
large action

Colour

These colours have been created using Global Swatches. If you edit the Global Swatch coloUr, it will change every element that uses that coloUr swatch.

Text colours

This is dark coloured text
font colour - dark
This is light coloured text
font colOUr - grey

Main colours

Brand colour - green 100
Brand colour - BLUE 100
Brand colour - ORANGE 100
Brand colour - black
Brand colour - light BLUE 2
Brand colour - light grey
Brand colour - light blue
Brand colour - white smoke

LOGO

These are sample logo SVGs that can be downloaded straight from the site, or you could set up a download link that links with the file that's hosted with your cloud storage application of choice.

MAIN LOGO WHITE

These are the three different hero sections which can be used.

This is a hero heading

This is the default text value for a symbol field

Photo of two people looking and pointing at a laptop.
HERO 50:50 w/image & text

HELLO

THIS IS SOME TEXT

HERO 50:50 w/illustration & description

THIS IS A HEADING

This is the default text value for a symbol field

HERO w/breadcrumbs & description

heroes

THIS IS A HEADING

This is the default text value

Last updated:
Date
HERO w/breadcrumbs & description & last updated