.field.clean:invalid {
  border: 1px solid #D1D3D4;
}

.field.clean:invalid:focus {
  outline: 0px none;
  border-color: #80C1C4;
  box-shadow: 0px 0px 0px 2px rgba(128, 193, 196, 0.5);
}

.field.invalid{
  border-color:#d8805d;
}

.field.invalid:focus{
  box-shadow:0 0 0 2px rgba(216,128,93,.5);
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}
input[type="number"] {
    -moz-appearance: textfield;
}

button[disabled],
html input[disabled] {
  background-color: #ccc;
}

.spinner {
  margin: -10px 0 -10px 10px;
  height: 30px;
  width: 30px;
  display: inline-block;
  background: url(/assets/img/mindoula-loader.gif) center center no-repeat;
  background-size: cover;
}

@keyframes rotate {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}

.cssload-loader {
	display: block;
	margin:0 auto;
	width: 26px;
	height: 26px;
	position: relative;
	border: 3px solid rgb(102,206,255);
	animation: cssload-loader 2.3s infinite ease;
		-o-animation: cssload-loader 2.3s infinite ease;
		-ms-animation: cssload-loader 2.3s infinite ease;
		-webkit-animation: cssload-loader 2.3s infinite ease;
		-moz-animation: cssload-loader 2.3s infinite ease;
}

.cssload-loader-inner {
	vertical-align: top;
	display: inline-block;
	width: 100%;
	background-color: rgb(102,206,255);
	animation: cssload-loader-inner 2.3s infinite ease-in;
		-o-animation: cssload-loader-inner 2.3s infinite ease-in;
		-ms-animation: cssload-loader-inner 2.3s infinite ease-in;
		-webkit-animation: cssload-loader-inner 2.3s infinite ease-in;
		-moz-animation: cssload-loader-inner 2.3s infinite ease-in;
}


@keyframes cssload-loader {
	0% {
		transform: rotate(0deg);
	}

	25% {
		transform: rotate(180deg);
	}

	50% {
		transform: rotate(180deg);
	}

	75% {
		transform: rotate(360deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

@-o-keyframes cssload-loader {
	0% {
		transform: rotate(0deg);
	}

	25% {
		transform: rotate(180deg);
	}

	50% {
		transform: rotate(180deg);
	}

	75% {
		transform: rotate(360deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

@-ms-keyframes cssload-loader {
	0% {
		transform: rotate(0deg);
	}

	25% {
		transform: rotate(180deg);
	}

	50% {
		transform: rotate(180deg);
	}

	75% {
		transform: rotate(360deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

@-webkit-keyframes cssload-loader {
	0% {
		transform: rotate(0deg);
	}

	25% {
		transform: rotate(180deg);
	}

	50% {
		transform: rotate(180deg);
	}

	75% {
		transform: rotate(360deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

@-moz-keyframes cssload-loader {
	0% {
		transform: rotate(0deg);
	}

	25% {
		transform: rotate(180deg);
	}

	50% {
		transform: rotate(180deg);
	}

	75% {
		transform: rotate(360deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

@keyframes cssload-loader-inner {
	0% {
		height: 0%;
	}

	25% {
		height: 0%;
	}

	50% {
		height: 100%;
	}

	75% {
		height: 100%;
	}

	100% {
		height: 0%;
	}
}

@-o-keyframes cssload-loader-inner {
	0% {
		height: 0%;
	}

	25% {
		height: 0%;
	}

	50% {
		height: 100%;
	}

	75% {
		height: 100%;
	}

	100% {
		height: 0%;
	}
}

@-ms-keyframes cssload-loader-inner {
	0% {
		height: 0%;
	}

	25% {
		height: 0%;
	}

	50% {
		height: 100%;
	}

	75% {
		height: 100%;
	}

	100% {
		height: 0%;
	}
}

@-webkit-keyframes cssload-loader-inner {
	0% {
		height: 0%;
	}

	25% {
		height: 0%;
	}

	50% {
		height: 100%;
	}

	75% {
		height: 100%;
	}

	100% {
		height: 0%;
	}
}

@-moz-keyframes cssload-loader-inner {
	0% {
		height: 0%;
	}

	25% {
		height: 0%;
	}

	50% {
		height: 100%;
	}

	75% {
		height: 100%;
	}

	100% {
		height: 0%;
	}
}