/* AVATAR */
.avatar {
	position:relative;
	margin:0 auto;

	width:74px;
	height:105px;

	background:url("/img/avatar-blank.png");
	background-size:cover;
}
.avatar .eye-left,
.avatar .eye-right {
	position:absolute;
	width:8px;
	height:8px;

	background:url("/img/avatar-eyes.png");
	background-size:cover;
}
.avatar .eye-left {
	top:49px;
	left:26px;
	background-position-x:0;
}
.avatar .eye-right {
	top:50px;
	left:52px;
	background-position-x:-8px;
}

.avatar .blink-left,
.avatar .blink-right {
	position:absolute;
	width:12px;
	height:4px;
	top:52px;

	display:none;
	background-image:url("/img/avatar-blinks.png");
	background-size:cover;
}
.avatar .blink-left {
	left:25px;
}
.avatar .blink-right {
	background-position-y:-4px;
	right:12px;
}

.avatar.blinking:not(.dead) .blink-left,
.avatar.blinking:not(.dead) .blink-right {
	display:block;
}
.avatar.blinking:not(.dead) .eye-left,
.avatar.blinking:not(.dead) .eye-right {
	display:none;
}

.avatar.dead .eye-left,
.avatar.dead .eye-right {
	background-position-x:-40px;
}

.avatar.awe .eye-left {
	background-position-x:-16px;
	animation: rotate 2s linear infinite;
}
.avatar.awe .eye-right {
	background-position-x:-24px;
	animation: rotate 2s linear infinite;
}

.avatar.love .eye-left,
.avatar.love .eye-right {
	background-position-x:-32px;
}

.avatar .mouth {
	position:absolute;
	top:76px;
	left:30px;

	width:24px;
	height:10px;

	background:url("/img/avatar-mouths.png");
	background-position-y:0;
	background-size:cover;
}

.avatar .mouth.neutral {
	background-position-y:-10px;
}
.avatar .mouth.serious {
	background-position-y:-20px;
}
.avatar .mouth.sad {
	background-position-y:-30px;
}
.avatar .mouth.dead {
	background-position-y:-40px;
}
.avatar .mouth.awe {
	background-position-y:-50px;
}
.avatar .mouth.silly {
	background-position-y:-60px;
}