.video-container {
	position: relative;
	width: 100%;
	padding-bottom: 56.25%;
	margin-bottom: 20px;
}

.thumbnail, .video-frame {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.thumbnail {
	cursor: pointer;
}

.video-frame {
	display: none;
}

input[type="checkbox"] {
	display: none; /* Verstecke das Checkbox-Element */
}

/* Verstecke das Video, wenn das Vorschaubild angezeigt wird */
input[type="checkbox"]:not(:checked) + .video-container .video-frame {
	display: none;
}

/* Zeige das Video, wenn das Vorschaubild angeklickt wurde */
input[type="checkbox"]:checked + .video-container .video-frame {
	display: block;
}

/* Verstecke das Vorschaubild, wenn das Video angezeigt wird */
input[type="checkbox"]:checked + .video-container .thumbnail {
	display: none;
}