.select {
	position: relative;
	/*max-width: 200px;*/
	outline: none
}


/*.select:focus {
	background-color: #ffff3a;
}*/

.select .title-bar {
	background-color: var(--primary_color);
	display: flex;
	flex-shrink: 0;
}

.select .title-bar .title {
	padding: 1.6rem .8rem;
	font-size: 2.4rem;
	line-height: 3.6rem;
	color: var(--inverse_text_color);
	flex-grow: 1;
}

.select .title-bar .close {
	padding: 1.6rem;
	font-size: 2.4rem;
	line-height: 3.6rem;
	color: var(--inverse_text_color);
	display: flex;
	align-items: center;
	text-decoration: none;
}

.select .title-bar .close:hover,
.select .title-bar .close:focus {
	background-color: var(--primary_color_darker);
}

.select .title-bar .close .material-icons {
	font-size: 2.4rem;
	color: var(--inverse_text_color);
}

.select .value {
	display: block;
	position: relative;
	cursor: pointer;
	overflow-x: hidden;
	white-space: nowrap
}

.select .list .filter input {
	background-color: #ffff3a !important;
}

.select .list {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 64.0rem;
	max-width: 90%;
	max-height: 90%;
	outline: none;
	overflow: hidden;
	-webkit-box-shadow: 0px 2px 9px rgba(0, 0, 0, 0.35);
	box-shadow: 0px 2px 9px rgba(0, 0, 0, 0.35);
	background: #fff;
	transform: translate(-50%, -50%);
	display: flex;
	flex-direction: column;
}

.select .list .filter {
	display: none;
}

.select .list .filter input {
	width: 100%;
	height: auto !important;
	border: none;
	outline: none;
	margin: 0;
	padding: 1.6rem 0.8rem !important;
	font-size: 2.4rem !important;
}

.select .list ul {
	display: block;
	margin: 0;
	padding: 0;
	background: #fff;
	/*margin-top: 2px;*/
	outline: none;
	/*border-bottom: 1px solid #ccc;*/
}

.select .list ul li {
	display: block;
	list-style: none;
	padding: .8rem .8rem;
	cursor: pointer;
	outline: none;
}

.select .list ul li:hover,
.select .list ul li.hovered {
	color: #fff;
	background: var(--primary_color);
}

.select.large .filter {
	display: block
}

.select.large .list .ul-wrapper {
	overflow-y: auto;
	-webkit-overflow-scrolling:touch;
	outline: none;
}

.list-wrapper {
	position: fixed;
	opacity: 0;
	pointer-events: none;
	top: 0;
	left: 0;
	width: 100vw;
	height: 0;
	background: rgba(0,0,0,0.5);
	z-index: 500;
	-webkit-transition: opacity, transform 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
	transition: opacity, transform 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
	transform: scale(1.05);
	overflow: hidden;
}

.list-wrapper.visible {
	height: 100vh;
	pointer-events: auto;
	opacity: 1;
	transform: scale(1);
}

.select .list ul li.disabled {
	background-color: #eee;
	color: #999;
	pointer-events: none;
}