@keyframes spinner {
    0% {
        -webkit-transform: rotateY(0deg);
        -webkit-transform-style: preserve-3d;
        -ms-transform: rotateY(0deg);
        transform: rotateY(0deg);
        transform-style: preserve-3d;
        -webkit-filter: none;
        filter: none;
    }

    30% {
        -webkit-transform: rotateY(40deg);
        -webkit-transform-style: preserve-3d;
        -ms-transform: rotateY(40deg);
        transform: rotateY(40deg);
        transform-style: preserve-3d;
        -webkit-filter: none;
        filter: none;
    }

    40% {
        -webkit-transform: rotateY(80deg);
        -webkit-transform-style: preserve-3d;
        -ms-transform: rotateY(80deg);
        transform: rotateY(80deg);
        transform-style: preserve-3d;
        -webkit-filter: none;
        filter: none;
    }

    50% {
        -webkit-transform: rotateY(120deg);
        -webkit-transform-style: preserve-3d;
        -ms-transform: rotateY(120deg);
        transform: rotateY(120deg);
        transform-style: preserve-3d;
        -webkit-filter: none;
        filter: none;
    }

    70% {
        -webkit-transform: rotateY(160deg);
        -webkit-transform-style: preserve-3d;
        -ms-transform: rotateY(160deg);
        transform: rotateY(160deg);
        transform-style: preserve-3d;
        -webkit-filter: none;
        filter: none;
    }

    80% {
        -webkit-transform: rotateY(200deg);
        -webkit-transform-style: preserve-3d;
        -ms-transform: rotateY(200deg);
        transform: rotateY(200deg);
        transform-style: preserve-3d;
        -webkit-filter: none;
        filter: none;
    }

    100% {
        -webkit-transform: rotateY(240deg);
        -webkit-transform-style: preserve-3d;
        -ms-transform: rotateY(240deg);
        transform: rotateY(240deg);
        transform-style: preserve-3d;
        -webkit-filter: none;
        filter: none;
    }
}

.loader {
    
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(12,95,168,0.8);
    z-index: 9999;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    
}

    .loader img {
        width: 33px;
        height: 63px;
        
        position: absolute;
        top: 50vh;
        left: 50%;
        margin: -60px 0 0 -15px;
        z-index: 99999;
    }

    .loader img {
        -webkit-animation: spinner 1.4s infinite;
        animation: spinner 1.4s infinite;
        -webkit-animation-timing-function: cubic-bezier(.78,0,.3,1);
        animation-timing-function: cubic-bezier(.78,0,.3,1);
    }