<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="400px" height="400px">

  <path class="path" fill="#FFFFFF" stroke="#000000" stroke-width="4" stroke-miterlimit="10" d="M80 100, A 100 100 80 1  1 200 200, C 50 50 200 50 200 150 z"/>
  
</svg>
.path {
	stroke-dasharray: 830;
	stroke-dashoffset: 1000;
	animation: dash 4s linear alternate infinite;	
	-webkit-animation: dash 4s linear alternate infinite;
	-moz-animation: dash 4s linear alternate infinite;
	-ms-animation: dash 4s linear alternate infinite;
	-o-animation: dash 4s linear alternate infinite;
}

@-webkit-keyframes dash {
	from {
		stroke-dashoffset: 830;
	}
	to {
		stroke-dashoffset: 0;
	}
} 
@-moz-keyframes dash {
	from {
		stroke-dashoffset: 830;
	}
	to {
		stroke-dashoffset: 0;
	}
} 
@-ms-keyframes dash {
	from {
		stroke-dashoffset: 830;
	}
	to {
		stroke-dashoffset: 0;
	}
} 
@-o-keyframes dash {
	from {
		stroke-dashoffset: 830;
	}
	to {
		stroke-dashoffset: 0;
	}
} 

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.