input {
	width: -webkit-fill-available!important;
}
.error-msg {
	display:block;
	color: #fff;
	background-color: #de5042;
	border-radius: 5px;
	text-align: center;
	max-width: 240px;
	width: 100%;
	font-size: 13px;
	line-height: 20px;
	margin: 5px auto !important;
	z-index: 100;
}
.valid-msg {
	color: #00C900;
	display:block;
	text-align: center;
}
.hide {
	display: none;
}
.iti{width:100%!important;display:block;}

.iti__flag-container{
	/* background: #ebebeb; */
	border-radius: 3px 0px 0px 3px;
	height: auto;
	margin: 2px;
	color: #000;
	z-index: 99999;
}

.iti__country-list--dropup {
    color:#000;
}

.iti__selected-dial-code{
    font-weight: 700;
}

.iti--allow-dropdown input[type=tel]:focus{
	padding-left: 52px;
}

label.error, label.valid {
  position: absolute;
  transform-style: preserve-3d;
  width: calc(100% - 20px);
  margin-left: 10px;
  font-size: 14px;
  line-height: 18px;
  border-radius: 5px;
  background: #e44545;
  color: #ffffff;
  padding: 6px;
  z-index: 3;
  left: 0;
  top: 45px;
}

label.error::before, label.valid::before {
  content: '';
  position: absolute;
  width: 15px;
  height: 15px;
  background: #e44545;
  border-radius: 2px;
  transform: translateZ(-1px) rotate(45deg);
  top: -5px;
  left: 17px;
  transform-style: preserve-3d;
}

input.error {
	background: #fff url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGNpcmNsZSBjeD0iMTIiIGN5PSIxMiIgcj0iMTIiIGZpbGw9IiNFNDQ1NDUiLz48cGF0aCBkPSJNMTMuMTc2IDE0LjJoLTEuNzkyTDExLjA0OCA3aDIuNDQ4bC0uMzIgNy4yWm0uMDE2IDMuMjQ4Yy0uMjU2LjI1Ni0uNTYuMzg0LS45MTIuMzg0cy0uNjU2LS4xMjgtLjkxMi0uMzg0YTEuMjU1IDEuMjU1IDAgMCAxLS4zNjgtLjg5NmMwLS4zNTIuMTIzLS42NTYuMzY4LS45MTIuMjU2LS4yNTYuNTYtLjM4NC45MTItLjM4NHMuNjU2LjEyOC45MTIuMzg0LjM4NC41Ni4zODQuOTEyYzAgLjM0MS0uMTI4LjY0LS4zODQuODk2WiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==) no-repeat 96%!important;
	border: 2px solid #de5042!important;
	padding-right: 30px!important;
	text-overflow: ellipsis;
	color: red!important;
	outline: none!important;
	font-weight:bold!important;
}

input.error:-moz-placeholder {
	color: red!important;
	font-weight:bold!important;
}

input.error::-moz-placeholder {
	color: red!important;
	font-weight:bold!important;
	opacity: 1!important;
}

input.error:-ms-input-placeholder {
	color: red!important;
	font-weight:bold!important;
}

input.error::-webkit-input-placeholder {
	color: red!important;
	font-weight:bold!important;
}

input.valid {
	background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAMAAADzN3VRAAAAtFBMVEUAAAAAkQAAkAAAkgAAkQAAkQAAiAAAkgAAkQAAkAAAkQAAkwAAiQAAkQAAkgAAiwAAkQAAkQAAkgAAkwAAkgAAjgAAlAAAjgAAjwAAlgAAlQAAkQAAkwAAjgD///8AaAAAawAAlQAAdADe890AgQAAewAAdgAAbgBjzHwAiwDg9OAAhgAAcgDb8dp20IlpzoFdyHrs+O3X8Ne658Ki3qmg3qeM2Z1RxnYPt1oAnygAmgkAeAA0OKQ5AAAAG3RSTlMA2xx3X+bh1tOfmz89JyPLxsLBYcN1TsvFTk4tCTJ4AAABKUlEQVQoz32Sx3aDMBBFRYyxce8pb0YUgwmxnd7z//+VYQTHZpHcBQsuD0lPY2rGy8G87/XnA39szrnoeGjwOhcnMVrgnNWoEddBSxAFGyeGXW4L4u5Q15i2BXZZwtNqrU5bcIosA6+NmXjnIkGE51fOyJuYJQQuQe5XER+t/SoYvgkhHOI9EVeivLP2vcyA0MwkkX1/5j8S4ohFPMQpEWamB6SJtbfxLuEYKg4QesaTbdKTtY9FWmBr7X18IC1JMoS0evUR7beaJbjMlTzLiKuvXyQZ507IOqEeT5UkojxxhkI9j6qjiEIEQ/HrDgiSeitSghNVB2btauEd9jlqAe5UXV8yaSoVUaNdu/tRRQRF70fZBHCqIbj5Yw4Wo/9np2Hs67ytTvP2C+7ENu1sMFE7AAAAAElFTkSuQmCC) no-repeat 96%!important;
	border: 2px solid green!important;
	padding-right: 30px!important;
	text-overflow: ellipsis;
	color: green!important;
	outline: none!important;
	font-weight:bold!important;
}

.error-box {
	color: #fff;
	background-color: #de5042;
	border-radius: 5px;
	text-align: center;
	max-width: 240px;
	width: 100%;
	font-size: 13px;
	line-height: 20px;
	margin: 5px auto !important;
	z-index: 100;
	/* position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%, -50%); */
	
}

/**/
.form{
	box-sizing: border-box;
	position: relative;
}

.form--controlWrapper{
	margin-bottom: 13px;
	position: relative;
}

.form--controlWrapper-half{
    width: calc(50% - 5px);
}

.form--input:focus{
	box-shadow: 0px 0px 12px 5px rgba(1, 204, 255, 0.25);
}

.form--floatingLabel{
	position: absolute;
	z-index: 1;
	transition: .3s ease all;
	font-size: 10px;
	line-height: 10px;
	font-style: italic;
	pointer-events: none;
	left: 10px;
	top: -10px; 
	padding: 1px 3px;
	background-color:#f11313;
	outline-style: none;
	border-radius: 3px;
	color: rgba(250, 250, 255, 0.8);
}

.form--input:placeholder-shown:not(:focus)~.form--floatingLabel {
	top: 1em;
	font-style: normal;
	/* font-weight: bold; */
	font-size: 16px;
	font-weight: normal;
	color: rgba(133, 133, 133, 0.9);
	background-color:transparent;
}