.spinner-back {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9999999999999999999;
    top: 0px;
    cursor: progress;
    background: rgba(0, 0, 0, 0.43);
}

/*/////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////  Spinner - Plane ///////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////*/

.plane-loader {
    background-size: 30px;
    width: 30px;
    height: 30px;
    position: fixed;
    top: 40%;
    left: 40%;
}

.ajax-text {
    left: 40%;
    top: 40%;
    width: 20%;
    min-width: 300px;
    max-width: 300px;
    position: absolute;
    margin-top: 63px;
    text-align: center;
    color: #fff;
    font-size: 1.25em;
    font-weight: 400;
}

.ajax-text:after {
    content: attr(data-text);
}

.ajax-cover {
    width: 100%;
    height: 100%;
    top: 0;
    position: fixed;
    background: rgb(226, 226, 226);
    background: rgba(226, 226, 226, 0.54);
    filter: alpha(opacity=70);
    z-index: 99999999999999999;
}

form.blur {
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
}

div.blur {
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
}

.spinner__logo {
    background-position: center bottom;
    background-repeat: no-repeat;
    padding-top: 23%;
    display: inline-block;
    width: 100%;
    position: relative;
    float: left;
}

.loader {
    margin-left: calc(50% - 135px);
    margin-top: 40px;
}


@media only screen and (max-width: 768px) {
    .loader {
        margin-top: 45%;
    }
}

@media only screen and (max-width: 435px) {
    .loader {
        margin-top: 68%;
    }
}

.loader:before {
    content: "";
    display: block;
    position: absolute;
    margin-top: 5px;
    height: 4px;
    background: #0C55A4;
    animation: getBiggerInv 4s linear infinite;
    margin-top: -117px;
}

.loader:after {
    content: "";
    display: block;
    position: absolute;
    margin-top: 5px;
    height: 4px;
    background: #fff;
    animation: getBigger 4s linear infinite;
    filter: brightness(150%);
    -webkit-filter: brightness(150%);
}


@keyframes getBigger {
    0% {
        width: 0px;
        transform: translateX(0px);
    }
    12.5% {
        width: 73px;
        transform: translateX(12px);
    }
    25% {
        width: 126px;
        transform: translateX(36px);
        animation-timing-function: ease-out;
    }
    50% {
        width: 150px;
        transform: translateX(120px);
    }
    75% {
        width: 100px;
        transform: translateX(35px);
        animation-timing-function: ease-out;
    }
    100% {
        width: 0px;
        transform: translateX(0px);
    }
}

@keyframes getBiggerInv {
    0% {
        width: 0px;
        transform: translateX(270px);
    }
    12.5% {
        width: 73px;
        transform: translateX(185px);
    }
    25% {
        width: 126px;
        transform: translateX(108px);
        animation-timing-function: ease-out;
    }
    50% {
        width: 150px;
        transform: translateX(0px);
    }
    75% {
        width: 100px;
        transform: translateX(135px);
        animation-timing-function: ease-out;
    }
    100% {
        width: 0px;
        transform: translateX(270px);
    }
}

/*/////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////  End / Spinner - Plane ////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////*/