@import url('http://fonts.googleapis.com/css?family=Roboto')
.drift-login-popup
  background -webkit-linear-gradient(315deg, rgba(0,117,255,0.85), rgba(0,6,167,0.85)), url("../../../img/andrew@2x.png") no-repeat
  background-size contain
  width 450px
  height 500px
  display flex
  flex-direction column
  justify-content center

  img
    display inherit
    margin 0 auto

.drift-outbound-input
  display inherit
  margin 8px auto
  width 310px
  background transparent
  align-items center
  border 1px solid rgba(255, 255, 255, .35)
  border-radius 20px
  color #FFFFFF
  font-weight 400
  font-family var(--main-font-family), 'Roboto', Helvetica, sans-serif
  font-size 14px
  height 40px
  padding 0 1rem
  box-sizing border-box

  &:focus
    border-color rgba(255, 255, 255, 1)
    outline none

.drift-outbound-input::-webkit-input-placeholder
  color #B5D2E1
  font-family var(--main-font-family), 'Roboto', Helvetica, sans-serif
  font-size 14px
  font-weight 300

.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

.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