.error-page
  +flex(center, center)
  padding-top: 10vh

  .placeholder
    width: 100%
    max-width: 480px

    .logo
      +flex(center, center)
      height: 200px
      width: 100%
      min-width: 340px
      +media-query(400px)
        transform-origin: 50% 50%
        transform: scale(0.75)

      .placeholder
        +flex(center, center)
        +flex-rows
        position: relative
        max-width: 340px
        span
          display: inline-block
          +sprite(0 0, 340px, 64px)

        p
          margin: 0
          +font-light(13px, 16px)
          color: $darkGray
          text-transform: uppercase
          text-align: right
          width: 100%
          margin-top: 20px
          padding-top: 15px
          border-top: 2px solid rgba(0,0,0,0.5)


    .box
      background-color: $grayBrownish
      padding: 40px 60px

      +media-query(400px)
        padding: 30px 35px

      h1
        margin: auto
        +font-header(32px, 52px)
        color: #3C3C3B

        &.number
          +font-header(60px, 80px)
          position: relative
          color: $turquoise

      .return-home
        display: inline-block
        margin: 40px 0
        background: $turquoise
        border-radius: 40px
        a
          display: inline-block
          padding: 13px 20px
          color: white
          +font-default(18px, 18px)

          &:before
            content: ''
            background-image: url('/img/prev.png')
            width: 16px
            height: 16px
            margin-right: 20px
            transition: margin-right 0.3s
            position: relative
            top: 2px
            display: inline-block

        &:hover
          a
            &:before
              margin-right: 30px