:host {
  display: block;
  height: 100px;
  width: 100px; }
  :host svg {
    height: 100%;
    width: 100%;
    transform-origin: center; }
  :host path {
    fill: transparent;
    stroke-width: 10px; }
  :host[mode='indeterminate'] {
    animation-duration: 5250ms, 2887.5ms;
    animation-name: md-progress-circle-sporadic-rotate, md-progress-circle-linear-rotate;
    animation-timing-function: cubic-bezier(0.35, 0, 0.25, 1), linear;
    animation-iteration-count: infinite;
    transition: none; }

@keyframes md-progress-circle-linear-rotate {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

@keyframes md-progress-circle-sporadic-rotate {
  12.5% {
    transform: rotate(135deg); }
  25% {
    transform: rotate(270deg); }
  37.5% {
    transform: rotate(405deg); }
  50% {
    transform: rotate(540deg); }
  62.5% {
    transform: rotate(675deg); }
  75% {
    transform: rotate(810deg); }
  87.5% {
    transform: rotate(945deg); }
  100% {
    transform: rotate(1080deg); } }

/*# sourceMappingURL=progress-circle.css.map */
