html, body
  padding: 0
  margin: 0

  //Use this to smooth some font styles
  -webkit-font-smoothing: antialiased
  -moz-osx-font-smoothing: grayscale
  text-rendering: optimizeLegibility

/*
  * Set up the base font size for using rem
  */
html
  font-size: $baseFontSize

body
  font-family: 'Lato', sans-serif
  font-weight: regular()
  line-height: 1.6
  letter-spacing: 0.4px
  max-width: 100%
  //overflow: hidden
  +respond-to-width(840)
    padding-top: 60px

*
  box-sizing: border-box
  ::selection
    background: $blue
    color: white

img
  border: none
  display: block

h1, h2, h3, h4, h5, figure
  margin: 0

img
  border: none

input, textarea
  font-family: 'Lato', sans-serif
  +placeholder
    opacity: 1
    +translate3d(0, 0, 0)
    transition: all 0.3s

.gridHolder
  display: none
  position: fixed
  height: 100%
  width: 100%
  .exampleGrid
    border: solid 1px red
    height: 100%
    .col-1
      border-left: solid 1px red
      height: 100%

      &:first-child
        border-left: none

.pull-right
  float: right

.pull-left
  float: left

/* Default content styling
   ===============================*/
.content
  color: $darkGray
  font-size: 0.9rem
  line-height: 1.2


  h1, h2
    font-size: 2rem
    line-height: 1.2
    max-width: 580px
    margin: 0 0 40px

  p
    margin: 1rem 0

    a
      color: $lightOrange
      text-decoration: underline
      transition: color 0.3s
      &:hover
        color: $buttonBlue

  ul, ol
    padding-left: 20px
    list-style: none

    li
      position: relative
      padding-left: 20px
      //font-size: 0.8rem
      &:before
        content: '•'
        position: absolute
        color: $darkBlue
        font-size: 0.8rem
        line-height: 1
        left: -20px

  ol
    // Custom List styling for '1.'
    counter-reset: ol-counter
    li
      &:before
        counter-increment: ol-counter
        content: counter(ol-counter)'.'
        font-size: 1rem
        top: 2px

  strong
    color: $fontBlack

  a
    color: $fontGray
    text-decoration: none
    transition: color 0.3s
    &:hover
      color: darken($fontGray, 15%)


+respond-to-width(840)
  .big-hexagon-holder
    display: none