.select {
	font-family: inherit;
	font-size: inherit;

	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;

	position: relative;
	padding: 12px 40px 12px 16px;
	border-radius: 4px;
	border: 1px solid var(--input-border-color);
	background-color: var(--input-background-color);
	cursor: pointer;

	background-image: linear-gradient(45deg, transparent 50%, var(--select-arrow-color) 50%), linear-gradient(135deg, var(--select-arrow-color) 50%, transparent 50%), linear-gradient(to right, transparent, transparent);
	background-position:
		calc(100% - 20px) center,
		calc(100% - 14px) center,
		calc(100% - 40px) 0.5em;
	background-size:
		6px 6px,
		6px 6px,
		1px 1.5em;
	background-repeat: no-repeat;
}

.select::-ms-expand {
	display: none;
}
