.login-form {
	.form-inner {
		padding-bottom: 15px;
	}

	.login {
		.register {
			position: absolute;
			top: -25px;
			right: 40px;
			height: 50px;
			width: 50px;
			background: #ffffff;
			text-align: center;
			border-radius: 100%;
			transition: 200ms ease-in-out;

			@include themify {
				border: 4px solid themed('primary');
				color: themed('black');
			}

			&:hover {
				@include themify {
					color: themed('primary');
				}
			}

			> i {
				font-size: 24px;
				margin-top: 9px;
				margin-left: 3px;
			}
		}

		.btn-login {
			margin: 5px auto 8px;
			padding: 11px 60px;
		}
	}

	.forgot-password {
		font-size: 16px;
		margin-top: 10px;
		transition: 200ms ease-in-out;

		@include themify {
			color: themed('primary');
		}

		&:hover {
			@include themify {
				color: themed('primary-hover');
			}
		}
	}
}

.form-wrapper {
	.social-login-buttons {
		margin-top: 15px;

		> span {
			font-weight: 600;
			display: block;
			margin-bottom: 10px;
		}
        
        .hline {
            width: 100%;
            text-align: center;
            line-height: 0.2em;
            margin: 20px 0 20px;
        }
        .hline-innertext {
            border-radius: 50%;
            padding: 8px 10px;
        }

		.btn-facebook {
			background: #4267b2;
            color: #ffffff;
            transition: 200ms ease-in-out;
            width: 75%;
            padding: 10px;
            border-radius: 10px;
            opacity: 0.85;
			&:hover {
				opacity: 1;
			}

		}

		.btn-google {
			color: #ffffff;
			background: #dd4b39;
			transition: 200ms ease-in-out;
            width: 75%;
            padding: 10px;
            border-radius: 10px;
            opacity: 0.85;
			&:hover {
				opacity: 1;
			}

		}
	}
}

@media screen and (max-width: 415px) {
	.login-form {
		.checkbox {
			float: none !important;
			display: table;
			margin: 15px auto 0;
		}

		.forgot-password {
			float: none !important;
			display: table;
			margin: 10px auto;
		}
	}
}
