.pull-to-refresh-material {
 position:fixed;
 top:0;
 z-index:102;
 width:100%;
}
.pull-to-refresh-material__control {
 position:absolute;
 top:-50px;
 left:50%;
 transform:translate3d(-50%,0,0);
 width:40px;
 height:40px;
 justify-content:center;
 align-items:center;
 background:#fff;
 border-radius:50%;
 box-shadow:0 1px 6px rgba(0,0,0,.117647),0 1px 4px rgba(0,0,0,.117647);
 display:none;
}
.pull-to-refresh--pulling .pull-to-refresh-material__control,
.pull-to-refresh--aborting .pull-to-refresh-material__control,
.pull-to-refresh--reached .pull-to-refresh-material__control,
.pull-to-refresh--refreshing .pull-to-refresh-material__control,
.pull-to-refresh--restoring .pull-to-refresh-material__control {
 display:flex;
}
.pull-to-refresh--pulling .pull-to-refresh-material__spinner,
.pull-to-refresh--aborting .pull-to-refresh-material__spinner,
.pull-to-refresh--reached .pull-to-refresh-material__spinner,
.pull-to-refresh--refreshing .pull-to-refresh-material__icon,
.pull-to-refresh--restoring .pull-to-refresh-material__icon {
 display:none;
}
.pull-to-refresh-material__spinner {
 transform-origin:center center;
 animation:pull-to-refresh-material-rotate 2s linear infinite;
}
.pull-to-refresh-material__path {
 stroke-dasharray:1,200;
 stroke-dashoffset:0;
 stroke-linecap:round;
 animation:pull-to-refresh-material-dash 1.5s ease-in-out infinite;
}
.pull-to-refresh-material__path--colorful {
 animation:pull-to-refresh-material-dash 1.5s ease-in-out infinite,pull-to-refresh-material-colorful 6s ease-in-out infinite;
}
@keyframes pull-to-refresh-material-rotate {
 100% {
  transform:rotate(360deg);
 }
}
@keyframes pull-to-refresh-material-dash {
 0% {
  stroke-dasharray:1,200;
  stroke-dashoffset:0;
 }
 50% {
  stroke-dasharray:89,200;
  stroke-dashoffset:-35px;
 }
 100% {
  stroke-dasharray:89,200;
  stroke-dashoffset:-124px;
 }
}
@keyframes pull-to-refresh-material-colorful {
 100%,
 0% {
  stroke:#4285f4;
 }
 40% {
  stroke:#ea4335;
 }
 66% {
  stroke:#fbbc05;
 }
 80%,
 90% {
  stroke:#34a853;
 }
}