Colour Palette

[vcex_spacing size=”150px”]

Colour Name
#333333
[text, footer etc]

[vcex_spacing size=”150px”]

Colour Name
#666666
[buttons etc]

[vcex_spacing size=”150px”]

Colour Name
#999999
[header etc]

[vcex_spacing size=”150px”]

Colour Name
#cccccc
[separator accents]

[vcex_spacing size=”150px”]

Colour Name
#f2f2f2
[sample location]

Typography: Font Pairing

Default Font: Open Sans

Font size: 1em
Font line height: 1.25 em
Font weight: 400 (normal)

Managed in Appearance > Customize > Typography > Body

Heading Font: Raleway

Overriden in Appearance > Customize > Typography > Headings

For blogs that desire a special font for just the actual body of articles, fonts can be overridden in Appearance > Customize > Typography > Post Content and Appearance > Customize > Typography > Blog Entry Excerpt

[vcex_divider margin=”top:0px|bottom:5em”][vcex_spacing][vcex_heading text=”Text Styles” el_class=”reverse” css=”.vc_custom_1617143859439{padding-top: 10px !important;padding-right: 10px !important;padding-bottom: 10px !important;padding-left: 10px !important;background-color: #333333 !important;}” color=”#ffffff”]

H1 Heading goes here. H1 Heading goes here. H1 Heading goes here.

Override the global Heading styles such as size, line height and weight in Appearance > Customize > Typography > Post H1

H2 Heading goes here. H2 Heading goes here. H2 Heading goes here.

Override the global Heading styles such as size, line height and weight in Appearance > Customize > Typography > Post H2

H3 Heading goes here. H3 Heading goes here. H3 Heading goes here.

Override the global Heading styles such as size, line height and weight in Appearance > Customize > Typography > Post H3

H4 Heading goes here. H4 Heading goes here. H4 Heading goes here.

Override the global Heading styles such as size, line height and weight in Appearance > Customize > Typography > Post H4

[vcex_spacing][vcex_divider margin=”top:0px|bottom:5em”][vcex_heading text=”Design Grid: Layout Specifications” tag=”h1″ css=”.vc_custom_1592565377227{margin-bottom: 15px !important;padding-bottom: 0px !important;}”]
Desktop
  • Default Layout1140px Design Grid
    (header/footer, generic content, blog pages, 3-column grids)
    • 3 x 360px design columns
    • 30px gutters
  • Wide LayoutCSS 1440 Grid
    (wider home page content, 4-column grids for product listings etc)
    • 4 x 330px columns
    • 30px gutters
Mobile Devices
[vcex_heading text=”Brand Files” el_class=”reverse” css=”.vc_custom_1592570123783{padding-top: 10px !important;padding-right: 10px !important;padding-bottom: 10px !important;padding-left: 10px !important;background-color: #333333 !important;}” color=”#ffffff”][vcex_image align=”center” overlay_style=”” image_id=”109″ css=”.vc_custom_1592570160292{margin: 30px !important;}”][vcex_heading text=”Widget Header” el_class=”reverse” css=”.vc_custom_1592557743709{padding-top: 10px !important;padding-right: 10px !important;padding-bottom: 10px !important;padding-left: 10px !important;background-color: #333333 !important;}” color=”#ffffff”][contact-form-7 id=”5″][vcex_spacing][vcex_heading text=”Type Samples” el_class=”reverse” css=”.vc_custom_1592570221927{padding-top: 10px !important;padding-right: 10px !important;padding-bottom: 10px !important;padding-left: 10px !important;background-color: #333333 !important;}” color=”#ffffff”][vcex_spacing size=”15px”]

This is a text block with a Drop Cap. It uses the “Extra class name “has-drop-cap”. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

[vcex_spacing size=”15px”][vcex_heading text=”Links”][vcex_spacing size=”15px”]

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.

[vcex_heading text=”Blockquote”]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

[vcex_heading text=”Bulleted List Example” css=”.vc_custom_1584569073596{margin-bottom: 1em !important;}”][vcex_bullets]

  • List 1
  • List 2
    • Sub List 1
    • Sub List 2
    • Sub List 3
  • List 3
  • List 4

[/vcex_bullets][vcex_button css_wrap=”.vc_custom_1584724686382{margin-top: 1em !important;}” font_size=”18px”]Call to Action[/vcex_button]