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

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

    .loader-inner { padding: 25px; text-align: center; position: absolute; left: 50%; top: 50%;
        -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

    .loader-flip {
        -webkit-perspective: 120px;
        -moz-perspective: 120px;
        -ms-perspective: 120px;
        perspective: 120px;
        display: inline-block; margin: 0 auto;
        width: 100px; height: 100px; position: relative;
      }
      
    .loader-flip:before { content: ""; position: absolute; left: 30px; top: 30px;
        width: 60px; height: 60px; background-color: var(--wdtPrimaryColor); 
        -webkit-animation: flip 1s infinite; animation: flip 1s infinite;
        -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.15); box-shadow: 0 0 10px rgba(0,0,0,0.15); }
      
    @-webkit-keyframes flip {
        0% { transform: rotate(0); }
        50% { transform: rotateY(180deg); }
        100% { transform: rotateY(180deg)  rotateX(180deg); }
    }
    @keyframes flip {
        0% { transform: rotate(0); }
        50% { transform: rotateY(180deg); }
        100% { transform: rotateY(180deg)  rotateX(180deg); }
    }