:root {
  --chartColor:#81ABE9; /*Цвет заполняемой диаграммы*/
  --height:120px; /*Высота видео в свернутом виде*/
  --width:120px; /*Ширина видео в свернутом виде*/
  --fullHeight:236px; /*Высота видео в развернутом виде*/
  --fullWidth:236px; /*Ширина видео в развернутом виде*/
}

.video-widget {
  position:fixed;
  bottom:0;
  z-index:300000;
}

.video-block {
  position:absolute;
  border-radius:50%;
  width:var(--width);
  height:var(--height);
  bottom:50px;
  left:50px;
  cursor:pointer;
  overflow:hidden;
  user-select:none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  background:transparent;
  transition: all .3s;
  -webkit-mask-image: -webkit-radial-gradient(white, black);
}

.video-block:hover {
  transform:scale(1.1);
}

.mtz-vlc-klfbf {
  object-fit: cover;
  position:absolute;
  width:100%;
  height:100%;
}

.clearfix.fullsize {
  width:var(--fullWidth);
  height:var(--fullHeight);
}

.clearfix.fullsize:hover {
    transform:scale(1);
}

.video-block .btn-play {
  position:absolute;
  top:50%;
  left:50%;
  width:40px;
  height:40px;
  transform:translate(-50%, -50%);
  transition: all .5s;
}

svg.chart-parent .chart {
  stroke: var(--chartColor); 
  stroke-width: 2;
  fill: transparent;
  opacity:0;
}

svg.chart-parent {
  width:108%;
  height:108%;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%) rotate(-90deg);
}