#nav ul li:first-child { position: relative; left: 0; }
#nav ul li.comment { position: absolute; left: 2%; }

#bottom { z-index: 1; }
#video-wrapper { z-index: 1; }
#video-player .vjs-control-bar { display: flex; position: absolute; bottom: 120px; z-index: 3; }
#nav { padding: 0 3% 20px; }

#bottom .comments { padding: 0; left: 0; right: 0; position: fixed; margin: auto; max-width: 600px; bottom: 150px; }
#bottom .comments ul { box-sizing: border-box;  }
#bottom .comments ul.open { height: 15vh; padding: 100px 0 0; }

#video-wrapper .btn {
	position: absolute;
	display: block;
	content: '';
	width: 50%;
	height: 80%;
	left: 0;
	top: 0;
	z-index: 2;
	cursor: pointer;
}

#video-wrapper .btn.forward {
	right: 0;
	left: auto;	
}

#video-wrapper .btn.forward span {
	background: rgba(0, 0, 0, 0.6) url(../images/common/arw_forward.png) no-repeat center 70%;
	background-size: 30px auto;	
}

#video-wrapper .btn.backward span {
	background: rgba(0, 0, 0, 0.6) url(../images/common/arw_backward.png) no-repeat center 70%;
	background-size: 30px auto;	
}

#video-wrapper .btn span {
	display: block;
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	line-height: 80px;
	width: 100px;
	height: 100px;
	color: #fff;
	text-align: center;
	opacity: 0;
	transition: 0.3s;
	border-radius: 50%;
}

#video-wrapper .btn.active span {
	opacity: 1;
}

video-js .vjs-slider:focus {
	text-shadow: none;
	box-shadow: none;
}

.video-js .vjs-time-tooltip {
	width: 50px;
	box-sizing: border-box;
}

.video-js .vjs-control-bar {
	width: 90%; 
	margin: auto;
	left: 0;
	right: 0;
	background: none;
}

.video-js .vjs-progress-control .vjs-mouse-display {
	z-index: 2;
}

.video-js .vjs-control-bar { height: 2em; }

.vjs-button > .vjs-icon-placeholder::before { 
	line-height: 1.18;	
}

.vjs-subs-caps-button {
	display: none !important;
}

.video-js .vjs-time-control {
	line-height: 2em;
}

.video-js .vjs-play-progress {
	background: #8d8e93;
}
.video-js .vjs-slider {
	background: rgba(141,142,148,0.7);
}
.vjs-has-started .vjs-control-bar {
	position: absolute;
	bottom: 72px;
	z-index: 2;
}

.vjs-big-play-button {
	position: absolute;
	bottom: 0;
	top: 0;
	margin: auto;
	right: 0;
	left: 0;
	z-index: 999;
}

.video-js .vjs-big-play-button .vjs-icon-placeholder::before {
	line-height: 45px;
}

#nav ul li.openPeaceChat { left: 2%; position: absolute; }

#lang_select { z-index: 99; top: 70px; }

.change_part { overflow: hidden; width: 160px; display: flex; flex-wrap: wrap; position: absolute; left: 3%; top: 130px; z-index: 99; border-radius: 10px; 
	background: linear-gradient(0deg, rgba(195, 3, 0, 1), rgba(0,33,173,1));
	background: -webkit-linear-gradient(0deg, rgba(195,3,0,1) 0%, rgba(0,33,173,1) 100%);
}
.change_part a { display: block; 
	width: 50%;
	text-align: center;
	color: #fff;
	font-size: 14px;
	position: relative;
	height: 35px;
	line-height: 35px;
	pointer-events: none;
}

.change_part a.off {
	background: rgba(9, 9, 9, 0.7);
	color: #c1c1c1;
	cursor: pointer;
	pointer-events: auto;
}

/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:500px){
	
	.change_part { top: 115px; width: 120px; } 
	.change_part a { height: 30px; line-height: 30px; }
	
	#video-wrapper .btn span {
		width: 70px;
		height: 70px;
		line-height: 60px;
		font-size: 14px;
	}
	
	#video-wrapper .btn.forward span,
	#video-wrapper .btn.backward span {
		background-size: 20px auto;
	}
	
	#video-player .vjs-control-bar { bottom: 19vw; }
	#bottom .comments { bottom: 110px; }
}