label.myselect {
	position				: relative;
}
label.myselect:before {
	content					: '';
	right					: 2px; 
	top						: 3px;
	width					: 18px; 
	height					: 18px;
	background				: #f8f8f8;
	position				: absolute;
	pointer-events			: none;
	display					: block;
	border-radius			: 3px;
}
label.myselect:after {
	content					: '<>';
	font					: 14px "Consolas", monospace;
	color					: #aaa;
	-webkit-transform		: rotate(90deg);
	-moz-transform			: rotate(90deg);
	-ms-transform			: rotate(90deg);
	transform				: rotate(90deg);
	right					: 3px; 
	top						: 2px;
	padding					: 0 0 2px;
	border-bottom			: 1px solid #ddd;
	position				: absolute;
	pointer-events			: none;
}

select.myselect {
	padding-right			: 24px;
	margin					: 0;
	border					: none;
	outline					: none;
	display					: inline-block;
	-webkit-appearance		: none;
	-moz-appearance			: none;
	appearance				: none;
	cursor					: pointer;
}
select.myselect::-ms-expand {		/* This is required to remove the default dropdown arrow in IE10 */
	display					: none;
}

/* Targetting Webkit browsers only. FF will show the dropdown arrow with so much padding. */
@media screen and ( -webkit-min-device-pixel-ratio:0 ) {
	select.myselect { 
		padding-right		: 24px;
	}
}