.avatar{
	position: relative;
	float: right;
	right: 24px; //forze para alinearlo :(
	height: 48px;
	width: 48px;

	cursor:pointer;
	margin-right: 0px !important;
	border-radius: 50%;
	background-image:  url('./img/pic/person.svg');

	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: $c-pd;
	border: 2px solid $c-surface;
	z-index: 2;


	&:hover   { @include bs-2;         }
	//&:active  { transform:scale(0.95); }
	@include transition(.150s, emph);
	@include back-visivility();

	//border: 0.5px solid red;               //←←←←←←←←←←←←←←←←←←←←

	& .title {
		position: relative;
		display: inline-block;
		width: 100%;
		text-align: center;
		top: 8px;
		@include font(h6, $c-w);
		//border: 0.5px solid red;               //←←←←←←←←←←←←←←←←←←←←
	}

	& .status{
		position: absolute;
		display: inline-block;
		bottom: -4px;
		right: -10px;
		width: 20px;
		height: 20px;
		border-radius: 50%;
		opacity: 1;

		background-position: center;
		background-repeat: no-repeat;
		background-size: 71%;
		@include selectNo;

		border: 2px solid $c-surface;               //←←←←←←←←←←←←←←←←←←←←

	}

	//border: 2px solid $c-w;               //←←←←←←←←←←←←←←←←←←←←

}