/* #Page Loader 1 Css
================================================== */
.overlayer {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9999;
    background: #f4f8f9;
    top: 0;
    left: 0;
}

.cube-folding {
    width: 50px;
    height: 50px;
    display: inline-block;
    transform: rotate(45deg);
    font-size: 0;
}

    .cube-folding span {
        position: relative;
        width: 25px;
        height: 25px;
        transform: scale(1.1);
        display: inline-block;
    }

        .cube-folding span::before {
            content: "";
            background-color: #7fdcfb;
            position: absolute;
            left: 0;
            top: 0;
            display: block;
            width: 25px;
            height: 25px;
            transform-origin: 100% 100%;
            -webkit-animation: folding 2.5s infinite linear both;
            -moz-animation: folding 2.5s infinite linear both;
            animation: folding 2.5s infinite linear both;
        }

    .cube-folding .leaf2 {
        transform: rotateZ(90deg) scale(1.1);
    }

        .cube-folding .leaf2::before {
            animation-delay: 0.3s;
            background-color: #4ecef9;
        }

    .cube-folding .leaf3 {
        transform: rotateZ(270deg) scale(1.1);
    }

        .cube-folding .leaf3::before {
            animation-delay: 0.9s;
            background-color: #18b8ed;
        }

    .cube-folding .leaf4 {
        transform: rotateZ(180deg) scale(1.1);
    }

        .cube-folding .leaf4::before {
            animation-delay: 0.6s;
            background-color: #4bc6ef;
        }

@-webkit-keyframes folding {
    0%, 10% {
        -webkit-transform: perspective(140px) rotateX(-180deg);
        -moz-transform: perspective(140px) rotateX(-180deg);
        transform: perspective(140px) rotateX(-180deg);
        -webkit-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
    }

    25%, 75% {
        -webkit-transform: perspective(140px) rotateX(0deg);
        -moz-transform: perspective(140px) rotateX(0deg);
        transform: perspective(140px) rotateX(0deg);
        -webkit-opacity: 1;
        -moz-opacity: 1;
        opacity: 1;
    }

    90%, 100% {
        -webkit-transform: perspective(140px) rotateY(180deg);
        -moz-transform: perspective(140px) rotateY(180deg);
        transform: perspective(140px) rotateY(180deg);
        -webkit-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
    }
}

@-moz-keyframes folding {
    0%, 10% {
        -webkit-transform: perspective(140px) rotateX(-180deg);
        -moz-transform: perspective(140px) rotateX(-180deg);
        transform: perspective(140px) rotateX(-180deg);
        -webkit-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
    }

    25%, 75% {
        -webkit-transform: perspective(140px) rotateX(0deg);
        -moz-transform: perspective(140px) rotateX(0deg);
        transform: perspective(140px) rotateX(0deg);
        -webkit-opacity: 1;
        -moz-opacity: 1;
        opacity: 1;
    }

    90%, 100% {
        -webkit-transform: perspective(140px) rotateY(180deg);
        -moz-transform: perspective(140px) rotateY(180deg);
        transform: perspective(140px) rotateY(180deg);
        -webkit-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
    }
}

@-ms-keyframes folding {
    0%, 10% {
        -webkit-transform: perspective(140px) rotateX(-180deg);
        -moz-transform: perspective(140px) rotateX(-180deg);
        transform: perspective(140px) rotateX(-180deg);
        -webkit-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
    }

    25%, 75% {
        -webkit-transform: perspective(140px) rotateX(0deg);
        -moz-transform: perspective(140px) rotateX(0deg);
        transform: perspective(140px) rotateX(0deg);
        -webkit-opacity: 1;
        -moz-opacity: 1;
        opacity: 1;
    }

    90%, 100% {
        -webkit-transform: perspective(140px) rotateY(180deg);
        -moz-transform: perspective(140px) rotateY(180deg);
        transform: perspective(140px) rotateY(180deg);
        -webkit-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
    }
}

