*{
	margin: 0;
	padding: 0;
}
body {
	background: #FFFFFA;
}

.ir-arriba{
	display: none;
	padding: 20px;
	color: #ADADAD;
	font-size: 35px;
	cursor:pointer;
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 20;
}


.video-thumbnail-container {
    position: relative; /* Essential for positioning the overlay */
    display: inline-block; /* Adjusts the container's width to its content */
    cursor: pointer; /* Indicates it's clickable */
}

.video-thumbnail-container img {
	filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.2));

}

.play-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Centers the icon */
    color: rgba(255, 255, 255, 0.8); /* White with some transparency */
    padding: 10px;
    opacity: 0; /* Initially hidden */
    transition: opacity 0.3s ease; /* Smooth fade-in effect */
    pointer-events: none; /* Allows clicks to pass through to the button */
}

.video-thumbnail-container:hover .play-overlay {
    opacity: 1; /* Shows the icon on hover */
}

.anim-button {
	background-color: none;
	border: none; /* No border */
}

.anim-button:hover .video-thumbnail-container img  {
	transform: scale(1.01); /* Agranda la imagen un 5% */
    transition: transform 0.3s ease-in-out; /* Transición suave */
}