#mycustomvideo,.mycustomvideo { width:100%; height:100%; float: left; background-color:#000; }
body::after{
    position:absolute; width:0; height:0; overflow:hidden; z-index:-1;
    content:url(images/playh.png) url(images/player/playh.svg) url(images/player/volumemuteh.svg) url(images/player/volumeonh.svg) url(images/player/stoph.svg) url(images/player/fullh.svg) url(images/player/fulloffh.svg) url(images/player/qualityh.svg);
}
.myTVCHPlayer {
	width:100%;
	height: auto;
	position: relative;
}
.myTVCHPlayer .score_board {
	position: absolute;
	bottom:35px;
	transform-origin:left;
}
.myTVCHPlayer #logoischain {
	position: absolute; top:10px; right:10px; max-width: 100px; max-height: 50px; z-index: 4; opacity: .89;
}
.myTVCHPlayer .elemcenter {
    position: absolute;
    left: calc(50% - 4.1em);
    top: calc(50% - 4.1em);
    width: 8.2em;
    height: 8.2em;
    border: 0;
	cursor:pointer;
    border-radius: 50%;
    background-color: transparent;
    color: #fff;
}
.myTVCHPlayer .elemcenter .plcenter {
	position:absolute;
	width: 100%;
    height: 100%;
	left: 0;
	top: 0;
	cursor:pointer;
	transition: all 0.5s linear;
	background: url(images/play.png) no-repeat center center;
	background-size: contain;
}
.myTVCHPlayer .elemcenter .plcenter:hover {
	background: url(images/playh.png) no-repeat center center;
	background-size: contain;
}
.myTVCHPlayer video {
	width:100%;
	max-height: 100%;
	aspect-ratio: 16 / 9;
}
.myTVCHPlayer .controls { height:45px; bottom:0px; position:absolute; left:0px; right:0px;
	background-image: -webkit-gradient( linear, left top, left 100%, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.4)) );
    background-image: -moz-linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%);
    background-image: -ms-linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%);
}
.myTVCHPlayer.playin .controls {
	-webkit-animation: hideMeAnim 10s forwards;
    animation: hideMeAnim 10s forwards;
}
.myTVCHPlayer.playin .controls:hover {
	-webkit-animation: showMeAnim 1s forwards;
    animation: showMeAnim 1s forwards;
}
.myTVCHPlayer .small_board {
	width:100px; height:25px; top: 10px; left: 10px; position: absolute; background-color: #fff; opacity: .8; border-radius:6px; overflow:hidden;
}
.myTVCHPlayer .small_board .smimg1, .myTVCHPlayer .small_board .smimg2 {
	width:25px; float:left; height:25px; background-repeat:no-repeat; background-size:cover; background-position:center center;
}
.myTVCHPlayer .small_board .smsc1, .myTVCHPlayer .small_board .smsc2 {
	width:25px; float:left; height:25px; font-size:12px; color:#333; line-height:25px; text-align:center;
}
.myTVCHPlayer.isfull .small_board {
	top: 50px; left: 50px; transform:scale(1.4,1.4);
}
.myTVCHPlayer.isfull #logoischain {
	 top:50px; right:50px;
}
/* Play */
.myTVCHPlayer .controls .playpause.play {
	width:42px; height:42px;
	transition: all 0.5s linear;
	background: url(images/player/play.svg) no-repeat center center;
	background-size:24px 24px;
	margin-left:5px; margin-right:10px;
    float: left;
}
.myTVCHPlayer .controls .playpause.play:hover  {
	background: url(images/player/playh.svg) no-repeat center center;
	background-size:24px 24px;
}

/* Stop */
.myTVCHPlayer .controls .playpause.stop  {
	transition: all 0.5s linear;
	width:42px; height:42px; margin-left:5px; margin-right:10px;
	background: url(images/player/stop.svg) no-repeat center center;
	background-size:48.609896%;
	float: left;
}
.myTVCHPlayer .controls .playpause.stop:hover {
	background: url(images/player/stoph.svg) no-repeat center center;
	background-size:48.609896%;
}

/* VolumeMuted */
.myTVCHPlayer .controls .volume.mute  {
	transition: all 0.5s linear;
	width:42px;
	height:42px;
	float:left;
	background: url('images/player/volumemute.svg') no-repeat center center;
	background-size:100%;
}
.myTVCHPlayer .controls .volume.mute:hover {
	background: url('images/player/volumemuteh.svg') no-repeat center center;
	background-size:100%;
}
/* VolumeOn */
.myTVCHPlayer .controls .volume.on  {
	transition: all 0.5s linear;
	width:42px;
	height:42px;
	float:left;
	background: url('images/player/volumeon.svg') no-repeat center center;
	background-size:100%;
}
.myTVCHPlayer .controls .volume.on:hover {
	background: url('images/player/volumeonh.svg') no-repeat center center;
	background-size:100%;

}

