/*!
Developed by Web+apps Para Emprendedores
@author: Oscar Alderete <consultas.wpe@gmail.com>
@website: https://wpe.oscaralderete.com
*/

.wpe_video-redirector {
	--font-family: Arial, Helvetica, sans-serif;
	--bg-color: teal;
	--color: #fff;

	background-color: var(--bg-color);
	font-family: var(--font-family);
	color: var(--color);


	.wpe-video {
		position: relative;
		z-index: 0;

		>div {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath fill-opacity='.6' d='M64 320C64 178.6 178.6 64 320 64C461.4 64 576 178.6 576 320C576 461.4 461.4 576 320 576C178.6 576 64 461.4 64 320zM252.3 211.1C244.7 215.3 240 223.4 240 232L240 408C240 416.7 244.7 424.7 252.3 428.9C259.9 433.1 269.1 433 276.6 428.4L420.6 340.4C427.7 336 432.1 328.3 432.1 319.9C432.1 311.5 427.7 303.8 420.6 299.4L276.6 211.4C269.2 206.9 259.9 206.7 252.3 210.9z'/%3E%3C/svg%3E") center center no-repeat rgba(0, 0, 0, 0);
			background-size: 6em auto;
			cursor: pointer;
			z-index: 90000;

			&.playing {
				background-image: none;

				&:hover {
					background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath fill-opacity='.6' d='M176 96C149.5 96 128 117.5 128 144L128 496C128 522.5 149.5 544 176 544L240 544C266.5 544 288 522.5 288 496L288 144C288 117.5 266.5 96 240 96L176 96zM400 96C373.5 96 352 117.5 352 144L352 496C352 522.5 373.5 544 400 544L464 544C490.5 544 512 522.5 512 496L512 144C512 117.5 490.5 96 464 96L400 96z'/%3E%3C/svg%3E");
				}
			}
		}
	}
}

/* progress bar */
.wpe_progress-bar {
	width: 100%;
	height: 6px;
	margin-top: 0 !important;
	background: green;
	position: relative;
	bottom: 0;
	left: 0;
}

.wpe_progress-bar-fill {
	width: 0%;
	height: 100%;
	background: #ff3c3c;
	/* red or any accent color */
	transition: width 0.2s ease;
}