@import url('http://fonts.googleapis.com/css?family=Roboto')
::-webkit-scrollbar
  display none

.onboarding
  height 420px
  width 380px
  margin auto
  transform translateY(15%)
  background #FFFFFF
  font-smoothing antialiased
  osx-font-smoothing grayscale

  .drift-login-popup
    height 420px
    width 380px

.drift-login-popup
  border-radius 10px
  box-shadow 0 3px 40px rgba(0, 0, 0, .4)

  img
    display inherit
    margin 0 auto

.drift-popup-logo
  margin 60px auto 0px

.drift-popup-header
  margin 10px auto
  padding 0 25px
  color #FFFFFF
  font-weight bold
  font-size 41px
  font-family 'Proxima Nova', 'Roboto', Helvetica, sans-serif
  text-align center

.drift-outbound-button
  width 310px
  display block
  margin 0 auto
  font-family var(--main-font-family), 'Roboto', Helvetica, sans-serif
  font-weight 400
  height 40px
  font-size 14px
  border 0
  border-radius 20px

  &.button-primary
    background-color #13cb6e
    color #fff

    &:hover
      background-color #10A559

.drift-outbound-p-tag
  font-family var(--main-font-family), 'Roboto', Helvetica, sans-serif
  font-size 16px
  font-weight 400
  line-height 21px
  margin 0 auto 24px
  display inherit
  padding 10px 30px
  text-align center
  color #FFFFFF

.login-account-info-text
  text-align center
  display block
  margin 9px auto 44px

  &.sign-up
    margin 0 auto
    color #FFFFFF

.drift-outbound-login-page-link
  color #FFFFFF
  opacity 0.4

  &:hover
    cursor pointer
    opacity 1

  &.forgot-password
    font-size 12px

  &.sign-up
    font-weight 500

.drift-outbound-failed-login
  text-align center
  font-size 12px
  color #FFFFFF

.onboarding-close
  position absolute
  right 0
  top 20px
  right 20px

  svg
    width 20px
    height 20px
    opacity 0.7

    path
      fill #394F5A

  &:hover
    svg
      width 20px
      height 20px
      opacity 1