/*
  We include some minimal custom CSS to make the playlist UI look good
  in this context.
*/

body {
  font-family: Arial, sans-serif;
  background: #000000e0;   
}

.info {
  background-color: #eee;
  border: thin solid #333;
  border-radius: 3px;
  margin: 0 0 20px;
  padding: 0 5px;
  width: 1200px;
}

.player-container {
  background: #1a1a1a;
  overflow: auto;
  width: 1210px;
  margin: 0 0 20px;
}

.video-js {
  float: left;
}

.vjs-playlist-vertical .vjs-playlist-thumbnail-placeholder {
    height: 55px;
}

.vjs-playlist .vjs-playlist-duration {
    right: 0.5rem;
    left: auto;
}
.vjs-playlist .vjs-playlist-now-playing-text {
    margin: 0.2rem;
    font-size: 0.8em;
}

.vjs-playlist,
.my-custom-class,
#my-custom-element {
  float: left;
  width: 200px;
}

.vjs-playlist.vjs-playlist-horizontal {
  float: none;
  height: 120px;
  width: 800px;
}