/* Typography presets

------------------------------------  */

.gigantic, .huge, .large, .bigger, .big, h1, h2, h3, h4, h5, h6

color: $headlineColor
font-weight: bold

.gigantic

font-size: 110px
line-height: 1.09
letter-spacing: -2px

.huge, h1

font-size: 68px
line-height: 1.05
letter-spacing: -1px

.large, h2

font-size: 42px
line-height: 1.14

.bigger, h3

font-size: 26px
line-height: 1.38

.big, h4

font-size: 22px
line-height: 1.38

.small, small

font-size: 10px
line-height: 1.2

p

margin: 0 0 20px 0

em

font-style: italic

strong

font-weight: bold

hr

border: solid #ddd
border-width: 1px 0 0
clear: both
margin: 10px 0 30px
height: 0

/* Links

------------------------------------  */

a

color: $accent
text-decoration: none
outline: 0

a:hover, a:focus

color: lighten($accent, 20%)

/* Selection colors (easy to forget)

------------------------------------  */

::selection

background: $selectionColor

::-moz-selection

background: $selectionColor

img::selection

background: transparent

img::-moz-selection

background: transparent

body

-webkit-tap-highlight-color: $selectionColor

/* Basic Styles

------------------------------------  */

body

background: $documentBackgroundColor
font-size: 14px
line-height: 1.6
font-family: 'Open Sans', sans-serif
color: $textColor
-webkit-font-smoothing: antialiased
-webkit-text-size-adjust: 100%

svg

+size(100%)

h3

@extend %small-bold
color: $accent-light
text-align: center
padding: 100px 0 30px

fieldset

padding: 0
margin: 0
border: none

@media screen and (max-width: 480px)

h3
  padding: 50px 0 50px

section:nth-child(odd)

background: $bgcolor
padding-bottom: 100px

h3
  color: darken($accent-light, 10%)