.preloader {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100vh;
    background-color: #fff;
    z-index: 100000;
    position:fixed;
    top:0;
    left:0;
}
.hidden{
    overflow:hidden;
}
.spinner {
    position: relative;
    width: 15.7px;
    height: 15.7px;
}

    .spinner div {
        width: 100%;
        height: 100%;
        background-color: #ef6f6e;
        border-radius: 50%;
        animation: spinner-4t3wzl 1.25s infinite backwards;
    }

        .spinner div:nth-child(1) {
            animation-delay: 0.15s;
            background-color: rgba(237,107,29,1);
        }

        .spinner div:nth-child(2) {
            animation-delay: 0.3s;
            background-color: rgba(237,107,29,0.9);
        }

        .spinner div:nth-child(3) {
            animation-delay: 0.45s;
            background-color: rgba(237,107,29,0.8);
        }

        .spinner div:nth-child(4) {
            animation-delay: 0.6s;
            background-color: rgba(237,107,29,0.7);
        }

        .spinner div:nth-child(5) {
            animation-delay: 0.75s;
            background-color: rgba(237,107,29,0.6);
        }

@keyframes spinner-4t3wzl {
    0% {
        transform: rotate(0deg) translateY(-200%);
    }

    60%, 100% {
        transform: rotate(360deg) translateY(-200%);
    }
}