.myTVCHPlayer.isfull {
	transition: all 0.5s linear;
	background:#000;
	width:100%;
	height:100%;
}
.myTVCHPlayer.isfull video {
	width:100%;
	height:100%;
}
/* FullScreen */
.myTVCHPlayer .controls .full  {
	transition: all 0.5s linear;
	width:42px;
	height:42px;
	margin-right:10px;
	float:right;
	background: url('images/player/full.svg') no-repeat center center;
	background-size:46.851042%;
}
.myTVCHPlayer .controls .full:hover {
	background: url('images/player/fullh.svg') no-repeat center center;
	background-size:46.851042%;
}
.myTVCHPlayer .controls .fulloff  {
	transition: all 0.5s linear;
	width:42px;
	height:42px;
	margin-right:10px;
	float:right;
	background: url('images/player/fulloff.svg') no-repeat center center;
	background-size:46.851042%;
}
.myTVCHPlayer .controls .fulloff:hover {
	background: url('images/player/fulloffh.svg') no-repeat center center;
	background-size:46.851042%;
}
.myTVCHPlayer .controls .liveison  {
	width: 42px;
    height: 42px;
    padding-left: 29px;
    line-height: 42px;
    color: #fff;
    background: url(images/player/livesignalh.svg) no-repeat 3px center;
    background-size: 20px 20px;
    position: absolute;
    left: calc((100% - 71px) / 2 );
}
.myTVCHPlayer .controls .liveison.off {
	background: url('images/player/livesignal.svg') no-repeat 3px center;
	background-size: 20px 20px;
}
.myTVCHPlayer .controls .liveison.rep {
	background: url('images/player/livesignalr.svg') no-repeat 3px center;
	background-size: 20px 20px;
	width:70px;
	cursor:pointer;
}
.myTVCHPlayer .controls .qualityq  {
	transition: all 0.5s linear;
	width:42px;
	height:42px;
	position:relative;
	margin-right:10px;
	float:right;
	background: url('images/player/quality.svg') no-repeat center center;
	background-size:100%;
}
.myTVCHPlayer .controls .qualityq:hover {
	background: url('images/player/qualityh.svg') no-repeat center center;
	background-size:100%;
}
.myTVCHPlayer .controls .qualityq #allq {
	width:120px;
	background:#fff;
	border-radius:3px;
	position:absolute;
	display:none;
	top:-130px;
	right:10px;
}
.myTVCHPlayer .controls .qualityq #allq div {
	height:35px;
	line-height:35px;
	padding: 5px;
	color:#000; transition: all 0.5s linear;
	cursor:pointer;
}
.myTVCHPlayer .controls .qualityq #allq div.sel { background: linear-gradient(314.51deg,#177AFF 0%,#4828DC 97.74%); color:#fff; font-weight:bold; }
.myTVCHPlayer .controls .qualityq #allq div:hover { background: linear-gradient(314.51deg,#177AFF 0%,#4828DC 97.74%); color:#fff; }

.liveison2 {
    width: 60px;
    position: absolute;
    right: 30px;
    top: 20px;
    color: #ff0000;
    font-weight: bold;
    line-height: 25px;
}
.liveison2 span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: block;
    background: #ff0000;
    float: left;
    margin-top: 7px;
    margin-right: 8px;
}

@keyframes hideMeAnim {
    0%   {opacity: 1;}
    90%  {opacity: 1;}
    100% {opacity: 0;}
}
@-webkit-keyframes hideMeAnim {
    0%   {opacity: 1;}
    90%  {opacity: 1;}
    100% {opacity: 0;}
}
@keyframes showMeAnim {
    0%   {opacity: 1;}
    90%  {opacity: 1;}
    100% {opacity: 1;}
}
@-webkit-keyframes showMeAnim {
    0%   {opacity: 1;}
    90%  {opacity: 1;}
    100% {opacity: 1;}
}
#helloPlay {
	background: url(images/play.png?i=3) no-repeat center center !important;
	width: 106px !important;
	height: 116px !important;
	border: none !important;
	background-size: cover;
	margin-top: -53px !important;
	margin-left: -58px !important;
	z-index: 9;
	position: absolute;
	top: 50%;
	left: 50%;
}
#helloPlay span {
	display: none;
}