.loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(250, 250, 250);
    z-index: 10000;
    animation-name: anim-bg;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.square-container {
    width: 120px;
    height: 60px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.square {
    position: absolute;
    width: 25%;
    height: 50%;
    padding: 5px;
}

.square div {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #94081d;
    box-shadow: 0px 0px 5px 0px;
    border-radius: 50%;
    animation-name: anim-square;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.sq-1 {
    top: 0;
    left: 0;
    animation-name: anim-sq1;
    animation-delay: 0s;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.sq-2 {
    top: 50%;
    left: 0;
    animation-name: anim-sq2;
    animation-delay: 0s;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.sq-3 {
    top: 50%;
    left: 25%;
    animation-name: anim-sq3;
    animation-delay: 0.166s;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.sq-4 {
    top: 50%;
    left: 50%;
    animation-name: anim-sq4;
    animation-delay: 0.33s;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.sq-5 {
    top: 50%;
    left: 75%;
    animation-name: anim-sq5;
    animation-delay: 0.5s;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes anim-square {
    0% {
        background: #94081d;
    }

    40% {
        background: #94081d;
    }
    
    50% {
        background: rgb(250,250,250);
    }
    90% {
        background: rgb(250,250,250);
    }
}

@keyframes anim-bg {    
    0% {
        background: rgb(250,250,250);
    }
    40% {
        background: rgb(250,250,250);
    }
    50% {
        background: #94081d;
    }

    90% {
        background: #94081d;
    }

}

@keyframes anim-sq1 {
    0% {
        top: 0;
        left: 0;
    }

    4.166% {
        top: 50%;
        left: 0;
    }

    8.332% {
        /*        top: ;*/
        /*        left: ;*/
    }

    12.498% {
        /*        top: ;*/
        /*        left: ;*/
    }

    16.664% {
        /*        top: ;*/
        /*        left: ;*/
    }

    20.83% {
        /*        top: ;*/
        /*        left: ;*/
    }

    24.996% {
        /*        top: ;*/
        /*        left: ;*/
    }

    29.162% {
        /*        top: ;*/
        /*        left: ;*/
    }

    33.328% {
        /*        top: ;*/
        /*        left: ;*/
    }

    37.494% {
        /*        top: ;*/
        /*        left: ;*/
    }

    41.66% {
        /*        top: ;*/
        /*        left: ;*/
    }

    45.826% {
        /*        top: ;*/
        /*        left: ;*/
    }

    49.992% {
        top: 50%;
        left: 0;
    }

    54.158% {
        top: 100%;
        left: 0%;
    }

    58.324% {
        top: 100%;
        left: 25%;
    }

    62.49% {
        top: 50%;
        left: 25%;
    }

    66.656% {
        /*        top: ;*/
        /*        left: ;*/
    }

    70.822% {
        /*        top: ;*/
        /*        left: ;*/
    }

    74.998% {
        /*        top: ;*/
        /*        left: ;*/
    }

    79.154% {
        /*        top: ;*/
        /*        left: ;*/
    }

    83.32% {
        /*        top: ;*/
        /*        left: ;*/
    }

    87.486% {
        /*        top: ;*/
        /*        left: ;*/
    }

    91.652% {
        top: 50%;
        left: 25%;
    }

    95.818% {
        top: 0%;
        left: 25%;
    }
}

@keyframes anim-sq2 {
    0% {
        top: 50%;
        left: 0;
    }

    4.166% {
        top: 100%;
        left: 0;
    }

    8.332% {
        top: 100%;
        left: 25%;
    }

    12.498% {
        top: 50%;
        left: 25%;
    }

    16.664% {
        /*        top: 0%;*/
        /*        left: ;*/
    }

    20.83% {
        /*        top: ;*/
        /*        left: ;*/
    }

    24.996% {
        /*        top: ;*/
        /*        left: ;*/
    }

    29.162% {
        /*        top: ;*/
        /*        left: ;*/
    }

    33.328% {
        /*        top: ;*/
        /*        left: ;*/
    }

    37.494% {
        /*        top: ;*/
        /*        left: ;*/
    }

    41.66% {
        top: 50%;
        left: 25%;
    }

    45.826% {
        top: 0%;
        left: 25%;
    }

    49.992% {
        top: 0%;
        left: 0%;
    }

    54.158% {
        top: 50%;
        left: 0%;
    }

    58.324% {
        /*        top: ;*/
        /*        left: ;*/
    }

    62.49% {
        /*        top: ;*/
        /*        left: ;*/
    }

    66.656% {
        /*        top: ;*/
        /*        left: ;*/
    }

    70.822% {}

    74.998% {
        /*        top: ;*/
        /*        left: ;*/
    }

    79.154% {
        /*        top: ;*/
        /*        left: ;*/
    }

    83.32% {
        /*        top: ;*/
        /*        left: ;*/
    }

    87.486% {
        /*        top: ;*/
        /*        left: ;*/
    }

    91.652% {
        /*        top: ;*/
        /*        left: ;*/
    }

    95.818% {
        /*        top: ;*/
        /*        left: ;*/
    }
}

@keyframes anim-sq3 {
    0% {
        top: 50%;
        left: 25%;
    }

    4.166% {
        top: 0%;
        left: 25%;
    }

    8.332% {
        top: 0;
        left: 50%;
    }

    12.498% {
        top: 50%;
        left: 50%;
    }

    16.664% {
        /*        top: ;*/
        /*        left: ;*/
    }

    20.83% {
        /*        top: ;*/
        /*        left: ;*/
    }

    24.996% {
        top: 50%;
        left: 50%;
    }

    29.162% {
        top: 100%;
        left: 50%;
    }

    33.328% {
        top: 100%;
        left: 25%;
    }

    37.494% {
        top: 50%;
        left: 25%;
    }

    41.66% {
        /*        top: ;*/
        /*        left: ;*/
    }

    45.826% {
        /*        top: ;*/
        /*        left: ;*/
    }

    49.992% {
        top: 50%;
        left: 25%;
    }

    54.158% {
        top: 0%;
        left: 25%;
    }

    58.324% {
        top: 0%;
        left: 50%;
    }

    62.49% {
        top: 50%;
        left: 50%;
    }

    66.656% {}

    70.822% {
        /*        top: ;*/
        /*        left: ;*/
    }

    74.998% {
        top: 50%;
        left: 50%;
    }

    79.154% {
        top: 100%;
        left: 50%;
    }

    83.32% {
        top: 100%;
        left: 25%;
    }

    87.486% {
        top: 50%;
        left: 25%;
    }

    91.652% {
        /*        top: ;*/
        /*        left: ;*/
    }

    95.818% {
        /*        top: ;*/
        /*        left: ;*/
    }
}

@keyframes anim-sq4 {
    0% {
        top: 50%;
        left: 50%;
    }

    4.166% {
        top: 100%;
        left: 50%;
    }

    8.332% {
        top: 100%;
        left: 75%;
    }

    12.498% {
        top: 50%;
        left: 75%;
    }

    16.664% {
        /*        top: ;*/
        /*        left: ;*/
    }

    20.83% {
        /*        top: ;*/
        /*        left: ;*/
    }

    24.996% {
        /*        top: ;*/
        /*        left: ;*/
    }

    29.162% {
        /*        top: ;*/
        /*        left: ;*/
    }

    33.328% {
        /*        top: ;*/
        /*        left: ;*/
    }

    37.494% {
        /*        top: ;*/
        /*        left: ;*/
    }

    41.66% {
        /*        top: ;*/
        /*        left: ;*/
    }

    45.826% {}

    49.992% {}

    54.158% {
        /*        top: ;*/
        /*        left: ;*/
    }

    58.324% {
        top: 50%;
        left: 75%;
    }

    62.49% {
        top: 0%;
        left: 75%;
    }

    66.656% {
        top: 0%;
        left: 50%;
    }

    70.822% {
        top: 50%;
        left: 50%;
    }

    74.998% {
        /*        top: ;*/
        /*        left: ;*/
    }

    79.154% {
        /*        top: ;*/
        /*        left: ;*/
    }

    83.32% {
        /*        top: ;*/
        /*        left: ;*/
    }

    87.486% {
        /*        top: ;*/
        /*        left: ;*/
    }

    91.652% {
        /*        top: ;*/
        /*        left: ;*/
    }

    95.818% {
        /*        top: ;*/
        /*        left: ;*/
    }
}

@keyframes anim-sq5 {
    0% {
        top: 50%;
        left: 75%;
    }

    4.166% {
        top: 0;
        left: 75%;
    }

    8.332% {
        top: 0%;
        left: 50%;
    }

    12.498% {
        top: 50%;
        left: 50%;
    }

    16.664% {
        /*        top: ;*/
        /*        left: ;*/
    }

    20.83% {
        /*        top: ;*/
        /*        left: ;*/
    }

    24.996% {
        /*        top: ;*/
        /*        left: ;*/
    }

    29.162% {
        /*        top: ;*/
        /*        left: ;*/
    }

    33.328% {
        /*        top: ;*/
        /*        left: ;*/
    }

    37.494% {
        /*        top: ;*/
        /*        left: ;*/
    }

    41.66% {
        top: 50%;
        left: 50%;
    }

    45.826% {
        top: 100%;
        left: 50%;
    }

    49.992% {
        top: 100%;
        left: 75%;
    }

    54.158% {
        top: 50%;
        left: 75%;
    }

    58.324% {}

    62.49% {
        /*        top: ;*/
        /*        left: ;*/
    }

    66.656% {
        /*        top: ;*/
        /*        left: ;*/
    }

    70.822% {
        /*        top: ;*/
        /*        left: ;*/
    }

    74.998% {
        /*        top: ;*/
        /*        left: ;*/
    }

    79.154% {
        /*        top: ;*/
        /*        left: ;*/
    }

    83.32% {
        /*        top: ;*/
        /*        left: ;*/
    }

    87.486% {
        /*        top: ;*/
        /*        left: ;*/
    }

    91.652% {
        /*        top: ;*/
        /*        left: ;*/
    }

    95.818% {
        /*        top: ;*/
        /*        left: ;*/
    }
}