
@mixin login_main($t) {
	.#{$t} {
		$color: map-get($theme, $t);
		.login {
			width: 200px;
			margin: 20px auto;
			margin-top: 100px;
			text-align: center;
			font-size: 12px;

			.avatar {
				font-size: 50px;
				margin-bottom: 20px;
			}

			form {
				margin: 4px 0;

				input {
					background: map-get($color, 'upload_btn_bg');
					border: 1px solid map-get($color, 'upload_btn_border');
					border-radius: 0;
					text-shadow: none;
					text-indent: 8px;
					padding: 0;
					width: 198px;
					height: 30px;
					outline: none;
					color: map-get($color, 'upload_text_color');
					box-shadow: none;
					margin-bottom: 4px;
				}
			}


			button[type=submit] {
				margin-top: 10px;
				@include common_btn($color);
                display: block;
				width: 200px;
				height: 30px;
				padding: 0;
				&:hover {
					@include common_btn_acitve($color);
				}
			}

			.back-btn {
				text-align: left;
			}

			.tip {
				width: 200px;
				margin: 0 auto;
				padding: 6px 10px;
				text-align: left;
				background: map-get($color, 'upload_btn_bg');
				border-radius: 8px;
				color: map-get($color, 'link');
				margin-bottom: 20px;

				p {
					margin: 8px 0;
				}
			}

			.register {
				margin-top: 10px;
			}
		}

	}
}

@include login_main('gray');
@include login_main('white');
@include login_main('dark');
@include login_main('black');
