body {
    margin: 0;
}

.loader-container {
    display: flex;
    width: 100%;
    height: 100%;
    overflow: hidden;
    min-height: 100vh;
    background: #262626;
}

.loader {
    position: relative;
    margin: auto;
}

.middle {
    top: -50px;
    left: -50px;
    // width: 40 px;
    // height: 2 px;
    font-size: 4rem;
    font-family: monospace, 'Open Sans', Helvetica, Arial, sans-serif;

    // background: white;
    color: white;

    position: absolute;
    animation: middleAnimation 2s infinite linear;
    animation-delay: -100ms;
}

@keyframes middleAnimation {
    0% {
        transform: translate(-19px, -9px) scaleX(1);
    }
    25% {
        transform: translate(-19px, -9px) scaleX(0.4);
    }
    50% {
        transform: translate(-19px, -9px) scaleX(1);
    }
    75% {
        transform: translate(-19px, -9px) scaleX(0.7);
    }
    100% {
        transform: translate(-19px, -9px) scaleX(1);
    }
}