:root {
    --background-border-color: #3131445c !important;
}
.account__avatar, .account__avatar img {
    border-radius: 100% !important;
}

/* Noël */
/* Flocon sur la div avatar */
.account__avatar {
	position: relative;
	overflow: hidden;
}

.account__avatar::before {
	content: "❄️";
	position: absolute;
	top: -10px;
	left: 10%;
	font-size: 6px;
	animation: fall1 4s linear infinite;
	pointer-events: none;
}

.account__avatar::after {
	content: "❄️";
	position: absolute;
	top: -15px;
	left: 50%;
	font-size: 8px;
	animation: fall2 5s linear infinite;
	pointer-events: none;
}

/* Flocon sur le wrapper pour le 3ème */
.account__display-name{
        position: relative;
}
.account__avatar-wrapper::before, .account__avatar-overlay-base::before {
	content: "❄️";
	position: absolute;
	top: -10px;
	left: 0;
	font-size: 7px;
	animation: fall3 4.5s linear infinite;
	pointer-events: none;
}

/* Animations */
@keyframes fall1 {
	0%   { transform: translateY(0) translateX(0); opacity: 1; }
	50%  { transform: translateY(50px) translateX(5px); opacity: 0.8; }
	100% { transform: translateY(100px) translateX(-5px); opacity: 0; }
}

@keyframes fall2 {
	0%   { transform: translateY(0) translateX(0); opacity: 1; }
	50%  { transform: translateY(60px) translateX(-5px); opacity: 0.7; }
	100% { transform: translateY(120px) translateX(5px); opacity: 0; }
}

@keyframes fall3 {
	0%   { transform: translateY(0) translateX(0); opacity: 1; }
	50%  { transform: translateY(40px) translateX(7px); opacity: 0.9; }
	100% { transform: translateY(80px) translateX(-7px); opacity: 0; }
}