/** Styles for display errors in a bubble **/
.ui-tooltip.error-tip {
	background: #E60002;
	border: 2px solid white;
	pointer-events: none;
}

.ui-tooltip.error-tip {
	padding: 10px 20px;
	color: #ffffff !important; /* really have no idea how to make this thing work when people start use important everywhere, e.g. jquery-ui.css @ 927 */
	border-radius: 5px;
	font: normal 14px "Helvetica Neue", Sans-Serif;
	box-shadow: 1px 2px 2px #000000;
	background-color: #EA0000;
	width: 178px;
}

.arrow:after {
    border-bottom: 10px solid #EA0000;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    content: " ";
    display: block;
    left: -12px;
    position: absolute;
    top: 2px;
    z-index: 9;
}
.arrow {
    border-bottom: 10px solid #FFFFFF;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    left: 34px;
    position: absolute;
    top: -10px;
}


/** Start styles for normal error style **/
#formErrorsContainer {
	background-color: #EA0101;
	left: 0;
	position: fixed;
	right: 0;
	color: #FFFFFF;
	font-size: 14px;
	display: none;
	z-index: 1000;
	top: 0;
}

.formErrorInnerContainer {
	margin: 0 auto;
	padding: 0 70px 0 60px;
	position: relative;
	width: 830px;
	min-height: 55px;
	overflow:hidden;
}

	.formErrorInnerContainer .exclamation {
		position: absolute;
		left: 16px;
		top: 10px;
	}

		.formErrorInnerContainer .exclamation:before {
			font-size: 33px;
		}

	.formErrorInnerContainer h2 {
		font-size: 18px;
		padding-top: 15px;
		color: #fff;
	}

#formErrors {
	margin: 0px;
	margin-left: 15px;
	padding: 0px;
	max-height:390px; /* Used to stop errors overflowing the entire page */
}

	#formErrors h2 {
		font-size: 18px;
	}

	#formErrors label {
		display: block;
	}

	#formErrors li:before {
		background-color: #FFFFFF;
		border: medium none;
		content: " ";
		height: 5px;
		left: 3px;
		margin-top: -3px;
		position: absolute;
		top: 50%;
		width: 5px;
	}


	#formErrors li {
		list-style: none outside none;
		position: relative;
		margin: 0px;
		padding: 0px 0px 0px 11px;
		color: #fff;
		line-height: 120%;
	}

	#formErrors .validation-failed {
		padding: 3px 5px;
		background-color: transparent;
		font-size: 15px;
	}

.formErrorsClose {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	background-color: #BA0101;
	cursor: pointer;
	font-size: 11px;
	height: 64px;
	padding: 15px 0 0;
	position: absolute;
	right: 0;
	text-align: center;
	top: 0;
	width: 70px;
	z-index:1;
}

	.formErrorsClose .icon-close-circle:before {
		font-size: 19px;
	}
.form .row.validation-failed textarea,
.form .row.validation-failed input,
.form .row.error-field input,
.form .row.validation-failed select,
.form .row.sub > .validation-failed input,
.form .row.sub .sub .validation-failed input,
.form.custom .validation-failed input {
	border: 2px solid #B00020 !important;
	-webkit-transition: all 400ms;
	transition: all 400ms;
	background-color: rgba(176,3,32,0.1) !important;
}

.form .row.validation-failed textarea:focus,
.form .row.validation-failed input:focus,
.form .row.validation-failed select:focus,
.form .row.sub > .validation-failed input:focus,
.form .row.sub .sub .validation-failed input:focus,
.form.custom .validation-failed input:focus {
	outline-style: dotted;
	outline-color: #B5B5B5;
}

.form .row.validation-failed input[type=checkbox] + label:before{
    border: 2px solid #B00020;
}


.formErrorInnerContainer #showFormErrors {
    display: none;
}

.formErrorInnerContainer #showFormErrors {
	display: block;
	text-align: center;
	cursor: pointer;
	padding-bottom:10px;
	position:relative;
	background-color: #B00020;
}

	.formErrorInnerContainer #showFormErrors .icon {
		padding-top: 5px;
		transition: all 400ms ease 0s;
	}

	.formErrorInnerContainer #showFormErrors .open,
	.formErrorInnerContainer #showFormErrors.open .closed {
		display: none;
	}

		.formErrorInnerContainer #showFormErrors.open .open,
		.formErrorInnerContainer #showFormErrors .closed {
			display: block;
		}

		.formErrorInnerContainer #showFormErrors.open .icon {
			-webkit-transform: rotate(180deg);
			-moz-transform: rotate(180deg);
			-ms-transform: rotate(180deg);
			-o-transform: rotate(180deg);
			transform: rotate(180deg);
		}

.formErrorInnerContainer ul {
	display: none;
}


@media screen and (max-width: 800px)  and (max-device-width: 800px),
	screen and (max-width: 800px) and (-webkit-min-device-pixel-ratio: 2)
{

	/* Validation.css mobile tweaks */
	#formErrorsContainer {
		position: relative;
		margin-bottom: 10px;
	}

	#formErrors
	{
		max-height:190px;
	}

	.formErrorInnerContainer {
		width: auto;
		padding: 0 20px 0px 20px;
	}

		.formErrorInnerContainer .exclamation {
			display: none;
		}

		.formErrorInnerContainer h2 {
			padding-right: 55px;
		}
}

.validation-failed .pstrength-info > span {
    color: #FFFFFF !important;
}
.validation-failed .pstrength-bar {
    background-color: #FFE600 !important;
}
.pstrength-info > span {
    color: #000000 !important;
}
.pstrength-bar {
    background-color: #000000 !important;
}