Color Palette
Zekelman Red
#E41837
Zekelman Dark Red
#931903
Zekelman Black
#231F20
Zekelman Gray
#6A6A6C
Light Gray
#E5E5E8
White
#FFFFFF
Deep
#203E45
Shade
#33636E
Main
#407D8A
Seafoam
#79A3AD
Mist
#C5D7DB
Glacier
#E9F1F3
Accent
#01CCE1
Deep gradient
linear-gradient(80deg, var(--c-deep) 15%, #43727b 52%, #41919f 82%);
Font Family
Gotham Bold
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
Gotham Bold Italic
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
Gotham Book
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
Gotham Book Italic
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789
Typography
1rem = 10px
Mobile
Tablet
Desktop
Headline 1
Light
Mobile
color: #203E45
font-family: Gotham Book
font-size: 4rem
font-style: normal
font-weight: 300
letter-spacing: -0.3rem
line-height: 0.8
margin-bottom: 3rem
text-transform: uppercase
Tablet
font-size: 4rem
margin-bottom: 4rem
Desktop
font-size: 7.8rem
margin-bottom: 5rem
Headline 1
Bold
Mobile
color: #203E45;
font-family: Gotham Book;
font-size: 4rem;
font-style: normal;
font-weight: 300;
letter-spacing: -0.3rem;
line-height: 0.8;
margin-bottom: 3rem;
text-transform: uppercase;
Tablet
font-size: 4rem;
margin-bottom: 4rem;
Desktop
font-size: 7.8rem;
margin-bottom: 5rem;
Headline 2
Lorem ipsum dolor
Mobile
color: #203E45;
font-family: Gotham Book;
font-size: 4rem;
font-style: normal;
font-weight: 300;
letter-spacing: -0.3rem;
line-height: 0.9;
margin-bottom: 3rem;
text-transform: uppercase;
Tablet
font-size: 4rem;
margin-bottom: 4rem;
Desktop
font-size: 7.8rem;
margin-bottom: 5rem;
Headline 3
Lorem ipsum dolor
Mobile
color: #33636E;
font-family: Gotham Bold;
font-size: 3.5rem;
font-style: italic;
font-weight: 300;
letter-spacing: -0.3rem;
line-height: 0.9;
margin-bottom: 3rem;
text-transform: uppercase;
Tablet
font-size: 4rem;
margin-bottom: 4rem;
Desktop
font-size: 4.5rem;
Headline 4
Lorem ipsum dolor
Mobile
color: #203E45;
font-family: Gotham Book;
font-size: 3.5rem;
font-style: italic;
font-weight: 700;
letter-spacing: -0.3rem;
line-height: 0.9;
margin-bottom: 3rem;
text-transform: uppercase;
Tablet
font-size: 4rem;
margin-bottom: 4rem;
Desktop
font-size: 4.5rem;
margin-bottom: 5rem;
Headline 5
Lorem ipsum dolor
Mobile
color: #407D8A;
font-family: Gotham Book;
font-size: 2.6rem;
font-style: italic;
font-weight: 300;
letter-spacing: -0.2rem;
line-height: 0.8;
margin-bottom: 3rem;
text-transform: none;
Tablet
font-size: 2.8rem;
line-height: 0.9;
Desktop
font-size: 3rem;
margin-bottom: 4rem;
Headline 6
Lorem ipsum dolor
Mobile
color: #203E45;
font-family: Gotham Book;
font-size: 2.4rem;
font-style: italic;
font-weight: 700;
letter-spacing: -0.2rem;
line-height: 1.2;
margin-bottom: 3rem;
text-transform: uppercase;
Tablet
font-size: 2.6rem;
margin-bottom: 3rem;
Desktop
font-size: 2.8rem;
margin-bottom: 4rem;
Headline 7
Lorem ipsum dolor
Mobile
color: #203E45;
font-family: Gotham Bold;
font-size: 2rem;
font-style: normal;
font-weight: 700;
letter-spacing: -0.2rem;
line-height: 1.2;
margin-bottom: 2rem;
text-transform: none;
Tablet
font-size: 2.1rem;
margin-bottom: 2rem;
Desktop
font-size: 2.3rem;
margin-bottom: 4rem;
Paragraph Text
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Nihil, pariatur est? Aperiam hic deleniti dolorum?
Mobile
color: #6C6F70;
font-family: Gotham Book;
font-size: 1.5rem;
font-style: normal;
font-weight: 300;
letter-spacing: 0;
line-height: 1.5;
margin-bottom: 2rem;
margin-top: 2rem;
text-transform: none;
Tablet
font-size: 1.6rem;
Desktop
font-size: 1.8rem;
margin-bottom: 3rem;
Form Elements