

.bc-validate {
	width: 100%;
	margin: 0;
	padding: 0;

	& > .label-container {

		& > .label {
			height: 40px;
			margin-bottom: 0;
			float: left;
			color: $bc-color-2;
			font: 16px/40px $ft-norm;
		}

		& > .hint {
			margin-bottom: 0;
			float: right;
			color: $bc-color-3;
			font: 13px/40px $ft-norm;
			text-align: right;

			& > .blue-hint {
				color: $bc-color-1;
			}
		}
	}

	& > .validate-container {
		margin: 0 0 3px;

		&.disabled {

			& > input {
				background-color: $bc-color-20;
				color: $bc-color-3;
			}
		}
	}

	& > .error-container {
		@include bc-box-sizing;
		@include bc-transition(height .3s ease);
		width: 100%;
		height: 0;
		color: $bc-color-2;
		font: 12px/15px $ft-norm;
	}

	&.invalid {

		& > .validate-container {

			& > input {
				border-color: $bc-color-9;
			}
		}

		& > .error-container {
			height: 15px;
			color: $bc-color-9;
		}
	}
}
