﻿/*spin*/

@keyframes ldio-inner-1 {
    0% {
        top: 7px;
        height: 43px
    }

    50% {
        top: 16px;
        height: 26px
    }

    100% {
        top: 16px;
        height: 26px
    }
}

@keyframes ldio-inner-2 {
    0% {
        top: 10px;
        height: 40px
    }

    50% {
        top: 16px;
        height: 26px
    }

    100% {
        top: 16px;
        height: 26px
    }
}

@keyframes ldio-inner-3 {
    0% {
        top: 12px;
        height: 38px
    }

    50% {
        top: 16px;
        height: 26px
    }

    100% {
        top: 16px;
        height: 26px
    }
}

.ldio-inner div {
    position: absolute;
    width: 15px
}

    .ldio-inner div:nth-child(1) {
        left: 17.5px;
        background: #0055a5;
        animation: ldio-inner-1 1s cubic-bezier(0,0.5,0.5,1) infinite;
        animation-delay: -0.2s
    }

    .ldio-inner div:nth-child(2) {
        left: 42.5px;
        background: #45aee7;
        animation: ldio-inner-2 1s cubic-bezier(0,0.5,0.5,1) infinite;
        animation-delay: -0.1s
    }

    .ldio-inner div:nth-child(3) {
        left: 67.5px;
        background: #bda0b2;
        animation: ldio-inner-3 1s cubic-bezier(0,0.5,0.5,1) infinite;
    }

.loadingio-spinner-pulse-outter {
    width: 35px;
    height: 17px;
    display: inline-block;
    overflow: hidden;
}

.ldio-inner {
    width: 100%;
    height: 100%;
    position: relative;
    transform: translateZ(0) scale(0.35);
    backface-visibility: hidden;
    transform-origin: 0 0; /* see note above */
}

    .ldio-inner div {
        box-sizing: content-box;
    }

.loadingio-bg {
    width: 100px;
    height: 60px;
}
    .loadingio-bg .ldio-inner {
        transform: translateZ(0) scale(1);
    }

/*block*/

@keyframes ldio-block-inner {
    0%

{
    background: #376888
}

12.5% {
    background: #376888
}

12.625% {
    background: #8cd0e5
}

100% {
    background: #8cd0e5
}

}

.ldio-block-inner div {
    position: absolute;
    width: 40px;
    height: 40px;
    background: #8cd0e5;
    animation: ldio-block-inner 1s linear infinite;
}

.loadingio-spinner-blocks-outer {
    width: 200px;
    height: 200px;
    display: block;
    overflow: hidden;
    /*background: #f1f2f3;*/
}

.ldio-block-inner {
    width: 100%;
    height: 100%;
    position: relative;
    transform: translateZ(0) scale(1);
    backface-visibility: hidden;
    transform-origin: 0 0; /* see note above */
}

    .ldio-block-inner div {
        box-sizing: content-box;
    }

.loadingio-spinner-blocks-outer-md {
    width: 100px;
    height: 100px;
}
    .loadingio-spinner-blocks-outer-md .ldio-block-inner {
        transform: translateZ(0) scale(0.5);
    }