@mixin make-custom-select() {
	display: inline-block;
	max-width: 100%;
	$select-border-width: ($border-width * 2);
	height: 45px;
	padding: $custom-select-padding-y ($custom-select-padding-x + $custom-select-indicator-padding) $custom-select-padding-y $custom-select-padding-x;
	line-height: $custom-select-line-height;
	color: $custom-select-color;
	vertical-align: middle;
	background: $custom-select-bg $custom-select-indicator no-repeat right $custom-select-padding-x center;
	background-size: $custom-select-bg-size;
	border: $custom-select-border-width solid $custom-select-border-color;
	@include border-radius($custom-select-border-radius);
	// Use vendor prefixes as `appearance` isn't part of the CSS spec.
	-moz-appearance: none;
	-webkit-appearance: none;

	&:focus {
		border-color: $custom-select-focus-border-color;
		outline: none;
		@include box-shadow($custom-select-focus-box-shadow);

		&::-ms-value {
			// For visual consistency with other platforms/browsers,
			// supress the default white text on blue background highlight given to
			// the selected option text when the (still closed) <select> receives focus
			// in IE and (under certain conditions) Edge.
			// See https://github.com/twbs/bootstrap/issues/19398.
			color: $input-color;
			background-color: $input-bg;
		}
	}

	&:disabled {
		color: $custom-select-disabled-color;
		cursor: $cursor-disabled;
		background-color: $custom-select-disabled-bg;
	}

	// Hides the default caret in IE11
	&::-ms-expand {
		opacity: 0;
	}
}