.uil-spin-css
{
    background: none;
    height: 200px;
    position: relative;
    width: 200px;
}

@-webkit-keyframes uil-spin-css
{
    0%
    {
        -webkit-transform: scale(1.8);
        opacity: 1;
        -ms-transform: scale(1.8);
        transform: scale(1.8);
    }

    100%
    {
        -webkit-transform: scale(1);
        opacity: 0.1;
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-moz-keyframes uil-spin-css
{
    0%
    {
        -webkit-transform: scale(1.8);
        opacity: 1;
        transform: scale(1.8);
    }

    100%
    {
        -webkit-transform: scale(1);
        opacity: 0.1;
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes uil-spin-css
{
    0%
    {
        -webkit-transform: scale(1.8);
        opacity: 1;
        transform: scale(1.8);
    }

    100%
    {
        -webkit-transform: scale(1);
        opacity: 0.1;
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@-o-keyframes uil-spin-css
{
    0%
    {
        -webkit-transform: scale(1.8);
        opacity: 1;
        -ms-transform: scale(1.8);
        transform: scale(1.8);
    }

    100%
    {
        -webkit-transform: scale(1);
        opacity: 0.1;
        transform: scale(1);
    }
}

@keyframes uil-spin-css
{
    0%
    {
        -webkit-transform: scale(1.8);
        opacity: 1;
        -ms-transform: scale(1.8);
        transform: scale(1.8);
    }

    100%
    {
        -webkit-transform: scale(1);
        opacity: 0.1;
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

.uil-spin-css > div
{
    height: 20px;
    margin-left: 6px;
    margin-top: 6px;
    position: absolute;
    width: 20px;
}

.uil-spin-css > div > div
{
    background: #000;
    border-radius: 100px;
    height: 100%;
    width: 100%;
}

.uil-spin-css > div:nth-of-type(1) > div
{
    -webkit-animation: uil-spin-css 0.8s linear infinite;
    -webkit-animation-delay: -0.7s;
    -ms-animation: uil-spin-css 0.8s linear infinite;
    animation: uil-spin-css 0.8s linear infinite;
    animation-delay: -0.7s;
}

.uil-spin-css > div:nth-of-type(1)
{
    -webkit-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0);
    -ms-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0);
    transform: translate(84px, 84px) rotate(45deg) translate(70px, 0);
}

.uil-spin-css > div:nth-of-type(2) > div
{
    -webkit-animation: uil-spin-css 0.8s linear infinite;
    -webkit-animation-delay: -0.6s;
    -ms-animation: uil-spin-css 0.8s linear infinite;
    animation: uil-spin-css 0.8s linear infinite;
    animation-delay: -0.6s;
}

.uil-spin-css > div:nth-of-type(2)
{
    -webkit-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0);
    -ms-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0);
    transform: translate(84px, 84px) rotate(90deg) translate(70px, 0);
}

.uil-spin-css > div:nth-of-type(3) > div
{
    -webkit-animation: uil-spin-css 0.8s linear infinite;
    -webkit-animation-delay: -0.5s;
    -ms-animation: uil-spin-css 0.8s linear infinite;
    animation: uil-spin-css 0.8s linear infinite;
    animation-delay: -0.5s;
}

.uil-spin-css > div:nth-of-type(3)
{
    -webkit-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0);
    -ms-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0);
    transform: translate(84px, 84px) rotate(135deg) translate(70px, 0);
}

.uil-spin-css > div:nth-of-type(4) > div
{
    -webkit-animation: uil-spin-css 0.8s linear infinite;
    -webkit-animation-delay: -0.4s;
    -ms-animation: uil-spin-css 0.8s linear infinite;
    animation: uil-spin-css 0.8s linear infinite;
    animation-delay: -0.4s;
}

.uil-spin-css > div:nth-of-type(4)
{
    -webkit-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0);
    -ms-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0);
    transform: translate(84px, 84px) rotate(180deg) translate(70px, 0);
}

.uil-spin-css > div:nth-of-type(5) > div
{
    -webkit-animation: uil-spin-css 0.8s linear infinite;
    -webkit-animation-delay: -0.3s;
    -ms-animation: uil-spin-css 0.8s linear infinite;
    animation: uil-spin-css 0.8s linear infinite;
    animation-delay: -0.3s;
}

.uil-spin-css > div:nth-of-type(5)
{
    -webkit-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0);
    -ms-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0);
    transform: translate(84px, 84px) rotate(225deg) translate(70px, 0);
}

.uil-spin-css > div:nth-of-type(6) > div
{
    -webkit-animation: uil-spin-css 0.8s linear infinite;
    -webkit-animation-delay: -0.2s;
    -ms-animation: uil-spin-css 0.8s linear infinite;
    animation: uil-spin-css 0.8s linear infinite;
    animation-delay: -0.2s;
}

.uil-spin-css > div:nth-of-type(6)
{
    -webkit-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0);
    -ms-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0);
    transform: translate(84px, 84px) rotate(270deg) translate(70px, 0);
}

.uil-spin-css > div:nth-of-type(7) > div
{
    -webkit-animation: uil-spin-css 0.8s linear infinite;
    -webkit-animation-delay: -0.1s;
    animation: uil-spin-css 0.8s linear infinite;
    animation-delay: -0.1s;
}

.uil-spin-css > div:nth-of-type(7)
{
    -webkit-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0);
    -ms-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0);
    transform: translate(84px, 84px) rotate(315deg) translate(70px, 0);
}

.uil-spin-css > div:nth-of-type(8) > div
{
    -webkit-animation: uil-spin-css 0.8s linear infinite;
    -webkit-animation-delay: -0s;
    -ms-animation: uil-spin-css 0.8s linear infinite;
    animation: uil-spin-css 0.8s linear infinite;
    animation-delay: -0s;
}

.uil-spin-css > div:nth-of-type(8)
{
    -webkit-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0);
    -ms-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0);
    transform: translate(84px, 84px) rotate(360deg) translate(70px, 0);
}