alxjrvs/WednesdayShelf

body.splash
  background-color: $white
  overflow: hidden
  width: emCalc(1000px)

  #content
    @media #{$small}
      left: 0px
      +grid-column(12)
  #bar
    display: none

  #splash-container
    +grid-row
    position: relative
    overflow: hidden
    padding-bottom: 50px
    @media #{$small}
      overflow: visible
      padding-bottom: 0px

    .teaser-text
      +clearfix
      +grid-column(12)
      padding-top: 6%
      margin: 0 auto
      @media #{$small}
        padding-bottom: 20px
        +grid-column(8, $center: true)

      h1
        text-align: center
        padding-bottom: 10px
        span
          background: $blue
          color: white
          padding-left: 10px
          @media #{$small}
            padding-left: 12.5px
          a
            color: white
          a:hover
            color: white

      p
        font-weight: 100
        font-size: 20px
        line-height: 24px
        text-align: left
        @media #{$small}
          text-align: center

        span
          +bold

    .call-to-action
      +clearfix
      +grid-row
      +grid-column(12)
      padding-left: 2em
      padding-right: 2em
      position: relative
      z-index: 99
      @media #{$small}
        +grid-column(8, $center: true)

      &:before
        content: ''
        background-image: image-url("PaperBag.png")
        background-size: 100%
        background-repeat: no-repeat
        width: 1000px
        height: 800px
        position: absolute
        left: -185px
        top: 0px

      #mc_embed_signup
        +grid-row($behavior: nest)
        clear: left
        font: 24px
        padding-top: 60px
        @media #{$small}

        form
          +clearfix
          @media #{$small}
            +grid-column(9, $center: true)

          .list-signup-inputs
            +grid-row

            .cta-email-input
              +grid-column(12)
              height: 41px
              background: $white
              @media #{$small}
                +grid-column(8)
                margin-left: 2em

            .list-signup
              +grid-column(12)
              padding: 0
              @media #{$small}
                +grid-column(4)
                margin-left: -35px

              .list-signup-button
                +button($bg: $blue)
                width: 100%
                font-weight: 400

      a
        text-decoration: underline
        color: white

      .legal
        position: relative
        z-index: 999
        text-align: center
        font-size: 14px
        color: white

    #SecretKey
      text-align: center

      #secret-form
        +grid-row

        .secret-key-input
          +grid-column(12)
          height: 41px
          background: $white
          @media #{$small}
            +grid-column(8)
            margin-left: 2em

        .secret-key-signin
          +grid-column(12)
          padding: 0
          @media #{$small}
            +grid-column(4)
            margin-left: -35px

          .secret-key-signin-button
            +button($bg: $blue)
            width: 100%
            font-weight: 400