/* Das label-Element */
.switch {
   /* Um im nächsten Schritt den runden Button mit position:absolute festzusetzen */
   position: relative;
   width: 64px;
   height: 34px;
   display: inline-block;
   margin-left: 40px;
}

/* Der graue Untergrund des Schalters */
.switch span {
   position: absolute;
   background-color: #4d5757;
   border-radius: 17px;
   cursor: pointer;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   transition: background-color .4s;
}

/* Der kreisrunde Button im Switch */
.switch span::before {
   background-color: white;
   border-radius: 50%;
   content: "";
   position: absolute;
   left: 4px;
   bottom: 4px;
   height: 26px;
   width: 26px;
}

input:checked+span {
   background-color: darkgreen;
}

input:checked+span::before {
   transform: translateX(30px);
}


.switch input {
   display: none;
}

/* //! YouTube Video ------------------- */
/* Der Container für das Video */
#video-container {
   position: relative;
   width: 80%;
   max-width: 800px;
   background: #000;
   padding-top: 56.25%;
   /* 16:9 Aspect Ratio */
}

#video-container iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}

/* Der Schließen-Button */
.close-btn {
   position: absolute;
   top: -40px;
   right: 0;
   color: white;
   font-size: 30px;
   cursor: pointer;
   background: none;
   border: none;
}