body, h1, h2, h3, h4, h5, h6 {
    font-family: Times New Roman,serif;
    font-weight: 400;
    font-style: normal;
    color: #222;
}
.ladda-button, .ladda-button .ladda-label, .ladda-button .ladda-spinner {
    -webkit-transition: all .3s cubic-bezier(.175,.885,.32,1.275)!important;
    -moz-transition: .3s cubic-bezier(.175,.885,.32,1.275) all!important;
    -ms-transition: .3s cubic-bezier(.175,.885,.32,1.275) all!important;
    -o-transition: .3s cubic-bezier(.175,.885,.32,1.275) all!important;
    transition: all .3s cubic-bezier(.175,.885,.32,1.275)!important;
}
.link {
    color: red;
    border: none;
    background: none;
    cursor: pointer;
}


label {
	display: inline-block;
	padding: 9px 0;
	&.error{
		color: $alertColor;
	}
	&.label--last{
		margin-bottom:$margin;
	}
}

button { -webkit-font-smoothing: $fontSmoothing; }

button,input {
  overflow: visible;
}

textarea { height: auto; }

.input {
	position: relative;
}
.input-postfix {
	margin: 0 0 $margin;
	display: flex;
	flex-direction: row;
	.input {
		width: auto;
		flex-grow: 2;
	}
	input {
		margin: 0;
		border-right: none;
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
	}
	.button {
		margin: 0;
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
	}
	.no-flexbox & {
		position: relative;
		.button {
			position: absolute;
			top: 0; right: 0;
		}
	}
}
.input.single-checkbox{
	margin-top:4px;
}


// Errors
.error-message, .error-svg{
	display: none;
	color:$alertColor;
}
.input.error{
	.error-message, .error-svg{
		// display: block;
	}
	.input__file-label{
		background-color: $alertColor;
		&:hover{
			background: darken($alertColor,10%);
		}
	}
}
.error-message{
	padding: 0;
  top: -20px;
  position: relative;
	@include font-size(14);
}
.error-svg {
	color: $alertColor;
	max-width: $inputHeight - 10px !important;
	height: $inputHeight - 20px !important;
	position: absolute;
	top: 10px;
	right: 10px;
}

// Errors from Freeform
form ul.errors{
	margin:-20px 0 20px;
	padding:0;
	li{
		color:$alertColor;
		list-style-type: none;
		@include font-size(14);
	}
}

// Select
.input--select {
	position: relative;
	&:hover { cursor: pointer; }
	.input__error { display: none; }
}
.input__select-arrow {
	overflow: hidden;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
	background: $mainColor;
	color: $white;
	width: $inputHeight; height: $inputHeight;
	display: block;
	text-align: center;
	border-top-right-radius: $default-border-radius;
	border-bottom-right-radius: $default-border-radius;
	font-family: sans-serif;
	line-height: $inputHeight;
	.lt-ie10 & { border-radius: 0; z-index: 2;  background: $white; }
}
.input__select::-ms-expand { display: none; }
.input__select {
		@include font-size($baseFontSize);
		box-shadow: none;
		border-radius: 0;
		position: relative;
		z-index: 1;
		-webkit-font-smoothing: antialiased;
		-webkit-appearance: none;
			-webkit-appearance: none;
			-moz-appearance: none;
		    text-indent: 0.01px;
		    text-overflow: '';

		display: block;
		width: 100%; height: $inputHeight;
		margin-bottom: $margin; padding-left: 15px;
		background: $white;
		border: 1px solid $borderColor;
		border-radius: $default-border-radius;
		color: lighten($txtColor, 50%);
		&:hover { cursor: pointer; }
		.lt-ie10 & { z-index: 1; padding-right: 0; }
		&.error {
			border: 1px solid $alertColor;
			padding-right: 77px;
			+ .input__select-arrow {
				border: 1px solid $alertColor; border-left: none;
				+ .input__error {
					display: block;
					position: absolute;
					right: $inputHeight + 10px; top: 10px;
					z-index: 2;
				}
			}
		}
	}

// Checkbox
html:not(.lt-ie9) .form-checkbox  {
	$checkboxHeight: 26px;
	$borderWidth: 1px;
	position: relative;
	width: $checkboxHeight;
	height: $checkboxHeight;
	margin: 0 8px $margin 0;
	input[type="checkbox"] {
		visibility: hidden;
		&:checked + label:after, &.checked + label:after {
			content: '';
			font-family: sans-serif;
			text-align: center;
			position: absolute;
			display: block;
			margin: 0;
			top: 0; left: 0;
			width: $checkboxHeight - ($borderWidth*2); height: $checkboxHeight - ($borderWidth*2);
			background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 39.6 29.7" fill="currentColor"> <title>check</title> <path d="M9.86,27.31l2.83,2.83L39.56,3.27,36.73.44ZM0,17.41l9.9,9.9,2.83-2.83-9.9-9.9Z" transform="translate(0.04 -0.44)"/> </svg>');
			background-repeat: no-repeat;
			background-position: 3px 3px;
			background-size: 20px;
		}
	}
	label {
		position: absolute;
		top: 4px; left: 0;
		display: block;
		padding: 0 5px;
		width: $checkboxHeight;
		height: $checkboxHeight;
		background: transparent;
		border: $borderWidth solid $borderColor;
		border-radius: $default-border-radius;
		cursor: pointer;
		overflow: hidden;
	}
	&.error {
		label {
			border-color: $alertColor;
		}
	}
}
.form-checkbox__label {
	padding: 5px 0;
	cursor: pointer;
}
// Radio
html:not(.lt-ie9) .form-radio  {
	$radioHeight: 26px;
	$borderWidth: 1px;
	position: relative;
	width: $radioHeight;
	height: $radioHeight;
	margin: 0 8px $margin 0;
	input[type="radio"] {
		visibility: hidden;
		&:checked + label:after, &.checked + label:after {
			content: '';
			position: absolute;
			display: block;
			margin: 0;
			top: 0;
			left: 0;
			width: $radioHeight/2;
			height: $radioHeight/2;
			background: $mainColor;
			border-radius: 50%;
			top:50%;
			left:50%;
			transform:translateX(-50%) translateY(-50%);
		}
	}
	label {
		position: absolute;
		top: 4px; left: 0;
		display: block;
		padding: 0 5px;
		width: $radioHeight;
		height: $radioHeight;
		background: transparent;
		border-radius: 50%;
		border: $borderWidth solid $borderColor;
		cursor: pointer;
		overflow: hidden;
	}
	&.error {
		label {
			border-color: $alertColor;
		}
	}
}
.form-radio__label {
	padding: 5px 0;
	cursor: pointer;
}

// File upload
.input--file {}
.input__file {
	width: 0.1px; height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}
.input__file-label {
	@extend .button;
}



// WEBPACK FOOTER //
// ./scss/components/_forms.scss