#loading-wrapper {
    background-color: rgba(240,240,240,0.6);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*height:calc(100% + 17em);*/
    z-index: 9997;
    display:none;
}

.cssload-loading {
    position: absolute;
    left: 50%;
    top: 30%;
    width: 22px;
    height: 22px;
    margin: -11px 0 0 -11px;
    z-index: 9998;
}

    .cssload-loading i {
        position: absolute;
        top: 22px;
        left: 22px;
        display: block;
        width: 22px;
        height: 22px;
        background: rgb(249,187,54);
        border-radius: 22px;
        animation: cssload-spin2 1.95s ease-in-out infinite;
        -o-animation: cssload-spin2 1.95s ease-in-out infinite;
        -ms-animation: cssload-spin2 1.95s ease-in-out infinite;
        -webkit-animation: cssload-spin2 1.95s ease-in-out infinite;
        -moz-animation: cssload-spin2 1.95s ease-in-out infinite;
    }

        .cssload-loading i:first-child {
            top: -22px;
            left: 0;
            background: rgb(228,19,33);
            animation: cssload-spin 1.95s ease-in-out infinite;
            -o-animation: cssload-spin 1.95s ease-in-out infinite;
            -ms-animation: cssload-spin 1.95s ease-in-out infinite;
            -webkit-animation: cssload-spin 1.95s ease-in-out infinite;
            -moz-animation: cssload-spin 1.95s ease-in-out infinite;
        }

        .cssload-loading i:last-child {
            top: 22px;
            left: -22px;
            background: rgb(16,150,74);
            animation: cssload-spin3 1.95s ease-in-out infinite;
            -o-animation: cssload-spin3 1.95s ease-in-out infinite;
            -ms-animation: cssload-spin3 1.95s ease-in-out infinite;
            -webkit-animation: cssload-spin3 1.95s ease-in-out infinite;
            -moz-animation: cssload-spin3 1.95s ease-in-out infinite;
        }






@keyframes cssload-spin {
    0% {
        top: -22px;
        left: 0;
        transform: scale(1);
    }

    17% {
        transform: scale(.5);
    }

    33% {
        top: 22px;
        left: 22px;
        transform: scale(1);
    }

    50% {
        transform: scale(.5);
    }

    66% {
        top: 22px;
        left: -22px;
        transform: scale(1);
    }

    83% {
        transform: scale(.5);
    }

    100% {
        top: -22px;
        left: 0;
        transform: scale(1);
    }
}

@-o-keyframes cssload-spin {
    0% {
        top: -22px;
        left: 0;
        -o-transform: scale(1);
    }

    17% {
        -o-transform: scale(.5);
    }

    33% {
        top: 22px;
        left: 22px;
        -o-transform: scale(1);
    }

    50% {
        -o-transform: scale(.5);
    }

    66% {
        top: 22px;
        left: -22px;
        -o-transform: scale(1);
    }

    83% {
        -o-transform: scale(.5);
    }

    100% {
        top: -22px;
        left: 0;
        -o-transform: scale(1);
    }
}

@-ms-keyframes cssload-spin {
    0% {
        top: -22px;
        left: 0;
        -ms-transform: scale(1);
    }

    17% {
        -ms-transform: scale(.5);
    }

    33% {
        top: 22px;
        left: 22px;
        -ms-transform: scale(1);
    }

    50% {
        -ms-transform: scale(.5);
    }

    66% {
        top: 22px;
        left: -22px;
        -ms-transform: scale(1);
    }

    83% {
        -ms-transform: scale(.5);
    }

    100% {
        top: -22px;
        left: 0;
        -ms-transform: scale(1);
    }
}

@-webkit-keyframes cssload-spin {
    0% {
        top: -22px;
        left: 0;
        -webkit-transform: scale(1);
    }

    17% {
        -webkit-transform: scale(.5);
    }

    33% {
        top: 22px;
        left: 22px;
        -webkit-transform: scale(1);
    }

    50% {
        -webkit-transform: scale(.5);
    }

    66% {
        top: 22px;
        left: -22px;
        -webkit-transform: scale(1);
    }

    83% {
        -webkit-transform: scale(.5);
    }

    100% {
        top: -22px;
        left: 0;
        -webkit-transform: scale(1);
    }
}

@-moz-keyframes cssload-spin {
    0% {
        top: -22px;
        left: 0;
        -moz-transform: scale(1);
    }

    17% {
        -moz-transform: scale(.5);
    }

    33% {
        top: 22px;
        left: 22px;
        -moz-transform: scale(1);
    }

    50% {
        -moz-transform: scale(.5);
    }

    66% {
        top: 22px;
        left: -22px;
        -moz-transform: scale(1);
    }

    83% {
        -moz-transform: scale(.5);
    }

    100% {
        top: -22px;
        left: 0;
        -moz-transform: scale(1);
    }
}

@keyframes cssload-spin2 {
    0% {
        top: 22px;
        left: 22px;
        transform: scale(1);
    }

    17% {
        transform: scale(.5);
    }

    33% {
        top: 22px;
        left: -22px;
        transform: scale(1);
    }

    50% {
        transform: scale(.5);
    }

    66% {
        top: -22px;
        left: 0;
        transform: scale(1);
    }

    83% {
        transform: scale(.5);
    }

    100% {
        top: 22px;
        left: 22px;
        transform: scale(1);
    }
}

