/*CSS HANDLER */
body {
    margin: 0;
    padding: 0;
    background: #808080;
}
.InsLoader {
    position: fixed;
    z-index: 10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 150px;
    height: 150px;
    display: none;
}
.InsLoader-item {
    position: absolute;
    top: 50%;
    left: 5%;
    width: 20px;
    height: 20px;
    background: #000;
    border-radius: 50%;
    box-shadow: 0px 0px 7px -5px #000;
    transform: translate(-50%, -50%);
    animation: animate 2s ease-in infinite, scale 3s ease infinite;
}
.InsLoader-item_red {
    background: #f00;
}
.InsLoader-item_green {
    background: #0f0;
    animation-delay: -0.5s;
}
.InsLoader-item_blue {
    background: #00f;
    animation-delay: -1s;
}
.InsLoader-item_yellow {
    background: #ff0;
    animation-delay: -1.5s;
}
@keyframes animate {
    0% {
        top: 50%;
        left: 5%;
   }
    25% {
        top: 5%;
        left: 50%;
   }
    50% {
        top: 50%;
        left: 85%;
   }
    75% {
        top: 85%;
        left: 50%;
   }
}
@keyframes scale {
    0% {
        transform: scale(1);
   }
    25% {
        transform: scale(1.5);
   }
    50% {
        transform: scale(1);
   }
    75% {
        transform: scale(1.5);
   }
}
