#media-info {
	margin-left: 10px;
}

#media-info>svg {
	width: 30px;
	height: 30px;
	cursor: pointer;
	transform: translateY(8px);
}

#media-info>svg>path {
	fill: grey;
}

#media-info>svg:hover path {
	fill: var(--rojo-ssreyes);
}

.tooltip-container {
	position: relative;
	display: inline-block;
}

.media-info-tooltip-text {
	visibility: hidden;
	width: 250px;
	background-color: grey;
	color: #fff;
	text-align: left;
	border-radius: 4px;
	padding: 5px 8px;
	position: absolute;
	z-index: 1;
	bottom: 120%;
	left: 50%;
	transform: translateX(-50%);
	opacity: 0;
	transition: opacity 0.3s;
	font-size: 13px;
}

.tooltip-container:hover .media-info-tooltip-text {
	visibility: visible;
	opacity: 1;
}