@media (min-width: 768px) {
	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="number"],
	input[type="tel"] {
		display: inline-block
	}

	input[type="text"].unit,
	input[type="text"].unitLong,
	input[type="text"].unitMedium {
		margin-right: 3px;
		display: inline-block
	}

	input[type="text"].unit {
		max-width: calc(100% - 20px)
	}

	input[type="text"].unitMedium {
		max-width: calc(100% - 40px)
	}

	input[type="text"].unitLong {
		max-width: calc(100% - 60px)
	}
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

::-ms-expand {
	opacity: 0;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="date"] {
	padding: 5px;
	margin-right: 5px;
	max-width: 100%;
	vertical-align: middle;
	line-height: 100%;
	border: 1px solid #eee;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	background-color: #fff;
	color: #555;
	-webkit-appearance: none;
	appearance: none;
}

input:last-of-type {
	margin-right: 0
}

input[type="text"]:required,
input[type="password"]:required,
input[type="email"]:required,
input[type="number"]:required,
input[type="tel"]:required {
	border-color: rgba(244, 68, 85, .25);
}

input[type="text"]:required:valid,
input[type="password"]:required:valid,
input[type="email"]:required:valid,
input[type="number"]:required:valid,
input[type="tel"]:required:valid,
input[type="text"].valid:read-only:required,
input[type="password"].valid:read-only:required,
input[type="email"].valid:read-only:required,
input[type="number"].valid:read-only:required,
input[type="tel"].valid:read-only:required {
	border-color: #ddd;
}

:focus {
	border-color: #2c89e9;
	outline: 0
}

input[type="text"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder,
input[type="number"]::-webkit-input-placeholder,
input[type="tel"]::-webkit-input-placeholder {
	color: #999
}

:disabled {
	background-color: #eee;
	opacity: 1;
	cursor: not-allowed
}

input[type="text"]:read-only,
input[type="password"]:read-only,
input[type="email"]:read-only,
input[type="number"]:read-only,
input[type="tel"]:read-only,
input[type="text"].datepicker {
	background-color: #f7f7f7;
	border-color: #eee;
}

input[type="text"].datepicker {
	margin-right: 5px;
}

input[type="checkbox"],
input[type="radio"] {
	display: none;
}

input[type="checkbox"] + label,
input[type="radio"] + label {
	margin: 0 15px 0 0;
	cursor: pointer;
	position: relative;
	display: inline-block;
	padding-left: 18px;
	min-height: 1.5em;
	vertical-align: middle;
}

input[type="checkbox"] + label.noLabel,
input[type="radio"] + label.noLabel {
	margin: 0;
	padding-left: 14px;
}

input[type="checkbox"] + label:before,
input[type="radio"] + label:before {
	content: '';
	width: 14px;
	height: 14px;
	cursor: pointer;
	background-color: #eee;
	border: 1px solid #ddd;
	position: absolute;
	top: 2px;
	left: 0;
}

input[type="checkbox"] + label.noLabel:before,
input[type="radio"] + label.noLabel:before {
	margin: 0;
}

input[type="checkbox"] + label:before {
	border-radius: 2px;
}

input[type="radio"] + label:before {
	border-radius: 50%;
}

input[type="radio"]:checked + label:before {
	background-color: #fff;
	border: 1px solid #2c89e9;
}

input[type="radio"]:checked + label:after {
	content: '';
	width: 4px;
	height: 4px;
	position: absolute;
	left: 5px;
	top: 7px;
	border-radius: 2px;
	background-color: #2c89e9;
}

input[type="checkbox"]:checked + label:before {
	background-color: #fff;
	border: 1px solid #2c89e9;
}

input[type="checkbox"]:checked + label:after {
	content: '';
	width: 8px;
	height: 5px;
	border-left: 1px solid #2c89e9;
	border-bottom: 1px solid #2c89e9;
	position: absolute;
	left: 3px;
	top: 5px;
	transform: rotate(-45deg);
}

fieldset,
legend {
	padding: 0;
	border: 0
}

fieldset {
	min-width: 0;
	margin: 0
}

select {
	padding: 5px 25px 5px 5px;
	margin-right: 5px;
	max-width: 100%;
	line-height: 100%;
	border: 1px solid #eee;
	border-radius: 3px;
	color: #555;
	-webkit-appearance: none;
	appearance: none;
	background: #f7f7f7 url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23555' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .7rem center/8px 10px;
}

select[multiple],
select[size] {
	height: auto
}

select.day,
select.hour {
	min-width: inherit;
}

textarea {
	height: auto;
	width: 100%;
	padding: 10px;
	vertical-align: middle;
	border: 1px solid #ddd;
	background-color: #fff;
	color: #555;
	-webkit-appearance: none;
	appearance: none;
}

input[type=file] {
	width: 200px;
}

input[type=checkbox]:focus,
input[type=file]:focus,
input[type=radio]:focus {
	outline: -webkit-focus-ring-color auto 5px;
	outline-offset: -2px
}

ul.selectLayer {
	display: none;
	position: absolute;
	border-top: 1px solid #eee;
	background-color: #fff;
	padding: 0
}

ul.selectLayer li {
	list-style: none;
	padding: 10px;
	border-left: 1px solid #eee;
	border-right: 1px solid #eee;
	border-bottom: 1px solid #eee;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

ul.selectLayer li:hover {
	background-color: rgba(44, 137, 233, 0.1);
}

ul.selectLayer li .delete {
	border: 1px solid #ddd;
	border-radius: 3px;
	padding: 0 5px;
}

input:disabled + label {
	color: #ddd;
}
