STYLE GUIDE

NOTE: Unless we need a super hi-rez image for some reason, all web images should be 72dps and typically a max of 1000px wide. Once saved for web in Photoshop the goal should be under 1MB in file size.

In Photoshop [File -> Export -> Save for Web (Legacy)]

Headers

For best SEO practices all Headers should be Outfit font typed with proper caps, but then use Elementor’s typography transform to Uppercase or CSS transform: uppercase.

H1 Header (2.4 rem)

H2 Header (2 rem)

H3 Header (1.8 rem)

H4 Header (1.4 rem)

H5 Header (1.2 rem)

H6 Header (1 rem)

Body Text

Body Text should be standard OS sans-serif font for best compatibility. We should be able to set this site-wide in Elementor.

ARIAL (sans-serif) – Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Colors

Use contrasting fonts dependent on background color of container. Red buttons should be reserved strictly for Log In or Sales CTAs. For HRs or separators use Light Grey or Accent Blue. Try to avoid super high contrast text and background combos like white on black or the inverse.

Black

#000000

White

#ffffff

Dark Grey

#30333F

Med. Grey

#777777

Lt. Grey

#CCCCCC

Sidebar Grey

#EEEEEE

RA Red

#AC1F2D

Highlight

#FFBB00

SubMenu

#3f414a

Accent Blue

#003772

NeoNickel

#4C6CAE