.filterpopup {
	direction: rtl;
	font-size: 0.8rem;
}

	.filterpopup .selectdiv {
		width: calc(50% - 4em);
	}

	.filterpopup > .selectedfilters {
		margin-top: 5px;
		background-color: #eee;
		border: 3px dashed #999;
		min-height: 100px;
		text-align: center;
		display: flex;
		justify-content: flex-start;
		align-content: flex-start;
		flex-wrap: wrap;
		padding: 5px;
	}

		.filterpopup > .selectedfilters:empty:before {
			content: attr(placeholder);
			position: relative;
			font-size: 2rem;
			width: 100%;
			text-align: center;
			color: #bbb;
		}

.selectedfilters div {
	transition: all 0.5s;
	display: inline-block;
	border: 1px solid #beb;
	border-radius: 2px;
	padding: 2px 5px;
	background-color: #efe;
	margin: 1px 1px;
	cursor: pointer;
	height: 2rem;
	line-height: 2rem;
	font-size: 0.8rem;
	position: relative;
}

	.selectedfilters div:before {
		transition: all 0.5s;
		content: "\f057";
		font: 900 normal normal 1em/1 "Font Awesome 5 Free";
		color: #a99;
		top: -4px;
		right: -2px;
		position: absolute;
	}

	.selectedfilters div:hover:before {
		color: #d33;
	}

	.selectedfilters div:hover {
		background-color: #fee;
		border-color: #d33;
	}

	.selectedfilters div span:first-child {
		color: #090;
	}

	.selectedfilters div span:last-child {
		color: #990;
	}

.filterrow {
	display: block;
	font-size: 0.8rem;
	background-color: #eee;
	padding: 0 10px 0 0;
	/*border-top: 1px solid #aaa3;*/
	/*min-height: 1.6rem;*/
	/*display: none;*/
}

	.filterrow > .selectedfilters {
		/*display: flex;
		justify-content: flex-end;
		align-items: center;
		padding: 0 0 2px 2px;
		flex-wrap: wrap-reverse;*/
		transition: all 0.5s;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		padding: 0 0 2px 2px;
		flex-wrap: wrap;
		line-height: 2rem;
	}

		.filterrow > .selectedfilters div {
			/*background-color: #555;
			border-color: #222;*/
			background-color: #ddd;
			border-color: #bbb;
			line-height: 1.5rem;
			height: 1.8rem;
			direction: rtl;
			cursor: default;
		}

			.filterrow > .selectedfilters div:before {
				/*content: "\f410";
				top: -2px;
				right: -1px;
				color: #b33;*/
				content: "";
			}

			.filterrow > .selectedfilters div:hover:before {
				/*color: #e33;*/
			}

			.filterrow > .selectedfilters div:hover {
				/*background-color: #dcc;
				border-color: #bbb;*/
			}

			.filterrow > .selectedfilters div span:first-child {
				/*color: #dff;*/
				color: #333;
			}

			.filterrow > .selectedfilters div span:last-child {
				/*color: #ffd;*/
				color: #777;
			}

.showfilterbtn {
	transition: all 0.5s;
	/*margin: 0 3px;*/
	color: #aaa;
	/*float: left;*/
	cursor: pointer;
	font-size: 0.7rem;
	margin: 0 3px;
	/*direction: rtl;*/
}

	.showfilterbtn:hover {
		color: #555;
	}