@-o-keyframes cssload-spin2 {
    0% {
        top: 22px;
        left: 22px;
        -o-transform: scale(1);
    }

    17% {
        -o-transform: scale(.5);
    }

    33% {
        top: 22px;
        left: -22px;
        -o-transform: scale(1);
    }

    50% {
        -o-transform: scale(.5);
    }

    66% {
        top: -22px;
        left: 0;
        -o-transform: scale(1);
    }

    83% {
        -o-transform: scale(.5);
    }

    100% {
        top: 22px;
        left: 22px;
        -o-transform: scale(1);
    }
}

@-ms-keyframes cssload-spin2 {
    0% {
        top: 22px;
        left: 22px;
        -ms-transform: scale(1);
    }

    17% {
        -ms-transform: scale(.5);
    }

    33% {
        top: 22px;
        left: -22px;
        -ms-transform: scale(1);
    }

    50% {
        -ms-transform: scale(.5);
    }

    66% {
        top: -22px;
        left: 0;
        -ms-transform: scale(1);
    }

    83% {
        -ms-transform: scale(.5);
    }

    100% {
        top: 22px;
        left: 22px;
        -ms-transform: scale(1);
    }
}

@-webkit-keyframes cssload-spin2 {
    0% {
        top: 22px;
        left: 22px;
        -webkit-transform: scale(1);
    }

    17% {
        -webkit-transform: scale(.5);
    }

    33% {
        top: 22px;
        left: -22px;
        -webkit-transform: scale(1);
    }

    50% {
        -webkit-transform: scale(.5);
    }

    66% {
        top: -22px;
        left: 0;
        -webkit-transform: scale(1);
    }

    83% {
        -webkit-transform: scale(.5);
    }

    100% {
        top: 22px;
        left: 22px;
        -webkit-transform: scale(1);
    }
}

@-moz-keyframes cssload-spin2 {
    0% {
        top: 22px;
        left: 22px;
        -moz-transform: scale(1);
    }

    17% {
        -moz-transform: scale(.5);
    }

    33% {
        top: 22px;
        left: -22px;
        -moz-transform: scale(1);
    }

    50% {
        -moz-transform: scale(.5);
    }

    66% {
        top: -22px;
        left: 0;
        -moz-transform: scale(1);
    }

    83% {
        -moz-transform: scale(.5);
    }

    100% {
        top: 22px;
        left: 22px;
        -moz-transform: scale(1);
    }
}

@keyframes cssload-spin3 {
    0% {
        top: 22px;
        left: -22px;
        transform: scale(1);
    }

    17% {
        transform: scale(.5);
    }

    33% {
        top: -22px;
        left: 0;
        transform: scale(1);
    }

    50% {
        transform: scale(.5);
    }

    66% {
        top: 22px;
        left: 22px;
        transform: scale(1);
    }

    83% {
        transform: scale(.5);
    }

    100% {
        top: 22px;
        left: -22px;
        transform: scale(1);
    }
}

@-o-keyframes cssload-spin3 {
    0% {
        top: 22px;
        left: -22px;
        -o-transform: scale(1);
    }

    17% {
        -o-transform: scale(.5);
    }

    33% {
        top: -22px;
        left: 0;
        -o-transform: scale(1);
    }

    50% {
        -o-transform: scale(.5);
    }

    66% {
        top: 22px;
        left: 22px;
        -o-transform: scale(1);
    }

    83% {
        -o-transform: scale(.5);
    }

    100% {
        top: 22px;
        left: -22px;
        -o-transform: scale(1);
    }
}

@-ms-keyframes cssload-spin3 {
    0% {
        top: 22px;
        left: -22px;
        -ms-transform: scale(1);
    }

    17% {
        -ms-transform: scale(.5);
    }

    33% {
        top: -22px;
        left: 0;
        -ms-transform: scale(1);
    }

    50% {
        -ms-transform: scale(.5);
    }

    66% {
        top: 22px;
        left: 22px;
        -ms-transform: scale(1);
    }

    83% {
        -ms-transform: scale(.5);
    }

    100% {
        top: 22px;
        left: -22px;
        -ms-transform: scale(1);
    }
}

@-webkit-keyframes cssload-spin3 {
    0% {
        top: 22px;
        left: -22px;
        -webkit-transform: scale(1);
    }

    17% {
        -webkit-transform: scale(.5);
    }

    33% {
        top: -22px;
        left: 0;
        -webkit-transform: scale(1);
    }

    50% {
        -webkit-transform: scale(.5);
    }

    66% {
        top: 22px;
        left: 22px;
        -webkit-transform: scale(1);
    }

    83% {
        -webkit-transform: scale(.5);
    }

    100% {
        top: 22px;
        left: -22px;
        -webkit-transform: scale(1);
    }
}

@-moz-keyframes cssload-spin3 {
    0% {
        top: 22px;
        left: -22px;
        -moz-transform: scale(1);
    }

    17% {
        -moz-transform: scale(.5);
    }

    33% {
        top: -22px;
        left: 0;
        -moz-transform: scale(1);
    }

    50% {
        -moz-transform: scale(.5);
    }

    66% {
        top: 22px;
        left: 22px;
        -moz-transform: scale(1);
    }

    83% {
        -moz-transform: scale(.5);
    }

    100% {
        top: 22px;
        left: -22px;
        -moz-transform: scale(1);
    }
}