* {
	box-sizing: border-box;
	margin: 0;
	padding: 0
}
body, html {
	font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
	background-color: #000;
	height: 100%
}
body {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	color: #fff;
	font: 400 16px serif;
	margin: 0;
	overflow: hidden;
	text-align: center;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none
}
a {
	text-decoration: none
}
.init-pop, .hand, .pushalert-ticker, .modal-overlay, .preloader, .video, .hint {
	display: none
}
.init-pop {
	position: absolute;
	top: 150px;
	left: calc(50% - 150px);
	width: 300px;
	background-color: #262626;
	border-radius: 5px;
	padding: 14px;
	z-index: 999
}
.init-pop img {
	width: 70px;
	height: 70px;
	margin-right: 14px;
	border-radius: 100px
}
.flex {
	display: flex;
	justify-content: flex-start;
	flex-wrap: nowrap
}
.init-text, .btn-pop {
	font-family: Roboto, sans-serif
}
.init-text {
	text-align: left
}
.flex.just-right {
	justify-content: flex-end
}
.btn-pop.btn-decline {
	opacity: .8;
	margin-right: 14px
}
.btn-pop {
	margin: 14px 0 7px;
	font-weight: 700
}
.hand {
	width: 160px;
	height: 180px;
	position: absolute;
	top: 12%;
	left: 15%;
	-webkit-transform: translate(-50%, -20px);
	transform: translate(-50%, -20px);
	background: url("/video-stream/arrow_up.png") no-repeat 0/contain;
	z-index: 6;
	-webkit-animation-name: hand;
	animation-name: hand;
	-webkit-animation-duration: .8s;
	animation-duration: .8s;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite
}
.modal-overlay {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: #000;
	opacity: .75;
	z-index: 10
}
.v {
	bottom: 0;
	margin: auto;
	position: fixed;
	right: 0
}
.v, .vwd {
	left: 0;
	top: 0
}
.vwd {
	bottom: 50px;
	position: absolute;
	width: 100%
}
.preloader {
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: 99
}
.preloader, .video {
	position: absolute;
	top: 50%
}
.video {
	margin: 0 auto;
	position: relative;
	top: unset;
	height: 100%;
	width: 100%
}
.hint {
	position: absolute;
	color: #fff;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: #1e1e1e;
	padding: 20px;
	font-size: 30px;
	font-family: Arial, Helvetica, sans-serif;
	z-index: 99;
	border-radius: 10px;
	height: auto;
	max-height: fit-content;
	width: 300px;
	box-sizing: border-box
}
.hint img {
	width: 200px;
	height: 200px;
	border-radius: 200px
}
.hint-content {
	margin: 5px auto 20px;
	line-height: 1.5;
	font-size: 18px
}
.hint-name {
	font-weight: 700
}
.hint-message {
	font-style: italic
}
.hint-btn {
	background: #1f8749;
	padding: 10px 20px;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 24px
}
.vwc {
	background-color: #000;
	width: 100%;
	bottom: 0;
	height: 50px;
	left: 0;
	position: absolute
}
.vcp {
	background-color: hsla(0, 0%, 100%, .2);
	height: 3px;
	margin-top: 4px;
	position: relative
}
.vcp .load_line {
	background-color: #d0021b;
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 0
}
.vcl, .vcr {
	margin-top: 8px
}
.vcl {
	float: left
}
.vcr {
	float: right;
	padding-right: 10px
}
.vcr .vci:first-child {
	margin-left: 0
}
.vcii {
	font-family: sans-serif;
	font-size: 12px;
	line-height: 29px
}
.vci, .vcii {
	float: left;
	margin-left: 10px
}
.vci {
	fill: #fff;
	height: 27px;
	width: 27px
}
@media(min-width:700px) {
	.vcl, .vcr {
		margin-top: 6px
	}
	.vcii {
		line-height: 34px
	}
	.vci {
		height: 32px;
		width: 32px
	}
}
@media screen and (max-width:500px) {
	.hand {
		top: 60%;
		left: 42%!important
	}
}
@media screen and (max-width:360px) {
	.hand {
		top: 54%
	}
}
.hand_text {
	position: absolute;
	top: 160px
}
@-webkit-keyframes hand {
	0% {
		-webkit-transform: translateY(-5px);
		transform: translateY(-5px)
	}
	50% {
		-webkit-transform: translateY(5px);
		transform: translateY(5px)
	}
	to {
		-webkit-transform: translateY(-5px);
		transform: translateY(-5px)
	}
}
@media screen and (max-width:940px) {
	.hand {
		width: 160px;
		height: 180px;
		top: 70%;
		left: 42%;
		-webkit-transform: translate(-50%, -20px);
		transform: translate(-50%, -20px);
		background: url("/video-stream/arrow_up.png") no-repeat 0/contain;
		z-index: 6;
		-webkit-animation-name: hand;
		animation-name: hand;
		-webkit-animation-duration: .8s;
		animation-duration: .8s;
		-webkit-animation-iteration-count: infinite;
		animation-iteration-count: infinite
	}
}
@keyframes hand {
	0% {
		-webkit-transform: translateY(-5px);
		transform: translateY(-5px)
	}
	50% {
		-webkit-transform: translateY(5px);
		transform: translateY(5px)
	}
	to {
		-webkit-transform: translateY(-5px);
		transform: translateY(-5px)
	}
}