@keyframes talk {
	0% {content: url(ivan-idle.png);}
	50% {content: url(ivan-idle2.png);}
	100% {content: url(ivan-idle.png);}
}
@keyframes pride {
	0% {content: url(ivan-pride.png);}
	50% {content: url(ivan-pride2.png);}
	100% {content: url(ivan-pride.png);}
}
@keyframes shy {
	0% {content: url(ivan-shy.png);}
	50% {content: url(ivan-shy2.png);}
	100% {content: url(ivan-shy.png);}
}
@keyframes init {
	0% {content: url(ivan-shy.png);}
	15% {content: url(ivan-shy2.png);}
	30% {content: url(ivan-pride.png);}
	45% {content: url(ivan-pride2.png);}
	60% {content: url(ivan-idle2.png);}
	100% {content: url(ivan-idle.png);}
}
#dragonivan {
	animation-fill-mode: forwards;
	animation-name: init;
	animation-duration: 0.2s;
	animation-iteration-count: 1;
}

@keyframes bubble_show {
	25% {opacity: 0};
	100% {opacity: 1};
}

@keyframes bubble_hide {
	0% {opacity: 1};
	25% {opacity: 1};
	100% {opacity: 0};
}

#bubble {
	opacity: 0;
	animation-fill-mode: forwards;
	animation-duration: 0.2s;
	animation-iteration-count: 0;
}
#bubble-text {
	opacity: 0;
	animation-fill-mode: forwards;
	animation-duration: 0.2s;
	animation-iteration-count: 0;
	position: relative;
	display: block;
	bottom: -35%;
	left: 20%;
	z-index: 10;
	text-wrap: wrap;
	max-width: 37.5%;
	font-size: max(min(2.5vh, 18.75px), 8.25px);
}