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

• Interior Hero: 1920 × 600
• Home Hero: 960 × 900
• 50/50 Image: 960 × 900
• Quote Column: 325 × 315
• Photo Column: 325 × 200
• Image Card / Gallery Image: 450 × 250
• Blurb Image: 112 × 125+
• Midpage CTA: 1200 × 450
• Footer CTA: 1920 × 600
• Testimonial Headshot: 50 × 50
• Team Bio Headshot (Feed): 325 × 455
• Team Bio Headshot (Detail): 500 × 700
• Blog / Project Featured Image: 960 x 900
• Project Gallery Images (Landscape): 1200 x 800
• Project Gallery Images (Portrait): 800 x 1200

Font Specifics

• H1 – Montserrat, 300 ALL CAPS • 36/41px • Color: Charcoal • Margin: 0 0 15px;
• H1 Desktop – 48/58px • Letter-Spacing: 2px;
• H2 – Montserrat, 300 ALL CAPS • 28/34px • Color: Charcoal • Margin: 0 0 15px;
• H2 Desktop – 36/46px • Letter-Spacing: 2px;
• H3 – Montserrat, 300 • 20/30px • Color: Charcoal • Margin: 0 0 15px;
• H3 Desktop – 22/35px;
• H4 – Montserrat, 500 ALL CAPS • 16/19px • Color: Blue • Letter-Spacing: 3px • Margin: 0 0 15px;
• H4 Desktop – 18/22px • Letter-Spacing: 4px;
• H5 – Montserrat, 300 • 18/26px • Color: Charcoal • Margin: 0 0 15px;
• H5 Desktop – 20/30px;
• H6 – Montserrat, 300 • 16/20px • Color: Charcoal • Margin: 0 0 15px;
• Pre-Title – Lato, 300 ALL CPAS • 14/16px • Color: Charcoal • Letter-Spacing: 1.75px • Margin: 0 0 15px;
• Pre-Title Desktop – 16/17px • Letter-Spacing: 2px;
• Paragraph – Lato, 400 • 16/28px • Color: Charcoal • Margin: 0 0 15px;
• Paragraph Desktop – 18/30px;
• Intro Paragraph – Montserrat, 400 • 16/26px • Color: Blue • Margin: 0 0 15px;
• Intro Paragraph Desktop – 18/30px;
• Blockquote – Lato, 300 Italic • 20/28px • Color: Blue • Margin: 0 0 15px;
• Blockquote Desktop – 22/30px;
• UL & OL – Margin: 0 • Padding: 10px 0 0 10px;

Site Color Values