Style Guide

Photo added using Image Module

Does not have captions. They must be added with a text module below manually if wanted.

1. For image remove space below image in module settings.

2.  For caption add text module and style or pull caption style from Divi Library of items using Add From Library tab when adding new Module. See how video here

 

Family walking in New York City 

Photo added in Text Module

Shows caption automatically if available

Lynn Saville/Pandemic Response Institute

Page Titles

Montserrat Bold font
Custom H1 size: 50px
Custom Letter Spacing :0.5px
Custom Style: All Caps
Color: White
Custom Line-height: 0.9em
Bottom border: 17px with accent color

Focus Areas

Site Navigation

Montserrat Bold font
Font size: 18px
Line-Height: 1em
Font style: All Caps
Active Font color: White
Default Font color: #bfbfbf (Light gray)
Hover Font color: Site link color 

Headers

Montserrat Bold font used for all headers
1.2  line-height

H1: 40px

H2: 34px

H3: 30px

H4: 24px

H5: 21px

H6: 18px

 

 

Body Font

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Site Colors

Header and Footer Color
Accent Color
Accent Color
Accent Color & Link Color
Accent Color
Accent Color
Body Text & Inner Page Headers

Gray Accent

Gray Accent

Site Images

4×2 ratio: Full Width Hero

Min 1600 w
Max 2500 w

3:2  ratio: Post Features

Min  1080 w x 720h
Max 2160 w x 1440h 

 

1:1  ratio: Portraits

Min 500 w
Max  1080 w

 

Blog Posts

Custom Title Text:

  • Black
  • 18px
  • Montserrat Semi Bold
  • Line Height 1.3em

Except Text Color: 

  • Black
  • 15px
  • Lato, regular

Meta Data

  • Categories (TBD on Color Boxes ) Link color
  • Date (#000)

Home Page Custom

Hero Posts

  • White Title Text
  • Montserrat Semi Bold
  • No Excerpt
  • Category Boxed in accent color

Section Headers

  • Custom Accent Color