.spinner {
    display: inline-block;
    text-align: center;
    border: none !important;
    padding: 0;
    white-space: nowrap
}

.spinner>div {
    position: relative;
    margin-left: 1px;
    top: 2px;
    border-radius: 100%;
    display: inline-block;
    -webkit-animation: spinner-bouncedelay 1.4s infinite ease-in-out both;
    animation: spinner-bouncedelay 1.4s infinite ease-in-out both
}

.spinner .bounce1 {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s
}

.spinner .bounce2 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s
}

.spinner--small {
    width: 30px;
    height: 15px
}

.spinner--small>div {
    width: 9px;
    height: 9px;
    background-color: #202020
}

.spinner--medium {
    width: 60px;
    height: 25px
}

.spinner--medium>div {
    width: 18px;
    height: 18px;
    background-color: #202020
}

@-webkit-keyframes spinner-bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    40% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes spinner-bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    40% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.ring_spinner {
    -webkit-animation-name: ring-spinner;
    animation-name: ring-spinner;
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear
}

.ring_spinner.theme_todoist #ring_segment {
    fill: #db4c3f
}

.ring_spinner.theme_todoist #ring_bg {
    fill: rgba(219, 76, 63, 0.15)
}

@-webkit-keyframes ring-spinner {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes ring-spinner {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}
