:root {
  --borderSize: 9.25%;
  --contentWidth: calc(100% - 2 * var(--borderSize));
  --videoHeight: 82vh;

  --light-text-color: rgb(223, 220, 215);
  --medium-text-color: rgb(202, 197, 190);
  --dark-text-color: rgb(152, 144, 130);
  --link-hover-color: rgb(90, 175, 237);
}
* {
	scrollbar-color: #202324 #454a4d;
}
body {
	color: var(--light-text-color);
	background: #181a1b;
}
nav {
	width: var(--contentWidth);
	left: var(--borderSize);

	text-indent: 0px;
	margin-top: 16px;

	background: transparent;
	border-bottom: hidden;

	font-size: 17px;
	color: var(--light-text-color);
}
nav a.centered {
  position: absolute;
  top: 0px;
  left: auto;
  right: 0px;
  transform: none;

  font-weight: 100;
}
main {
	width: var(--contentWidth);

	margin-top: 16px;
}
#myTopnav {
    display: none;
}
#player {
	width: 100%;
}
#video {
	height: var(--videoHeight);
}
#player > h1 {
	margin-top: 17px;
	
	font-size: 200%;
	font-weight: 700;
	color: var(--light-text-color);
}
#player > h2 {
	margin-top: 22px;

	font-size: 105%;
	color: var(--dark-text-color);
}
#playlist {
	position: relative;
	left: 81.5vw;
	display: block;
	
	width: 16vw;
	height:  300vh;
	margin-top: -10px;
	margin-left: calc(-16vw - 14px); /* width + 14px scrollbar */

	background: transparent;
	box-shadow: none;
}
#playlist > a > img {
	width: 14vw;
}
#playlist > a > div {
	position: relative;
	top: 10px;
	right: 0px;
	bottom: 0px;
	left: 0px;

	margin-bottom: 10px;
}
/* video title */
#playlist > a > div > h1 {
	font-size: 120%;
	color: var(--medium-text-color);
}
/* video infos */
#playlist > a > div > h2 {
	margin-top: 10px;

	font-size: 100%;
	color: var(--dark-text-color);
}
#playlist > a.playing {
	background: #202324;
}
/* video list */
.nav ul {
	background: transparent;
}
/* buttons on top of video list */
.nav a {
	background-color: transparent;
	color: var(--dark-text-color);
}
.nav a:hover {
	background-color: transparent;
	color: var(--link-hover-color);
}
.nav a.active {
	background-color: transparent;
	color: var(--light-text-color);
}
footer {
  position: relative;
  display: block;
  
  background: transparent;
}