@-webkit-keyframes loading-opacity {
    0% {
        opacity: 0;
    }

    10% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 1;
    }
}
@keyframes loading-opacity {
    0% {
        opacity: 0;
    }

    10% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 1;
    }
}
@-webkit-keyframes loading {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    10% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    45% {
        -webkit-transform: translateX(320px/2);
        transform: translateX(320px/2);
    }

    55% {
        -webkit-transform: translateX(320px/2);
        transform: translateX(320px/2);
    }

    90% {
        -webkit-transform: translateX(320px);
        transform: translateX(320px);
    }

    100% {
        -webkit-transform: translateX(320px);
        transform: translateX(320px);
    }
}
@keyframes loading {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    10% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    45% {
        -webkit-transform: translateX(320px/2);
        transform: translateX(320px/2);
    }

    55% {
        -webkit-transform: translateX(320px/2);
        transform: translateX(320px/2);
    }

    90% {
        -webkit-transform: translateX(320px);
        transform: translateX(320px);
    }

    100% {
        -webkit-transform: translateX(320px);
        transform: translateX(320px);
    }
}
.splashscreen {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
 width:100%;
 height:50px;

 
    margin:auto auto;
}

.splashscreen-loader-container {
    width: 320px;
     margin:0 auto;
       margin-top: 56px;
 
   
}

    .splashscreen-loader-container > div {
        opacity: 0;
        display: inline-block;
        height: 10px;
        width: 10px;
        border-radius: 50%;
        background-color: #b1017c;
        -webkit-animation: loading 1s cubic-bezier(0,.95,1,.05) infinite,loading-opacity 0.5s ease-in-out infinite alternate;
        animation: loading 1s cubic-bezier(0,.95,1,.05) infinite,loading-opacity 0.5s ease-in-out infinite alternate;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }

        .splashscreen-loader-container > div:nth-child(5) {
            -webkit-animation-delay: .0s;
            animation-delay: .0s;
        }

        .splashscreen-loader-container > div:nth-child(4) {
            -webkit-animation-delay: .050s;
            animation-delay: .050s;
        }

        .splashscreen-loader-container > div:nth-child(3) {
            -webkit-animation-delay: .1s;
            animation-delay: .1s;
        }

        .splashscreen-loader-container > div:nth-child(2) {
            -webkit-animation-delay: .15s;
            animation-delay: .15s;
        }

        .splashscreen-loader-container > div:nth-child(1) {
            -webkit-animation-delay: .2s;
            animation-delay: .2s;
        }