.content {padding: 40px 25% 120px 25%;}
h1 {margin-bottom: 10px; font-family: var(--font-family-base-heading); font-size: 2rem;}
p.intro, p.outro {color: var(--dark); font-size: 1.4rem; font-weight: 500;}
p {margin-top: 0; color: var(--text-colour); line-height: 1.7;}
h2 {margin: 40px 0 0 0; font-family: var(--font-family-base-heading); font-size: 1.4rem;}
@media screen and (max-width: 1300px) {
    .content {padding: 40px 20% 120px 20%;}
}
@media screen and (max-width: 1000px) {
    .content {padding: 40px 5% 120px 5%;}
}
@media screen and (max-width: 800px) {
    h1 {font-size: 1.5rem;}
    p.intro, p.outro {font-size: 1.1rem;}
    p {font-size: 1rem;}
}