body {
  display: flex;
  font-family: Arial, sans-serif;
  font-size:11pt;
}

.video-list {
  width: 30%;
    max-width: 320px;
    border-right: 1px solid #ccc;
    padding: 10px;
    max-height: 100vh;       /* Limite la hauteur à celle de l'écran */
    overflow-y: auto;        /* Ajoute un scroll vertical si nécessaire */
    box-sizing: border-box;  /* Pour inclure le padding dans la hauteur */
}

.video-list ul {
  list-style: none;
  padding: 0;
}

.video-list li {
  margin-bottom: 10px;
  cursor: pointer;
  color: #003;
  text-decoration: none;
}
.video-list li:hover {
  margin-bottom: 10px;
  cursor: pointer;
  color: red;
  text-decoration: underline;
}

.video-list li em  {
  margin-bottom: 10px;
  cursor: pointer;
  color: #538;
  text-decoration: none;
}
 .video-list li em:hover  {
  margin-bottom: 10px;
  cursor: pointer;
  color: red;
  text-decoration: none;
}
.video-list li.titre {
      margin-left:-5px;
      margin-bottom: 10px;
      cursor: pointer;
      color: black;
      font-weight: 600;
      text-decoration: none;
 }

 .masquer{
   display: none;
 }

 .video-list li.nsfw{
   color:#888;
 }
  .video-list li em.nsfw{
    color:#888;
  }

#video-player {
  flex: 1;
  padding: 20px;
}

iframe {
  width: 100%;
  height: 500px;
  border: none;
}