﻿.react-spinner-loader-swing div {
    border-radius: 50%;
    float: left;
    height: 1em;
    width: 1em
}

    .react-spinner-loader-swing div:first-of-type {
        background: linear-gradient(90deg,#385c78 0,#325774)
    }

    .react-spinner-loader-swing div:nth-of-type(2) {
        background: linear-gradient(90deg,#325774 0,#47536a)
    }

    .react-spinner-loader-swing div:nth-of-type(3) {
        background: linear-gradient(90deg,#4a5369 0,#6b4d59)
    }

    .react-spinner-loader-swing div:nth-of-type(4) {
        background: linear-gradient(90deg,#744c55 0,#954646)
    }

    .react-spinner-loader-swing div:nth-of-type(5) {
        background: linear-gradient(90deg,#9c4543 0,#bb4034)
    }

    .react-spinner-loader-swing div:nth-of-type(6) {
        background: linear-gradient(90deg,#c33f31 0,#d83b27)
    }

    .react-spinner-loader-swing div:nth-of-type(7) {
        background: linear-gradient(90deg,#da3b26 0,#db412c)
    }

.react-spinner-loader-shadow {
    clear: left;
    padding-top: 1.5em
}

    .react-spinner-loader-shadow div {
        -webkit-filter: blur(1px);
        filter: blur(1px);
        float: left;
        width: 1em;
        height: .25em;
        border-radius: 50%;
        background: #e3dbd2
    }

    .react-spinner-loader-shadow .react-spinner-loader-shadow-l {
        background: #d5d8d6
    }

    .react-spinner-loader-shadow .react-spinner-loader-shadow-r {
        background: #eed3ca
    }

@-webkit-keyframes ball-l {
    0%,50% {
        transform: rotate(0) translateX(0)
    }

    to {
        transform: rotate(50deg) translateX(-2.5em)
    }
}

@keyframes ball-l {
    0%,50% {
        transform: rotate(0) translateX(0)
    }

    to {
        transform: rotate(50deg) translateX(-2.5em)
    }
}

@-webkit-keyframes ball-r {
    0% {
        transform: rotate(-50deg) translateX(2.5em)
    }

    50%,to {
        transform: rotate(0) translateX(0)
    }
}

@keyframes ball-r {
    0% {
        transform: rotate(-50deg) translateX(2.5em)
    }

    50%,to {
        transform: rotate(0) translateX(0)
    }
}

@-webkit-keyframes shadow-l-n {
    0%,50% {
        opacity: .5;
        transform: translateX(0)
    }

    to {
        opacity: .125;
        transform: translateX(-1.75em)
    }
}

@keyframes shadow-l-n {
    0%,50% {
        opacity: .5;
        transform: translateX(0)
    }

    to {
        opacity: .125;
        transform: translateX(-1.75em)
    }
}

@-webkit-keyframes shadow-r-n {
    0% {
        opacity: .125;
        transform: translateX(1.75em)
    }

    50%,to {
        opacity: .5;
        transform: translateX(0)
    }
}

@keyframes shadow-r-n {
    0% {
        opacity: .125;
        transform: translateX(1.75em)
    }

    50%,to {
        opacity: .5;
        transform: translateX(0)
    }
}

.react-spinner-loader-swing-l {
    -webkit-animation: ball-l .425s ease-in-out infinite alternate;
    animation: ball-l .425s ease-in-out infinite alternate
}

.react-spinner-loader-swing-r {
    -webkit-animation: ball-r .425s ease-in-out infinite alternate;
    animation: ball-r .425s ease-in-out infinite alternate
}

.react-spinner-loader-shadow-l {
    -webkit-animation: shadow-l-n .425s ease-in-out infinite alternate;
    animation: shadow-l-n .425s ease-in-out infinite alternate
}

.react-spinner-loader-shadow-r {
    -webkit-animation: shadow-r-n .425s ease-in-out infinite alternate;
    animation: shadow-r-n .425s ease-in-out infinite alternate
}

.react-spinner-loader-svg-calLoader {
    width: 230px;
    height: 230px;
    transform-origin: 115px 115px;
    -webkit-animation: loader-spin 1.4s linear infinite;
    animation: loader-spin 1.4s linear infinite
}

.react-spinner-loader-svg-cal-loader__path {
    -webkit-animation: loader-path 1.4s ease-in-out infinite;
    animation: loader-path 1.4s ease-in-out infinite
}

@-webkit-keyframes loader-spin {
    to {
        transform: rotate(1turn)
    }
}

@keyframes loader-spin {
    to {
        transform: rotate(1turn)
    }
}

@-webkit-keyframes loader-path {
    0% {
        stroke-dasharray: 0,580,0,0,0,0,0,0,0
    }

    50% {
        stroke-dasharray: 0,450,10,30,10,30,10,30,10
    }

    to {
        stroke-dasharray: 0,580,0,0,0,0,0,0,0
    }
}

@keyframes loader-path {
    0% {
        stroke-dasharray: 0,580,0,0,0,0,0,0,0
    }

    50% {
        stroke-dasharray: 0,450,10,30,10,30,10,30,10
    }

    to {
        stroke-dasharray: 0,580,0,0,0,0,0,0,0
    }
}

.react-spinner-loader-svg svg {
    transform-origin: 50% 65%
}

    .react-spinner-loader-svg svg polygon {
        stroke-dasharray: 17;
        -webkit-animation: dash 2.5s cubic-bezier(.35,.04,.63,.95) infinite;
        animation: dash 2.5s cubic-bezier(.35,.04,.63,.95) infinite
    }

@-webkit-keyframes dash {
    to {
        stroke-dashoffset: 136
    }
}

@keyframes dash {
    to {
        stroke-dashoffset: 136
    }
}

@-webkit-keyframes rotate {
    to {
        transform: rotate(1turn)
    }
}

@keyframes rotate {
    to {
        transform: rotate(1turn)
    }
}
