[spb_row element_name="Design System Intro" wrap_type="standard-width" row_bg_type="color" color_row_height="content-height" bg_type="cover" parallax_image_height="content-height" parallax_image_movement="fixed" parallax_image_speed="standard" bg_video_loop="yes" parallax_video_height="window-height" row_id="Introduction" row_name="Introduction" row_top_style="none" row_bottom_style="none" parallax_video_overlay="none" row_overlay_opacity="0" remove_element_spacing="no" row_col_spacing="0" row_col_pos="default" row_col_equal_heights="no" row_expanding="no" row_animation="none" row_animation_delay="0" minimize_row="no" simplified_controls="yes" custom_css_percentage="no" custom_css="margin-top: 0px;margin-bottom: 0px;" border_styling_global="default" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s4" width="1/1" el_position="first last"]

Introduction

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s8 light-grey" width="3/4" el_position="first last"]

Vestibulum non tempus dolor. Vestibulum semper non leo sed fermentum. Vestibulum at condimentum sem, nec tincidunt risus. Vivamus vel feugiat est. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut vel consectetur diam. Cras eget massa eget nulla molestie molestie. Nam tempus interdum mi id luctus.

[/spb_text_block] [spb_divider type="thin" text="Go to top" top_margin="40px" bottom_margin="40px" fullwidth="no" width="1/1" el_position="first last"] [/spb_row] [spb_row element_name="Our Brand" wrap_type="standard-width" row_bg_type="color" color_row_height="content-height" bg_type="cover" parallax_image_height="content-height" parallax_image_movement="fixed" parallax_image_speed="standard" bg_video_loop="yes" parallax_video_height="window-height" row_id="Our Brand" row_name="Our Brand" row_top_style="none" row_bottom_style="none" parallax_video_overlay="none" row_overlay_opacity="0" remove_element_spacing="no" row_col_spacing="0" row_col_pos="default" row_col_equal_heights="no" row_expanding="no" row_animation="none" row_animation_delay="0" minimize_row="no" simplified_controls="yes" custom_css_percentage="no" custom_css="margin-top: 0px;margin-bottom: 0px;" border_styling_global="default" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s4" width="1/1" el_position="first last"]

Our Brand

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s8 light-grey" width="3/4" el_position="first last"]

Sapient i7 is made of real people for real people. We're fast- moving company with a curious and nimble mind that's always learning. We enjoy what we do, thrive in collaboration and have fun at work. We can make bold decisions and harness our entrepreneurial spirit to deliver the best results possible with confidence

[/spb_text_block] [spb_gallery element_name="Our Brand" gallery_id="199" display_type="slider" columns="5" fullwidth="no" gutters="yes" image_size="full" slider_transition="slide" show_thumbs="no" autoplay="no" show_captions="no" enable_lightbox="no" width="1/1" el_position="first last"] [spb_divider type="thin" text="Go to top" top_margin="40px" bottom_margin="40px" fullwidth="no" width="1/1" el_position="first last"] [/spb_row] [spb_row element_name="Logo" wrap_type="standard-width" row_bg_type="color" color_row_height="content-height" bg_type="cover" parallax_image_height="content-height" parallax_image_movement="fixed" parallax_image_speed="standard" bg_video_loop="yes" parallax_video_height="window-height" row_id="Logo" row_name="Logo" row_top_style="none" row_bottom_style="none" parallax_video_overlay="none" row_overlay_opacity="0" remove_element_spacing="no" row_col_spacing="0" row_col_pos="default" row_col_equal_heights="no" row_expanding="no" row_animation="none" row_animation_delay="0" minimize_row="yes" simplified_controls="yes" custom_css_percentage="no" custom_css="margin-top: 0px;margin-bottom: 0px;" border_styling_global="default" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s4" width="1/1" el_position="first last"]

Logo

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s7 light-grey" width="2/3" el_position="first last"]

Sapient i7 is made of real people for real people. We're fast- moving company with a curious and nimble mind that's always learning. We enjoy what we do, thrive in collaboration and have fun at work. We can make bold decisions and harness our entrepreneurial spirit to deliver the best results possible with confidence

[/spb_text_block] [spb_gallery element_name="Our Brand" gallery_id="199" display_type="slider" columns="5" fullwidth="no" gutters="yes" image_size="full" slider_transition="slide" show_thumbs="no" autoplay="no" show_captions="no" enable_lightbox="no" width="1/1" el_position="first last"] [/spb_row] [spb_row element_name="Fonts Title" wrap_type="standard-width" row_bg_type="color" color_row_height="content-height" bg_type="cover" parallax_image_height="content-height" parallax_image_movement="fixed" parallax_image_speed="standard" bg_video_loop="yes" parallax_video_height="window-height" row_id="Fonts" row_name="Fonts" row_top_style="none" row_bottom_style="none" parallax_video_overlay="none" row_overlay_opacity="0" remove_element_spacing="no" row_col_spacing="0" row_col_pos="default" row_col_equal_heights="no" row_expanding="no" row_animation="none" row_animation_delay="0" minimize_row="yes" simplified_controls="yes" custom_css_percentage="no" custom_css="margin-top: 0px;margin-bottom: 0px;" border_styling_global="default" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="sprefix" width="1/1" el_position="first last"]

Fonts

[/spb_text_block] [spb_divider type="thin" text="Go to top" top_margin="0px" bottom_margin="30px" fullwidth="no" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s6" width="1/1" el_position="first last"]

Let's talk about fonts

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="3/4" el_position="first last"]

The Sapient i7 brand consists of a primary and secondary font alongside a tertiary supporting font.

[/spb_text_block] [spb_boxed_content type="whitestroke" custom_bg_colour="#f9f9f9" custom_text_colour="#4a4a4a" box_link="#cerebri-sans---primary-font" box_link_target="_self" padding_vertical="2" padding_horizontal="5" width="1/1" el_position="first last"]

Our primary font is Cerebri Sans, this is to be used for all headlines and prefixes, anything type size 18px and above.

[/spb_boxed_content] [spb_blank_spacer height="20px" width="1/1" el_position="first last"] [spb_boxed_content type="whitestroke" custom_bg_colour="#f9f9f9" custom_text_colour="#4a4a4a" box_link="#fira-sans---paragraph-and-body-font" box_link_target="_self" padding_vertical="2" padding_horizontal="5" width="1/1" el_position="first last"]

Our secondary font is Fira Sans this font is to be used for all paragraph and body copy (to be used for 16px and below).

[/spb_boxed_content] [spb_blank_spacer height="20px" width="1/1" el_position="first last"] [spb_boxed_content type="whitestroke" custom_bg_colour="#f9f9f9" custom_text_colour="#4a4a4a" box_link="#merriweather---supporting-font" box_link_target="_self" padding_vertical="2" padding_horizontal="5" width="1/1" el_position="first last"]

Our tertiary font is Merriweather this is to be used for editorial sub lines and quotes only, in certain instances Merriweather may also be used in the application of numbers.

[/spb_boxed_content] [spb_blank_spacer height="20px" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="no" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;padding-bottom: 10px;" border_size="0" border_styling_global="default" width="3/4" el_position="first last"]

Below you will find information around each font application in more detail, alongside links to download installable font files. Before starting any work on documents etc ensure you have all files correctly installed.

[/spb_text_block] [spb_blank_spacer height="0px" width="1/1" el_position="first last"] [spb_button button_text="Download All" button_size="standard" button_colour="accent" button_type="standard" rounded="no" button_dropshadow="no" button_link="https://drive.google.com/open?id=1IZglY-2VQUkAmftCoFB_bNw-jkpLaQ0m" button_target="_blank" align="left" animation="none" animation_delay="0" el_class="secondary_button" width="1/4" el_position="first last"] [/spb_row] [spb_accordion active_section="0,1,2" width="1/1" el_position="first last"] [spb_accordion_tab title="Cerebri Sans • Primary Font" accordion_id="cerebri-sans---primary-font" icon=""] [spb_image image="154" image_size="full" frame="noframe" caption_pos="hover" remove_rounded="yes" fullwidth="no" overflow_mode="none" el_class="accordion-img" link_target="_self" lightbox="no" intro_animation="none" animation_delay="200" width="1/2" el_position="first"][/spb_image] [spb_text_block animation="none" animation_delay="0" simplified_controls="no" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;padding-top: 30px;" border_size="0" border_styling_global="default" width="1/2" el_position="last"]

Cerebri Sans is a design inspired by early geometric and grotesque typefaces. Subtle humanist details provide an undercurrent of warmth that simmers just beneath the bones of its contemporary simplicity.

Application for Sapient i7:
Cerebri is to be used for all headlines and prefixes, anything type size 18px and above.

[sf_button colour="accent" type="bordered" size="standard" link="https://drive.google.com/open?id=1wk9fvYhZLK6BWx6Ie9gs3IJE440WowHK" target="_blank" icon="" dropshadow="no" rounded="no" extraclass=""]Download Cerebri[/sf_button]

[/spb_text_block] [/spb_accordion_tab] [spb_accordion_tab title="Merriweather • Supporting Font" accordion_id="merriweather---supporting-font" icon=""] [spb_image image="162" image_size="full" frame="noframe" caption_pos="hover" remove_rounded="yes" fullwidth="no" overflow_mode="none" el_class="accordion-img" link_target="_self" lightbox="no" intro_animation="none" animation_delay="200" width="1/2" el_position="first"][/spb_image] [spb_text_block animation="none" animation_delay="0" simplified_controls="no" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;padding-top: 30px;" border_size="0" border_styling_global="default" width="1/2" el_position="last"]

Merriweather was designed to be a text face that is pleasant to read on screens. It features a very large x height, slightly condensed letterforms, a mild diagonal stress, sturdy serifs and open forms.

Application for Sapient i7:
Fira Sans is to be used for all paragraph and body copy (to be used for 16px and below).

[sf_button colour="accent" type="bordered" size="standard" link="https://drive.google.com/open?id=1gukLw_xp4M9AONSMCYGxHbMG8t9UF6SG" target="_blank" icon="" dropshadow="no" rounded="no" extraclass=""]Download Merriweather[/sf_button]

[/spb_text_block] [/spb_accordion_tab] [spb_accordion_tab title="Fira Sans • Paragraph and Body Font" accordion_id="fira-sans---paragraph-and-body-font" icon=""] [spb_image image="166" image_size="full" frame="noframe" caption_pos="hover" remove_rounded="yes" fullwidth="no" overflow_mode="none" el_class="accordion-img" link_target="_self" lightbox="no" intro_animation="none" animation_delay="200" width="1/2" el_position="first"][/spb_image] [spb_text_block animation="none" animation_delay="0" simplified_controls="no" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;padding-top: 30px;" border_size="0" border_styling_global="default" width="1/2" el_position="last"]

Designed to integrate with the character of the Mozilla FirefoxOS, the Fira typefaces also aim to cover the legibility needs for a large range of handsets varying in screen quality and rendering.

Application for Sapient i7:
Merriweather is to be used for editorial sub lines and quotes only, in certain instances Merriweather may also be used in the application of numbers.

[sf_button colour="accent" type="bordered" size="standard" link="https://drive.google.com/open?id=116A0yU5VuY79u9pIzL74cdfmQFu1eGdY" target="_self" icon="" dropshadow="no" rounded="no" extraclass=""]Download Fira Sans[/sf_button]

[/spb_text_block] [/spb_accordion_tab] [/spb_accordion] [spb_row element_name="Font Styles" wrap_type="standard-width" row_bg_type="color" color_row_height="content-height" bg_type="cover" parallax_image_height="content-height" parallax_image_movement="fixed" parallax_image_speed="standard" bg_video_loop="yes" parallax_video_height="window-height" row_id="Typography" row_name="Typography" row_top_style="none" row_bottom_style="none" parallax_video_overlay="none" row_overlay_opacity="0" remove_element_spacing="no" row_col_spacing="0" row_col_pos="default" row_col_equal_heights="no" row_expanding="no" row_animation="none" row_animation_delay="0" minimize_row="yes" simplified_controls="yes" custom_css_percentage="no" custom_css="margin-top: 0px;margin-bottom: 0px;" border_styling_global="default" width="1/1" el_position="first last"] [spb_column col_sm="12" padding_horizontal="0" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

H1 - Heading

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s1" width="1/1" el_position="first last"]

A B C

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: CerebriSans-Medium;
font-size: 100px;
letter-spacing: 0;
line-height: 100px;

[/spb_codesnippet] [spb_divider type="thin" text="Go to top" top_margin="0px" bottom_margin="30px" fullwidth="no" width="1/1" el_position="first last"] [/spb_column] [spb_column col_sm="12" padding_horizontal="0" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

H2 - Heading

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s2" width="1/1" el_position="first last"]

A B C

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: CerebriSans-Medium;
font-size: 60px;
letter-spacing: 0;
line-height: 70px;

[/spb_codesnippet] [spb_divider type="thin" text="Go to top" top_margin="0px" bottom_margin="30px" fullwidth="no" width="1/1" el_position="first last"] [/spb_column] [spb_column col_sm="12" padding_horizontal="0" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

H3 - Heading

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s3" width="1/1" el_position="first last"]

A B C

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: CerebriSans-Medium;
font-size: 42px;
letter-spacing: 0;
line-height: 52px;

[/spb_codesnippet] [spb_divider type="thin" text="Go to top" top_margin="0px" bottom_margin="30px" fullwidth="no" width="1/1" el_position="first last"] [/spb_column] [spb_column col_sm="12" padding_horizontal="0" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

H4 - Heading

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s4" width="1/1" el_position="first last"]

A B C

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: CerebriSans-Medium;
font-size: 36px;
letter-spacing: 0;
line-height: 46px;

[/spb_codesnippet] [spb_divider type="thin" text="Go to top" top_margin="0px" bottom_margin="30px" fullwidth="no" width="1/1" el_position="first last"] [/spb_column] [spb_column col_sm="12" padding_horizontal="0" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

H5 - Heading

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s5" width="1/1" el_position="first last"]

A B C

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: CerebriSans-Medium;
font-size: 28px;
letter-spacing: 0;
line-height: 38px;

[/spb_codesnippet] [spb_divider type="thin" text="Go to top" top_margin="0px" bottom_margin="30px" fullwidth="no" width="1/1" el_position="first last"] [/spb_column] [spb_column col_sm="12" padding_horizontal="0" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

H6 - Heading

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s6" width="1/1" el_position="first last"]

A B C

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: CerebriSans-Medium;
font-size: 22px;
letter-spacing: 0;
line-height: 32px;

[/spb_codesnippet] [spb_divider type="thin" text="Go to top" top_margin="0px" bottom_margin="30px" fullwidth="no" width="1/1" el_position="first last"] [/spb_column] [spb_column col_sm="12" padding_horizontal="0" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

Intro Editorial Light

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="m2-light" width="2/3" el_position="first last"]

Duis cursus, nunc ac pretium dictum, leo justo fermentum sem, nec tristique massa lorem malesuada lectus. Donec eget enim eleifend, rhoncus sem eget, viverra dui. Duis vestibulum pulvinar libero.

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: Merriweather;
font-size: 20px;
line-height: 40px;
font-weight: 300;

[/spb_codesnippet] [spb_divider type="thin" text="Go to top" top_margin="0px" bottom_margin="30px" fullwidth="no" width="1/1" el_position="first last"] [/spb_column] [spb_column col_sm="12" padding_horizontal="0" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

Intro Editorial Regular

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="m1-regular" width="2/3" el_position="first last"]

Duis cursus, nunc ac pretium dictum, leo justo fermentum sem, nec tristique massa lorem malesuada lectus. Donec eget enim eleifend, rhoncus sem eget, viverra dui. Duis vestibulum pulvinar libero.

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: Merriweather;
font-size: 20px;
line-height: 40px;
font-weight: 400;

[/spb_codesnippet] [spb_divider type="thin" text="Go to top" top_margin="0px" bottom_margin="30px" fullwidth="no" width="1/1" el_position="first last"] [/spb_column] [/spb_row] [spb_row element_name="Buttons + Links" wrap_type="standard-width" row_bg_type="color" color_row_height="content-height" bg_type="cover" parallax_image_height="content-height" parallax_image_movement="fixed" parallax_image_speed="standard" bg_video_loop="yes" parallax_video_height="window-height" row_id="Button Links" row_name="Buttons + Links" row_top_style="none" row_bottom_style="none" parallax_video_overlay="none" row_overlay_opacity="0" remove_element_spacing="no" row_col_spacing="0" row_col_pos="default" row_col_equal_heights="no" row_expanding="no" row_animation="none" row_animation_delay="0" minimize_row="yes" simplified_controls="yes" custom_css_percentage="no" custom_css="margin-top: 0px;margin-bottom: 0px;" border_styling_global="default" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

Buttons

[/spb_text_block] [spb_button button_text="Primary Button" button_size="standard" button_colour="accent" button_type="standard" rounded="no" button_dropshadow="no" button_target="_self" align="left" animation="none" animation_delay="0" el_class="primary_button" width="1/4" el_position="first last"] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: Merriweather;
font-size: 20px;
line-height: 40px;
font-weight: 400;

[/spb_codesnippet] [spb_button button_text="Secondary Button" button_size="standard" button_colour="accent" button_type="bordered" rounded="no" button_dropshadow="no" button_target="_self" align="left" animation="none" animation_delay="0" el_class="primary_button" width="1/4" el_position="first last"] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: Merriweather;
font-size: 20px;
line-height: 40px;
font-weight: 400;

[/spb_codesnippet] [spb_button button_text="Secondary Button" button_size="standard" button_colour="accent" button_type="bordered" rounded="no" button_dropshadow="no" button_target="_self" align="left" animation="none" animation_delay="0" el_class="secondary_button_dark" width="1/4" el_position="first last"] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: Merriweather;
font-size: 20px;
line-height: 40px;
font-weight: 400;

[/spb_codesnippet] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

Link Style Dark

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: Merriweather;
font-size: 20px;
line-height: 40px;
font-weight: 400;

[/spb_codesnippet] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

Link Style Dark Link Style Dark

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

font-family: Merriweather;
font-size: 20px;
line-height: 40px;
font-weight: 400;

[/spb_codesnippet] [spb_divider type="thin" text="Go to top" top_margin="40px" bottom_margin="40px" fullwidth="no" width="1/1" el_position="first last"] [/spb_row] [spb_row element_name="Colours" wrap_type="standard-width" row_bg_type="color" color_row_height="content-height" bg_type="cover" parallax_image_height="content-height" parallax_image_movement="fixed" parallax_image_speed="standard" bg_video_loop="yes" parallax_video_height="window-height" row_id="Colours" row_name="Colours" row_top_style="none" row_bottom_style="none" parallax_video_overlay="none" row_overlay_opacity="0" remove_element_spacing="no" row_col_spacing="0" row_col_pos="default" row_col_equal_heights="no" row_expanding="no" row_animation="none" row_animation_delay="0" minimize_row="yes" simplified_controls="yes" custom_css_percentage="no" custom_css="margin-top: 0px;margin-bottom: 0px;" border_styling_global="default" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s4" width="1/1" el_position="first last"]

Colours

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

Primary Palette

[/spb_text_block] [spb_icon_box element_name="i7 Blue" title="i7 Blue" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#ffffff" bg_color="#6633ff" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4" el_position="first"]

RGA
R 102 - 
G 51 - B 255

Hex
6632FF

[/spb_icon_box] [spb_icon_box element_name="Sunshine Yellow" title="Sunshine Yellow" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#ffffff" bg_color="#ead201" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4"]

RGA
R 234 - 
G 204 - B 0
Hex
EAD201

[/spb_icon_box] [spb_icon_box element_name="Paper White" title="Paper White" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#4a4a4a" bg_color="#ffffff" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4" el_position="last"]

RGA
R 255 - 
G 255 - B2550
Hex
FFFFFF

[/spb_icon_box] [spb_text_block animation="none" animation_delay="0" simplified_controls="no" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;padding-top: 30px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

Secondary Palette

[/spb_text_block] [spb_icon_box element_name="i7 Blue" title="i7 Blue" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#ffffff" bg_color="#00023a" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4" el_position="first"]

RGA
R 102 - 
G 51 - B 255

Hex
6632FF

[/spb_icon_box] [spb_icon_box element_name="i7 Blue" title="i7 Blue" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#ffffff" bg_color="#454545" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4"]

RGA
R 102 - 
G 51 - B 255

Hex
6632FF

[/spb_icon_box] [spb_icon_box element_name="i7 Blue" title="i7 Blue" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#ffffff" bg_color="#bababa" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4"]

RGA
R 102 - 
G 51 - B 255

Hex
6632FF

[/spb_icon_box] [spb_icon_box element_name="i7 Blue" title="i7 Blue" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#ffffff" bg_color="#cccccc" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4" el_position="last"]

RGA
R 102 - 
G 51 - B 255

Hex
6632FF

[/spb_icon_box] [spb_blank_spacer height="30px" width="1/1" el_position="first last"] [spb_icon_box element_name="i7 Blue" title="i7 Blue" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#ffffff" bg_color="#dedede" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4" el_position="first"]

RGA
R 102 - 
G 51 - B 255

Hex
6632FF

[/spb_icon_box] [spb_icon_box element_name="i7 Blue" title="i7 Blue" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#ffffff" bg_color="#ededed" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4"]

RGA
R 102 - 
G 51 - B 255

Hex
6632FF

[/spb_icon_box] [spb_icon_box element_name="i7 Blue" title="i7 Blue" box_type="animated-alt" animate_svg="no" target="_self" animation="none" animation_delay="0" icon_color="#ffffff" text_color="#ffffff" bg_color="#f7f7f7" flip_bg_color="#f9f9f9" flip_text_color="#8f8f8f" animated_box_style="coloured" animated_box_rounded="yes" el_class="colour-box" width="1/4" el_position="last"]

RGA
R 102 - 
G 51 - B 255

Hex
6632FF

[/spb_icon_box] [spb_divider type="thin" text="Go to top" top_margin="40px" bottom_margin="40px" fullwidth="no" width="1/1" el_position="first last"] [/spb_row] [spb_row element_name="Forms + Input Fields" wrap_type="standard-width" row_bg_type="color" color_row_height="content-height" bg_type="cover" parallax_image_height="content-height" parallax_image_movement="fixed" parallax_image_speed="standard" bg_video_loop="yes" parallax_video_height="window-height" row_id="Forms + Input Fields" row_name="Forms + Input Fields" row_top_style="none" row_bottom_style="none" parallax_video_overlay="none" row_overlay_opacity="0" remove_element_spacing="no" row_col_spacing="0" row_col_pos="default" row_col_equal_heights="no" row_expanding="no" row_animation="none" row_animation_delay="0" minimize_row="yes" simplified_controls="yes" custom_css_percentage="no" custom_css="margin-top: 0px;margin-bottom: 0px;" border_styling_global="default" width="1/1" el_position="first last"] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" el_class="s4" width="1/1" el_position="first last"]

Forms and Input Fields

[/spb_text_block] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

First name:

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

.input_default {
height: 85px!important;
background-color: #f9f9f9!important;
border-bottom: 1px solid #eaeaea!important;
border-top: 0px!important;
border-left: 0px!important;
border-right: 0px!important;
border-radius: 0px!important;
}

[/spb_codesnippet] [spb_text_block animation="none" animation_delay="0" simplified_controls="yes" custom_css_percentage="no" padding_vertical="0" padding_horizontal="0" margin_vertical="0" custom_css="margin-top: 0px;margin-bottom: 0px;" border_size="0" border_styling_global="default" width="1/1" el_position="first last"]

[/spb_text_block] [spb_codesnippet language="css" width="1/1" el_position="first last"]

input[type="text"], input[type="email"], input[type="password"], textarea, select, .wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 textarea, .wpcf7 select, .ginput_container input[type="text"], .ginput_container input[type="email"], .ginput_container textarea, .ginput_container select, .mymail-form input[type="text"], .mymail-form input[type="email"], .mymail-form textarea, .mymail-form select, input[type="date"], input[type="tel"], input.input-text, input[type="number"], .select2-container .select2-choice {
font-family: CerebriSans-Book!important;
font-size: 22px!important;
color: #8A8A8A!important;
line-height: 40px!important;
}

[/spb_codesnippet] [spb_raw_html width="1/1" el_position="first last"]JTIwJTIwJTNDZm9ybSUyMGNsYXNzJTNEJTIyZm9ybSUyMiUzRSUwQSUyMCUyMCUyMCUyMCUzQ2RpdiUyMGNsYXNzJTNEJTIyc3dpdGNoLWZpZWxkJTIyJTNFJTBBJTIwJTIwJTIwJTIwJTIwJTIwJTNDaW5wdXQlMjB0eXBlJTNEJTIycmFkaW8lMjIlMjBpZCUzRCUyMnN3aXRjaF9sZWZ0JTIyJTIwbmFtZSUzRCUyMnN3aXRjaF8yJTIyJTIwdmFsdWUlM0QlMjJ5ZXMlMjIlMjBjaGVja2VkJTJGJTNFJTBBJTIwJTIwJTIwJTIwJTIwJTIwJTNDbGFiZWwlMjBmb3IlM0QlMjJzd2l0Y2hfbGVmdCUyMiUzRVllcyUzQyUyRmxhYmVsJTNFJTBBJTIwJTIwJTIwJTIwJTIwJTIwJTNDaW5wdXQlMjB0eXBlJTNEJTIycmFkaW8lMjIlMjBpZCUzRCUyMnN3aXRjaF9yaWdodCUyMiUyMG5hbWUlM0QlMjJzd2l0Y2hfMiUyMiUyMHZhbHVlJTNEJTIybm8lMjIlMjAlMkYlM0UlMEElMjAlMjAlMjAlMjAlMjAlMjAlM0NsYWJlbCUyMGZvciUzRCUyMnN3aXRjaF9yaWdodCUyMiUzRU5vJTNDJTJGbGFiZWwlM0UlMEElMjAlMjAlMjAlMjAlM0MlMkZkaXYlM0UlM0MlMkZmb3JtJTNF[/spb_raw_html] [spb_blank_spacer height="20px" width="1/1" el_position="first last"] [spb_codesnippet language="css" width="1/1" el_position="first last"]

.switch-field {
font-family: "Lucida Grande", Tahoma, Verdana, sans-serif;
overflow: hidden;
}

.switch-title {
margin-bottom: 6px;
}

.switch-field input {
position: absolute !important;
clip: rect(0, 0, 0, 0);
height: 1px;
width: 1px;
border: 0;
overflow: hidden;
}

.switch-field label {
float: left;
}

.switch-field label {
display: inline-block;
width: 50%;
height: 85px;
line-height: 85px;
background-color: #f9f9f9;
color: rgba(0, 0, 0, 0.6);
font-size: 14px;
font-weight: normal;
text-align: center;
text-shadow: none;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
}

.switch-field label:hover {
cursor: pointer;
}

.switch-field input:checked + label {
background-color: #6632FF;
-webkit-box-shadow: none;
box-shadow: none;
color: #fff;
}

.switch-field label:first-of-type {
}

.switch-field label:last-of-type {
}

[/spb_codesnippet] [/spb_row]