/*--------------------------------------------------------------
    Loader
--------------------------------------------------------------*/

    .pre-loader { height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 999991; }

    .loader-inner { padding: 25px; position: absolute; left: 50%; top: 50%; text-align: center; width: 100%; 
        -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
 
    .loader-text { width: 244px; height: 50px; line-height: 50px; text-align: center; position: absolute; left: 50%;
        transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
        font-family: var(--wdtFontTypo_Alt); text-transform: uppercase; 
        font-weight: var(--wdtFontWeight_Alt); font-size:1.3em; color: var(--wdtHeadAltColor); letter-spacing: 0.2em;
    }
    .loader-text::before, .loader-text::after {
        content: ""; display: block; width: 15px; height: 15px; background: var(--wdtTertiaryColor); position: absolute;
        animation: txt-travel-bg 0.81s infinite alternate ease-in-out;
            -o-animation: txt-travel-bg 0.81s infinite alternate ease-in-out;
            -ms-animation: txt-travel-bg 0.81s infinite alternate ease-in-out;
            -webkit-animation: txt-travel-bg 0.81s infinite alternate ease-in-out;
            -moz-animation: txt-travel-bg 0.81s infinite alternate ease-in-out;
    }
    .loader-text::before { top: 0; }
    .loader-text::after { bottom: 0; }

.loader-folding{margin: 20px auto;width: 50px;height: 50px;position: relative;transform: rotateZ(45deg);}
.loader-folding .loader-folding-cube {float: left;width: 50%;height: 50%;position: relative;transform: scale(1.1);}
.loader-folding .loader-folding-cube:before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: var(--wdtPrimaryColor);animation: foldCubeAngle 2.4s infinite linear both;transform-origin: 100% 100%;}
.loader-folding .loader-folding-cube2 {transform: scale(1.1) rotateZ(90deg);}
.loader-folding .loader-folding-cube3 {transform: scale(1.1) rotateZ(180deg);}
.loader-folding .loader-folding-cube4 {transform: scale(1.1) rotateZ(270deg);}
.loader-folding .loader-folding-cube2:before {animation-delay: 0.3s;}
.loader-folding .loader-folding-cube3:before {animation-delay: 0.6s;}
.loader-folding .loader-folding-cube4:before {animation-delay: 0.9s;}

@keyframes foldCubeAngle {
0%,
10% {
    transform: perspective(140px) rotateX(-180deg);
    opacity: 0;
}
25%,
75% {
    transform: perspective(140px) rotateX(0deg);
    opacity: 1;
}
90%,
100% {
    transform: perspective(140px) rotateY(180deg);
    opacity: 0;
}
}

    
    
    
    @keyframes txt-travel-bg {
        0% { left: 0; height: 29px; width: 15px; }
        50% { height: 8px; width: 39px; }
        100% { left: 229px; height: 29px; width: 15px; }
    }
    
    @-o-keyframes txt-travel-bg {
        0% { left: 0; height: 29px; width: 15px; }
        50% { height: 8px; width: 39px; }
        100% { left: 229px; height: 29px; width: 15px; }
    }
    
    @-ms-keyframes txt-travel-bg {
        0% { left: 0; height: 29px; width: 15px; }
        50% { height: 8px; width: 39px; }
        100% { left: 229px; height: 29px; width: 15px; }
    }
    
    @-webkit-keyframes txt-travel-bg {
        0% { left: 0; height: 29px; width: 15px; }
        50% { height: 8px; width: 39px; }
        100% { left: 229px; height: 29px; width: 15px; }
    }
    
    @-moz-keyframes txt-travel-bg {
        0% { left: 0; height: 29px; width: 15px; }
        50% { height: 8px; width: 39px; }
        100% { left: 229px; height: 29px; width: 15px; }
    }


/*--------------------------------------------------------------
    Accents
--------------------------------------------------------------*/

    .pre-loader { background-color: var(--wdtBodyBGColor); }