﻿.loading
{
    align-items: center;
    background-color: #000;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1080;
}
.loading__container
{
    animation: _scale 1s ease-in-out infinite both;
    margin-left: -100px;
    margin-top: -100px;
    transform-origin: 50px 50px;
}
.loading__figures
{
    position: absolute;
}
.loading__figures--f1
{
    animation: _rotate 2s linear infinite,_colorChangin 8s linear infinite;
    opacity: .4;
    transform: rotate(45deg);
}
.loading__figures--f2
{
    animation: _rotate 4s linear infinite,_colorChangin 8s linear infinite;
}
.loading__logo
{
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
}
@keyframes _colorChangin
{
    0%, to
    {
        fill: #fcee20;
    }
    25%
    {
        fill: #35ec94;
    }
    50%
    {
        fill: #62d6fb;
    }
    75%
    {
        fill: #bc68fe;
    }
}
@keyframes _rotate
{
    0%
    {
        transform: rotate(0);
    }
    to
    {
        transform: rotate(1turn);
    }
}
@keyframes _scale
{
    0%, to
    {
        scale: 1;
    }
    50%
    {
        scale: 1.15;
    }
}