.popue-dialog {
	position: relative;
	top: -7.5rem;
	left: -11.5rem;
	width: 0;
}

.popue-dialog > .content {
	transition: visibility 0.5s linear, opacity 0.5s ease;
	width: 20rem;
	height: 5rem;
	position: absolute;
	background-color: white;
	padding: 0.1rem;
	border-radius: 1rem;
}

.popue-dialog > .content > * {
	display: inline-block;
	height: 1.5rem;
	color: black;
	text-shadow: none;
	font-kerning: none;
}

.popue-dialog > .content > .arrow {
	width: 2.5rem;
	height: 1.5rem;
	background-color: white;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	position: absolute;
	top: 4.4rem;
	left: 8.5rem;
}

.popue-button:hover > .popue-dialog > .content {
        visibility: visible;
        opacity: 0.8;
}
.popue-button:not(:hover) > .popue-dialog > .content {
        visibility: hidden;
        opacity: 0;
}