h1, .h1 { font-family: $font-family--body; font-size: 1.125rem; font-weight: $font-weight--bold; letter-spacing: .075em; line-height: 1.5555555556; margin: 0; @media only screen and (min-width: $break--laptop) { font-size: 2.25rem; line-height: 1.2222222222; } }
h2, .h2 { font-family: $font-family--body; font-size: 1.125rem; font-weight: $font-weight--bold; letter-spacing: .075em; line-height: 1.4285714286; margin: 0; @media only screen and (min-width: $break--laptop) { font-size: 1.75rem; letter-spacing: .05em; line-height: 1.2857142857; } }
It might be necessary to style an H1 element as an H2. And vice-versa.