html, body
  background: #EFF3F4
  //font-family: 'Open Sans', serif

.navbar
  .title
    padding-left: 5px

.hero-body
  //.container
  //  max-width: 700px
  .title
    color: #fcfdfd !important
    text-shadow: 1px 1px 2px black, 0 0 1em black, 0 0 0.2em black
    text-align: center
  .subtitle
    color: #fcfdfd !important
    padding-top: 2rem
    line-height: 1.5
    text-align: center

.features
  padding: 3rem 0

.box.cta
  border-radius: 0
  border-left: none
  border-right: none

.card-image > .fa
  font-size: 8rem
  padding-top: 2rem
  padding-bottom: 2rem
  color: #00d1b2

.card-content .content
  font-size: 14px
  margin: 1rem 1rem
  h4
    font-size: 16px
    font-weight: 700

.card
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.18)
  margin-bottom: 2rem

.intro
  padding: 5rem 0
  text-align: center

.sandbox
  padding: 5rem 0

.tile.notification
  display: flex
  justify-content: center
  flex-direction: column

.is-shady
  animation: flyintoright .4s backwards
  background: #fff
  box-shadow: rgba(0, 0, 0, .1) 0 1px 0
  border-radius: 4px
  display: inline-block
  margin: 10px
  position: relative
  transition: all .2s ease-in-out

.is-shady:hover
  box-shadow: 0 10px 16px rgba(0, 0, 0, .13), 0 6px 6px rgba(0, 0, 0, .19)

.article
  //margin: 2rem 0
  margin-top: 10px

.article .content p
  line-height: 1.9
  margin: 15px 0

.article-title
  font-size: 2rem
  font-weight: lighter
  line-height: 2

.article-subtitle
  color: #909AA0
  margin-bottom: 3rem

.article-body
  line-height: 1.4
  //margin: 0 6rem
