.pro-login
	align-items center
	background url('../images/bzpro-splash2.jpg') no-repeat right bottom fixed
	background-size cover
	box-align center
	display flex
	height 100vh
	justify-content center
	font-size 18px

	&-wrap
		text-align center
		width 500px

	&-loader
		color #fff
		font-size 24px
		font-weight 600

	&__logo
		backgroundFallback(url('../images/bzpro-logo.png'), url('../images/bzpro-logo.svg'))
		background-size contain
		width 322px
		height 33px
		display inline-block
		margin-bottom 2em
		position relative
		// Beta logo for login page

		// &:after
		// 	display inline-block
		// 	position absolute
		// 	bottom 125%
		// 	right 20%
		// 	color $bz-white
		// 	font-weight 400
		// 	content 'beta'
		// 	background $bz-blue
		// 	padding 5px 10px
		// 	transform rotate(-15deg)

	&__title
		color #fff
		font-size 24px

	&__error
		background $bz-red
		text-align center
		line-height 3em
		color $bz-white
		font-size .9em
		font-weight 300
		position fixed
		z-index 1
		top 0
		left 0
		right 0
		&+.pro-login-wrap
			margin-top 3em

	&__field
		width 100%
		text-align left
		border-bottom 1px solid $bz-white
		margin-bottom 2em
		position relative
		&:before
			icon()
			position absolute
			left 0
			top 50%
			color rgba(255, 255, 255, .75)
			transform translateY(-50%)
		input
			placeholderColor(rgba(255, 255, 255, .75))
			font-size 1em
			width 100%
			outline 0
			background none
			border 0
			color $bz-white
			padding .75em
			box-sizing border-box
	&__submit
		outline 0
		width 100%
		cursor pointer
		background $bz-blue
		color $bz-white
		border 0
		font-size 1em
		padding 1em
		margin-bottom 1.5em
		simpleTransition(background)
		&.loading
			background $bz-grey--darker !important
			cursor auto
		&:hover
			background darken($bz-blue, 10%)
	&__forgot
		color $bz-white
		text-decoration none
		font-size .75em
		font-weight 300
		&:hover
			simpleTransition(color)
			color $bz-blue
	&__toggle
		font-size 1em
		margin-bottom 1em
		span, a
			&:first-child
				&:after
					color $bz-white
					content '\00a0\00a0|\00a0\00a0'
		span
			color $bz-blue
		font-weight 400
		color $bz-white
		a
			color $bz-white
			text-decoration none
			&:hover
				simpleTransition(color)
				color $bz-blue