When you have a page full of Youtube videos, they will take a while to load and leave an empty space. To offer a better experience to your visitors, let's create a spinner (loading dots in this case) that will show if the video hasn't loaded yet and also give it a background color to make it clear that there will be something in that space.

Copy the code below and paste it into a Stylesheet inside Oxygen. It will automatically work for all videos added with Oxygen video module:

/* Spinner while video loads */
.ct-video {
    background-color: rgb(220 220 220 / 50%);
    position: relative;
}
.ct-video .oxygen-vsb-responsive-video-wrapper {
    z-index: 1;
}

/* loading dots */

.ct-video:after {
	content: " .";
	animation: dots 1s steps(5, end) infinite;
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 50px;
	transform: translate(-50%,-50%);
}

@keyframes dots {
	0%,
	20% {
		color: rgba(0, 0, 0, 0);
		text-shadow: 0.25em 0 0 rgba(0, 0, 0, 0), 0.5em 0 0 rgba(0, 0, 0, 0);
	}
	40% {
		color: #373a3c;
		text-shadow: 0.25em 0 0 rgba(0, 0, 0, 0), 0.5em 0 0 rgba(0, 0, 0, 0);
	}
	60% {
		text-shadow: 0.25em 0 0 #373a3c, 0.5em 0 0 rgba(0, 0, 0, 0);
	}
	80%,
	100% {
		text-shadow: 0.25em 0 0 #373a3c, 0.5em 0 0 #373a3c;
	}
}

Result: