Style Guide

Please reference the list below whenever you’re creating new images for your site. You should find a size for all possible images you’ll need/use.

Image Sizes

• Header Image: 700 × 500px JPG
• Home Header Image: 1300 × 975px
• Page Block: Image: 1000 × 750px JPG
• Page Block: Image — Large Solo Graphic: 1500px × Any Height
• Page Block: Blurb: 700 × 500px JPG
• Page Block: Projects Teams: 700 × 500px (same as header image for team detail)
• Icons: 150 × 150px PNGs or SVGs
• Video Thumbnail: 1245 × 700px JPG
• Events Thumbnail: 150 × 150px JPG
• Headshots for Bios & Testimonials: 500 × 500px
• Logos for Logos Page Block & Testimonials: 400 × 200px PNG no BKGD (recommended) or JPGs

Font Specifics

• Fonts Used: Proxima Nova Light, Semibold, & Bold – • /
• Headers over white or gray backgrounds – • / • Color: #13294B
• Headers over dark blue background – • / • Color: #FFF
• Body copy and lists over white or gray backgrounds – • / • Color: rgba(26,26,26,0.75)
• Body copy and lists over dark blue background – • / • Color: #FFF
• H1: Mobile – , 700 • 30/34px • Letter-Spacing: -0.5px • Margin: 0 0 15px; Padding: 0;
• H1: Tablet & Desktop – • 60/64px • Letter-Spacing: -1px • Margin: 0 0 20px;
• H2: Mobile – , 700 • 30/34px • Letter-Spacing: -0.5px • Margin: 0 0 20px; Padding: 20px 0 0 24px; (bottom padding 0 if no after element)
• H2: Tablet & Desktop – • 44/52px
• H3: Mobile – , 700 • 24/28px • Margin: 0 0 15px; Padding: 20px 0 0;
• H3: Tablet & Desktop – • 28/30px
• H4 – , 700 • 24/28px • Margin: 0 0 15px; Padding: 10px 0 0;
• H5 – , 700 • 19/25px • Margin: 0 0 10px; Padding: 0;
• H6 – , 700, ALL CAPS • 14/20px • Letter-Spacing: 2px • Margin: 0 0 10px; Padding: 0;
• Paragraph Text: Mobile – , 300 • 16/26pc • Margin: 0 0 20px; Padding: 0;
• Paragraph Text: Tablet & Desktop – • 19/30px
• Body copy or lists bold/strong – , 600 • /
• Intro P Class: Mobile – • 20/30px
• Intro P Class: Tablet & Desktop – • 25/35px
• LI’s: Mobile – • 15/24px • Margin: 0 0 14px 10px; Padding: 0 0 0 20px; (padding may vary based on before element positioning)
• LI’s: Tablet & Desktop – • 18/28px
• UL’s & OL’s – • / • Margin: 0; Padding: 5px 0;
• Pre-Title Class: Mobile – , 600, ALL CAPS • 13/15px • Letter-Spacing: 2px • Margin: 0 0 10px; Padding: 0;
• Pre-Title Class: Tablet & Desktop – • 14/18px
• Text Links – border-bottom: 2px dotted #97D700; • (if in body copy, lets semibold them)/
• Text Links Hover over white or gray backgrounds – • / • Color: rgba(26,26,26,1)
• Text Link Hover over dark blue background – • / • Color: rgba(255,255,255,.7)
• HR – Need to assign color for white/gray and for blue bkgds still – • /

Site Color Values