.loading {
    position: fixed;
    top: 0;
    left: 0;
    z-index:111;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,.3);
}

    .loading i {
        position: absolute;
        z-index:999;
        top: 50%;
        left: 50%;
        font-size: 40px;
        color: #e04c41;
        -webkit-transition-property: -webkit-transform;
        -webkit-transition-duration: 1s;
        -moz-transition-property: -moz-transform;
        -moz-transition-duration: 1s;
        -webkit-animation: rotate 3s linear infinite;
        -moz-animation: rotate 3s linear infinite;
        -o-animation: rotate 3s linear infinite;
        animation: rotate 3s linear infinite;
        infinite;
        width: auto;
        height: auto;
    }

@-webkit-keyframes rotate {
    from {
        -webkit-transform: translate(-50%) rotate(0deg);
    }

    to {
        -webkit-transform: translate(-50%) rotate(360deg);
    }
}

@-moz-keyframes rotate {
    from {
        -moz-transform: translate(-50%) rotate(0deg);
    }

    to {
        -moz-transform: translate(-50%) rotate(359deg);
    }
}

@-o-keyframes rotate {
    from {
        -o-transform: translate(-50%) rotate(0deg);
    }

    to {
        -o-transform: translate(-50%) rotate(359deg);
    }
}

@keyframes rotate {
    from {
        transform: translate(-50%) rotate(0deg);
    }

    to {
        transform: translate(-50%) rotate(359deg);
    }
}