.user-profile {
	font-size: 14px;
	line-height: 14px;
	display: grid !important;
	grid-template-columns: auto 1fr;
	grid-gap: 3px;
	padding: 4px 3px 2px 0;
	border-radius: var(--border-radius);
	margin-right: 2px;
}
.user-profile:hover {
	background: var(--color-light);
}
.user-profile .avatar {
	width: 26px;
	position: relative;
	margin-right: 1px;
}
.user-profile .avatar img {
	height: 28px;
	position: absolute;
	top: -8px;
	border-radius: 50%;
	width: 28px;
	object-fit: cover;
	transform: scale(1);
	-webkit-transition: transform 0.5s, border 0.5s;
	-moz-transition: transform 0.5s, border 0.5s;
	-ms-transition: transform 0.5s, border 0.5s;
	-o-transition: transform 0.5s, border 0.5s;
	transition: transform 0.5s, border 0.5s;
	border: 2px solid transparent;
}
.user-profile:hover .avatar img {
	transform: scale(1.1);
	border: 2px solid var(--color);
}
.user-profile .author .username {
	color: var(--color) !important;
	position: relative;
	font-weight: 500;
}
.user-profile .author .author_name {
	font-weight: 600;
}
.user-profile .author .flag {
	font-weight: 500;
	background: var(--red);
	color: white;
	border-radius: var(--border-radius);
	padding: 0 4px;
	margin-right: 4px;
}
.user-profile .author .badges {
	display: inline-block;
}
.user-profile .author .badges li {
	width: 14px;
	display: inline-block;
	position: relative;
	margin: 0 2px;
}
.user-profile .author .badges li:first-of-type {
	margin-left: 3px;
}
.user-profile .author .badges li:last-of-type {
	margin-right: 3px;
}
.user-profile .author .badges img {
	width: 14px;
	height: 14px;
	position: absolute;
	top: -12px;
}
.user-profile .author .badges .tooltip {
	width: 72px;
	left: -29px;
	bottom: 15px;
}
.user-profile .author .badges li:hover .tooltip {
	visibility: visible;
	opacity: 1;
}
@media all and (max-width: 720px) {
	.user-profile {
		display: inline-block !important;
	}
	.user-profile .author {
		padding-left: 30px;
	}
}