Headings

H1

font-family: “Oswald”, sans-serif;
font-weight: 400;
line-height: 1.2;
color: #006644;

Mobile

font-size: 3.2rem;
margin-bottom: 2.4rem;

Tablet

font-size: 4rem;
margin-bottom: 3rem;

Desktop

font-size: 5.4rem;
margin-bottom: 3rem;

H2

font-family: “Oswald”, sans-serif;
font-weight: 400;
line-height: 1.2;
color: #006644;

Mobile

font-size: 2.8rem;
margin-bottom: 2rem;

Tablet

font-size: 3.6rem;
margin-bottom: 2.4rem;

Desktop

font-size: 4rem;
margin-bottom: 2.4rem;

H3

font-family: “Oswald”, sans-serif;
font-weight: 400;
line-height: 1.2;
color: #006644;

Mobile

font-size: 2.4rem;
margin-bottom: 2rem;

Tablet

font-size: 2.8rem;
margin-bottom: 2.4rem;

Desktop

font-size: 3.2rem;
margin-bottom: 2.4rem;

H4

font-family: “Oswald”, sans-serif;
font-weight: 400;
line-height: 1.2;
color: #006644;

Mobile

font-size: 2.1rem;
margin-bottom: 1rem;

Tablet

font-size: 2.4rem;
margin-bottom: 1rem;

Desktop

font-size: 2.4rem;
margin-bottom: 1rem;

H5

font-family: “Oswald”, sans-serif;
font-weight: 400;
line-height: 1.2;
color: #006644;

Mobile

font-size: 2.1rem;
margin-bottom: 1rem;

Tablet

font-size: 2.1rem;
margin-bottom: 1rem;

Desktop

font-size: 2.12rem;
margin-bottom: 1rem;

H6

font-family: “Oswald”, sans-serif;
font-weight: 400;
line-height: 1.2;
color: #006644;

Mobile

font-size: 2.1rem;
margin-bottom: 1rem;

Tablet

font-size: 2.1rem;
margin-bottom: 1rem;

Desktop

font-size: 2.1rem;
margin-bottom: 1rem;

H1 on Hero Image Variation

H1

.u-text__color—white { color: #fff; }
.grad—hero__text h1 { margin: 0; text-shadow: 0 2px 4px rgba(0,0,0,.5); }