/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background:#272727;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background:#f3f3f3;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background:#f3f3f3;
}

#credits{
	padding:20px;
	text-align:center;
	width:calc(100% - 40px);
}

#credits span{
	color:#f3f3f3;
	display:inline-block;
	font-family:"sf_movie_poster_condensedRg", sans-serif;
	font-size:48px;
	line-height:40px;
	margin:auto;
	max-width:100%;
	width:960px;
}

#editors-note{
	display:inline-block;
	left:0;
	text-align:center;
	width:100%;
	position:relative;
	top:0;
}

#editors-note h3{
	background:#272727;
	color:#f3f3f3;
	left:50%;
	margin:0;
	font-family:sans-serif;
	font-size:16px;
	font-weight:800;
	padding:9px;
	position: absolute;
	text-transform:uppercase;
	top:-19px;
	transform:translateX(-50%);
}

#editors-note span{
	border:2px solid #f3f3f3;
	color:#f3f3f3;
	display:inline-block;
	font-family:sans-serif;
	font-size:16px;
	margin:0 auto 20px auto;
	max-width:calc(100% - 24px);
	padding:20px 10px 10px 10px;
	width:936px;
}

#gallery{
    display:inline-block;
	height:calc(100% - 40px);
	left:0;
	padding:20px;
	position:absolute;
	text-align:right;
	top:0;
	width:calc(100% - 40px);
}

#gallery-items{
	display:inline-block;
	max-width:100%;
	width:520px;
}

html, body{
	background:#272727;
	font-size:0;
	height:100%;
	margin:0;
	padding:0;
	width:100%;
}

#logo{
	justify-content:flex-end;
	display:flex;
	flex-direction:column;
	height:100%;
	width:100%;
}

#logo h1{
	bottom:-19px;
	color:#f3f3f3;
	font-family:"cyntho_next_boldbold", sans-serif;
	font-size:128px;
	font-weight:800;
	left:-2px;
	line-height:128px;
	margin:auto 0 0 0;
	padding:20px;
	position:fixed;
	text-transform:uppercase;
}

#now-playing{
	display:inline-block;
	padding:20px;
	text-align:center;
	width:calc(100% - 40px);
}

#now-playing-title{
	color:#dadada;
	font-family:sans-serif;
	font-size:16px;
	letter-spacing:16px;
	margin:0 0 48px 0;
	text-transform:uppercase;
}

#shitpost-date{
	color:#dadada;
	display:inline-block;
	font-family:sans-serif;
	font-size:16px;
	font-style:italic;
	padding:0 0 20px 0;
}

#shitpost-title{
	border-bottom:2px solid #f3f3f3;
	border-top:2px solid #f3f3f3;
	color:#f3f3f3;
	font-family:"cyntho_next_boldbold", sans-serif;
	font-size:64px;
	line-height:64px;
	margin:-12px auto 20px auto;
	max-width:100%;
	padding:10px 0;
	text-transform:capitalize;
	width:960px;
}

#shitpost-video{
	max-width:100%;
	width:960px;
}

.video-preview{
	background:rgba(40,40,40,.5);
	cursor:pointer;
	display:inline-block;
	padding:0 0 14px 0;
	text-align:left;
}

.video-preview:hover .video-preview-thumbnail-image{
	height:310px;
	width:520px;
}

.video-preview-duration{
	background:rgba(0,0,0,0.7);
	border-radius:4px;
	color:#f3f3f3;
	font-family:sans-serif;
	font-size:16px;
	padding:5px;
	position:absolute;
	bottom:30px;
	right:30px;
}

.video-preview-title{
	color:#f3f3f3;
	font-family:sans-serif;
	font-size:20px;
	position:relative;
	padding:20px 0 10px 0;
	top:-4px;
}

.video-preview-thumbnail{
	background:#f3f3f3;
	box-shadow:0 0 16px #272727;
	display:flex;
	height:310px;
	left:0;
	position:relative;
	top:0;
	width:520px;
}

.video-preview-date{
	color:#dadada;
	font-family:sans-serif;
	font-size:14px;
	font-style:italic;
	position:relative;
	text-transform:uppercase;
	top:-6px;
}

.video-preview-thumbnail-image{
	background-position:center;
	background-size:cover;
	height:270px;
	margin:auto;
	transition:width 0.6s cubic-bezier(0.16, 1, 0.3, 1), height 0.6s cubic-bezier(0.16, 1, 0.3, 1);
	width:480px;
}