.can {
	display: flex;
	position: fixed;
	bottom: -9.4%;
	left: -6.0%;
}

.zirh {
	display: flex;
	position: fixed;
	bottom: -9.4%;
	left: -6.0%;
}

.circlea {
	display: flex;
	position: fixed;
	bottom: -9.4%;
	left: -6.0%;
}

.circleb {
	display: flex;
	position: fixed;
	bottom: -9.4%;
	left: -6.0%;
}

 .progress {
   -webkit-transition: 0.35s stroke-dashoffset;
   -o-transition: 0.35s stroke-dashoffset;
   transition: 0.35s stroke-dashoffset;
   -webkit-transform: rotate(140deg);
   -ms-transform: rotate(140deg);
   transform: rotate(140deg);
   -webkit-transform-origin: 50% 50%;
   -ms-transform-origin: 50% 50%;
   transform-origin: 50% 50%;
 } 

.progressplayer {
  -webkit-transition: 0.35s stroke-dashoffset;
  -o-transition: 0.35s stroke-dashoffset;
  transition: 0.35s stroke-dashoffset;
  -webkit-transform: rotate(-270deg);
  -ms-transform: rotate(-270deg);
  transform: rotate(-270deg);
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.progressplayerx {
  -webkit-transition: 0.35s stroke-dashoffset;
  -o-transition: 0.35s stroke-dashoffset;
  transition: 0.35s stroke-dashoffset;
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.backgroundCircle {
  -webkit-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  transform: rotate(-180deg);
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