@keyframes folding {
    0%, 10% {
        -webkit-transform: perspective(140px) rotateX(-180deg);
        -moz-transform: perspective(140px) rotateX(-180deg);
        transform: perspective(140px) rotateX(-180deg);
        -webkit-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
    }

    25%, 75% {
        -webkit-transform: perspective(140px) rotateX(0deg);
        -moz-transform: perspective(140px) rotateX(0deg);
        transform: perspective(140px) rotateX(0deg);
        -webkit-opacity: 1;
        -moz-opacity: 1;
        opacity: 1;
    }

    90%, 100% {
        -webkit-transform: perspective(140px) rotateY(180deg);
        -moz-transform: perspective(140px) rotateY(180deg);
        transform: perspective(140px) rotateY(180deg);
        -webkit-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
    }
}

.cube-wrapper {
    position: fixed;
    left: 50%;
    top: 50%;
    margin-top: -50px;
    margin-left: -50px;
    width: 100px;
    height: 100px;
    text-align: center;
    z-index: 9999;
}

    .cube-wrapper:after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -20px;
        margin: auto;
        width: 90px;
        height: 6px;
        z-index: 1;
        background-color: rgba(0, 0, 0, 0.1);
        -webkit-filter: blur(2px);
        filter: blur(2px);
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%;
        -webkit-animation: shadow 0.5s ease infinite alternate;
        -moz-animation: shadow 0.5s ease infinite alternate;
        animation: shadow 0.5s ease infinite alternate;
    }

    .cube-wrapper .loading {
        font-size: 12px;
        letter-spacing: 0.1em;
        display: block;
        color: #000;
        position: relative;
        top: 25px;
        z-index: 2;
        -webkit-animation: text 0.5s ease infinite alternate;
        -moz-animation: text 0.5s ease infinite alternate;
        animation: text 0.5s ease infinite alternate;
    }

@-webkit-keyframes text {
    100% {
        top: 35px;
    }
}

@-moz-keyframes text {
    100% {
        top: 35px;
    }
}

@-ms-keyframes text {
    100% {
        top: 35px;
    }
}

@keyframes text {
    100% {
        top: 35px;
    }
}

@-webkit-keyframes shadow {
    100% {
        bottom: -18px;
        width: 100px;
    }
}

@-moz-keyframes shadow {
    100% {
        bottom: -18px;
        width: 100px;
    }
}

@-ms-keyframes shadow {
    100% {
        bottom: -18px;
        width: 100px;
    }
}

@keyframes shadow {
    100% {
        bottom: -18px;
        width: 100px;
    }
}




/* #Page Loader 2 CSS
================================================== */



.spinnerWrapper {
    position: fixed;
    left: 50%;
    top: 50%;
    margin-top: -50px;
    margin-left: -50px;
    width: 100px;
    height: 70px;
    text-align: center;
    z-index: 9999;
}

    .spinnerWrapper .spinnerLoading {
        font-size: 12px;
        letter-spacing: 0.1em;
        display: block;
        color: #000;
        position: relative;
        top: 30px;
        z-index: 2;
        -webkit-animation: text 0.5s ease infinite alternate;
        -moz-animation: text 0.5s ease infinite alternate;
        animation: text 0.5s ease infinite alternate;
    }

    .spinnerWrapper:after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -20px;
        margin: auto;
        width: 90px;
        height: 6px;
        z-index: 1;
        background-color: rgba(0, 0, 0, 0.1);
        -webkit-filter: blur(2px);
        filter: blur(2px);
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%;
        -webkit-animation: shadow 0.5s ease infinite alternate;
        -moz-animation: shadow 0.5s ease infinite alternate;
        animation: shadow 0.5s ease infinite alternate;
    }

.LvSpinner {
    margin: auto;
    width: 40px;
    height: 10px;
    font-size: 10px;
    margin-bottom: 0.8rem;
    margin-left: 28px
}

.LvSpinner > div {
    height: 100%;
    width: 100%;
    display: block;
    margin-bottom: 0.6em;
    -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
    animation: stretchdelay 1.2s infinite ease-in-out;
}

.LvSpinner .rect2 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

