svg {
	overflow: visible;
}
svg .cuadrado,
svg .arco,
svg .extra,
svg .diagonal {
	fill: transparent;
	stroke: white;
	stroke-width: 8px;
	-webkit-transition: all .25s ease-out;
	   -moz-transition: all .25s ease-out;
	    -ms-transition: all .25s ease-out;
	     -o-transition: all .25s ease-out;
	        transition: all .25s ease-out;
}
#capa1 .cuadrado {
	stroke-dasharray: 4000px;
	stroke-dashoffset: 4000px;
}
#capa1 .diagonal {
	stroke-dasharray: calc(1000px * var(--raiz2));
	stroke-dashoffset: calc(1000px * var(--raiz2));
	transform-origin: 0 100%;
}
#capa1 .arco {
	stroke-dasharray: calc((250px * var(--raiz2)) * 3.1416);
	stroke-dashoffset: calc((-250px * var(--raiz2)) * 3.1416);
}
#capa1 .extra {
	stroke-dasharray: calc((2 * var(--raiz2) - 2) * 1000 + 1000);
	stroke-dashoffset: calc((2 * var(--raiz2) - 2) * 1000 + 1000);
}
#capa1, #capa2 {
	position: absolute;
	top: 0;
	-webkit-transition: all .25s ease-out;
	   -moz-transition: all .25s ease-out;
	    -ms-transition: all .25s ease-out;
	     -o-transition: all .25s ease-out;
	        transition: all .25s ease-out;
}
#capa2 {
	width: 100%;
	transform-origin: 100% 50%;
}
#ruedas .delantera,
#ruedas .trasera,
#ruedas .centro {
	fill: transparent;
	stroke: var(--verde);
	stroke-width: 50px;
	-webkit-transition: all .25s ease-out;
	   -moz-transition: all .25s ease-out;
	    -ms-transition: all .25s ease-out;
	     -o-transition: all .25s ease-out;
	        transition: all .25s ease-out;
}
#ruedas .delantera,
#ruedas .trasera {
	stroke-dasharray: 3141.59;
	stroke-dashoffset: 3141.59;
}
#ruedas .centro {
	stroke-dasharray: calc(2 * 3.14159 * 280);
	stroke-dashoffset: calc(2 * 3.14159 * 280);
}
#ruedas .delantera {
	transform-origin: 490px 490px;
}
#ruedas .trasera {
	transform-origin: 2317px 501px;
}
#ruedas .centro {
	transform-origin: 1404px 494px;
}