.vidbg-container {
	position: absolute;
	z-index: -1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	background-color: #020202;
}

.vidbg-container.vidbg-loading {
	animation: vidbgpulse 1.5s infinite
}

.vidbg-container video {
	position: absolute;
	margin: 0;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: 0.25s opacity ease-in-out;
	max-width: none;
	opacity: 0
}

@keyframes vidbgpulse {
	0% {
		filter: grayscale(0%)
	}
	50% {
		filter: grayscale(50%)
	}
	100% {
		filter: grayscale(0%)
	}
}

.vidbg-container iframe {
	position: absolute;
	width: 100%;
	height: 100%;
	max-width: none;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	transition: 0.25s opacity ease-in-out
}

.vidbg-overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-image: repeating-linear-gradient(0deg, #00000000 0 1px, #0000007A 1px 4px); /* add a CRT effect */
}

.vidbg-end-frame {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	transition: opacity 0.25s ease-in-out;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center
}

.vidbg-frontend-buttons {
	display: inline-flex;
	position: absolute;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	opacity: 0;
	transition: 0.25s opacity ease-in-out
}

.vidbg-frontend-buttons.top-right {
	top: 0;
	right: 0;
	left: auto;
	bottom: auto
}

.vidbg-frontend-buttons.top-left {
	top: 0;
	right: auto;
	bottom: auto;
	left: 0
}

.vidbg-frontend-buttons.bottom-right {
	top: auto;
	right: 0;
	bottom: 0;
	left: auto
}

.vidbg-frontend-buttons.bottom-left {
	top: auto;
	right: auto;
	bottom: 0;
	left: 0
}

.vidbg-frontend-buttons a.vidbg-frontend-button {
	cursor: pointer;
	display: block;
	box-shadow: none;
	width: 28px;
	height: 28px;
	background-color: rgba(255, 255, 255, 0.5)
}