/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 15 2026 | 08:44:16 */
/* ========================================= Video with overlay ======================================== */
.video-overlay-block {
	position: relative;
	
	.video-wrapper {
		position: relative; 
		display: inline-block; 
		max-width: 100%; 
		line-height: 0;
		
		.wp-block-video {
			margin-bottom: 0;
		}
		
		video {
			max-width: 100%;
		}

		.video-play-btn {
			position: absolute;
			z-index: 2;
			inset: 0; 
			margin: auto;
			width: 120px; 
			height: 120px;
			border: 0; padding: 0; 
			background: none; 
			cursor: pointer;
			transition: opacity .2s ease, transform .2s ease;
			
			&:hover { 
				transform: scale(1.06); 
			}
		}
		
		.video-expand-btn {
			position: absolute; 
			top: 12px; 
			right: 12px;
			width: 2rem; 
			height: 2rem; 
			z-index: 3;
			display: flex; 
			align-items: center; 
			justify-content: center;
			border: 0; 
			padding: 0; 
			cursor: pointer;
			background: rgba(0,0,0,.35); 
			border-radius: 6px;
			opacity: .85; 
			transition: opacity .2s ease, background .2s ease;
		}

		&.is-playing .video-play-btn { 
			opacity: 0; 
		}
	}
	
	.text-overlay {
		position: absolute;
		background-color: var(--green-dark-transparent-2);
		padding: 1rem 1.5rem;
		bottom: 6px;
		left: 0;
		right: 0;
		
		span {
			color: var(--white);
		}
	}
}