.animate {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
}
.textfill {
	animation-name: textfill;
	-webkit-animation-name: textfill;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	fill: var(--circuit-color) !important;
}

.linefill {
	animation-name: linefill;
	-webkit-animation-name: linefill;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

@keyframes linefill {
	0% {
			opacity: 1;
	}
	50% {
			opacity: 0.1;
	}
	100% {
			opacity: 1;
	}
}
@keyframes textfill {
	0% {
			opacity: 0.5;
	}
	50% {
			opacity: 0;
	}
	100% {
			opacity: 0.5;
	}
}

@-moz-keyframes textfill {
	0% {
			opacity: 1;
	}
	50% {
			opacity: 0;
	}
	100% {
			opacity: 1;
	}
}

@-webkit-keyframes textfill {
	0% {
			opacity: 1;
	}
	50% {
			opacity: 0;
	}
	100% {
			opacity: 1;
	}
}

@-o-keyframes textfill {
	0% {
			opacity: 1;
	}
	50% {
			opacity: 0;
	}
	100% {
			opacity: 1;
	}
}

.outline {
	animation-name: outlines;
	-webkit-animation-name: outlines;
	animation-fill-mode: linear;
	-webkit-animation-fill-mode: linear;
	stroke-dashoffset: 0%;
}

@keyframes outlines {
	from {
			stroke-dasharray: 0%, 500%;
	}
	to {
			stroke-dasharray: 500%, 0%;
	}
}

@-webkit-keyframes outlines {
	from {
			stroke-dasharray: 0%, 500%;
	}
	to {
			stroke-dasharray: 500%, 0%;
	}
}

@-moz-keyframes outlines {
	from {
			stroke-dasharray: 1000;
			stroke-dashoffset: 1000;
	}
	to {
			stroke-dashoffset: 0;
	}
}

@-o-keyframes outlines {
	from {
			stroke-dasharray: 1000;
			stroke-dashoffset: 1000;
	}
	to {
			stroke-dashoffset: 0;
	}
}