.LvSpinner .rect3 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleX(0.8);
        -moz-transform: scaleX(0.8);
        transform: scaleX(0.8);
        background-color: #5fd2f9;
        box-shadow: 0 0 0 rgba(10,10,10,.1);
    }

    20% {
        -webkit-transform: scaleX(1);
        -moz-transform: scaleX(1);
        transform: scaleX(1);
        background-color: #18b8ed;
        box-shadow: 0 5px 6px rgba(10,10,10,.4);
    }
}

@-ms-keyframes stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleX(0.8);
        -moz-transform: scaleX(0.8);
        background-color: #5fd2f9;
        transform: scaleY(0.8);
        box-shadow: 0 0 0 rgba(10,10,10,.1);
    }

    20% {
        -webkit-transform: scaleX(1);
        -moz-transform: scaleX(1);
        transform: scaleX(1);
        background-color: #18b8ed;
        transform: scaleY(1);
        box-shadow: 0 5px 6px rgba(10,10,10,.4);
    }
}

@-moz-keyframes stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleX(0.8);
        -moz-transform: scaleX(0.8);
        transform: scaleX(0.8);
        background-color: #5fd2f9;
        box-shadow: 0 0 0 rgba(10,10,10,.1);
    }

    20% {
        -webkit-transform: scaleX(1);
        -moz-transform: scaleX(1);
        transform: scaleX(1);
        background-color: #18b8ed;
        box-shadow: 0 5px 6px rgba(10,10,10,.4);
    }
}

@keyframes stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleX(0.8);
        -moz-transform: scaleX(0.8);
        transform: scaleX(0.8);
        background-color: #5fd2f9;
        box-shadow: 0 0 0 rgba(10,10,10,.1);
    }

    20% {
        -webkit-transform: scaleX(1);
        -moz-transform: scaleX(1);
        transform: scaleY(1);
        background-color: #18b8ed;
        box-shadow: 0 5px 6px rgba(10,10,10,.4);
    }
}



/* #Page Loader 3 CSS - Datatable
================================================== */

.overlayer_Cldatatable {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9999;
    background: #f4f8f9;
    top: 0;
    left: 0;
}

.spinnerWrapper_Cldatatable {
    position: fixed;
    left: 50%;
    top: 50%;
    margin-top: -50px;
    margin-left: -50px;
    width: 100px;
    height: 70px;
    text-align: center;
    z-index: 9999;
}

    .spinnerWrapper_Cldatatable .spinnerLoading_Cl {
        font-size: 12px;
        letter-spacing: 0.1em;
        display: block;
        color: #000;
        position: relative;
        top: 30px;
        z-index: 2;
        -webkit-animation: text 0.5s ease infinite alternate;
        -moz-animation: text 0.5s ease infinite alternate;
        animation: text 0.5s ease infinite alternate;
    }

    .spinnerWrapper_Cldatatable:after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -20px;
        margin: auto;
        width: 90px;
        height: 6px;
        z-index: 1;
        background-color: rgba(0, 0, 0, 0.1);
        -webkit-filter: blur(2px);
        filter: blur(2px);
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%;
        -webkit-animation: shadow 0.5s ease infinite alternate;
        -moz-animation: shadow 0.5s ease infinite alternate;
        animation: shadow 0.5s ease infinite alternate;
    }

.LvSpinner_Cldatatable {
    margin: auto;
    width: 40px;
    height: 10px;
    font-size: 10px;
    margin-bottom: 0.8rem;
    margin-left: 28px
}

    .LvSpinner_Cldatatable > div {
        height: 100%;
        width: 100%;
        display: block;
        margin-bottom: 0.6em;
        -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
        animation: stretchdelay 1.2s infinite ease-in-out;
    }

    .LvSpinner_Cldatatable .rect2_Cl {
        -webkit-animation-delay: -1s;
        animation-delay: -1s;
    }

    .LvSpinner_Cldatatable .rect3_Cl {
        -webkit-animation-delay: -0.8s;
        animation-delay: -0.8s;
    }