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

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

    .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 { display: inline-block; font-family: var(--wdtFontTypo_Alt); font-size: clamp(2.5rem, 2.411rem + 0.4908vw, 3rem); 
        font-weight: var(--wdtFontWeight_Alt); line-height: normal; text-transform: uppercase; color: var(--wdtHeadAltColor); }

/*----*****---- << Loader Icon >> ----*****----*/

    :root{ --loader-len: clamp(12.5rem, 11.944rem + 3.0675vw, 15.625rem); --loader-bre: 4px; --loader-color: var(--wdtLinkHoverColor); }

    .loader-icon { width: 100%; max-width: 100%; display: flex; justify-content: center; align-items: center; margin: auto; }
    
    .loader-icon .bar {
        width: var(--loader-len); height: var(--loader-bre); padding: 0; border: none; -webkit-border-radius: var(--wdtRadius_3X); 
        border-radius: var(--wdtRadius_3X); }

    .loader-icon .pxl { width: var(--loader-len); height: var(--loader-bre); fill: var(--loader-color); 
        animation: loaderMove 1300ms cubic-bezier(0.65,0,0.35,1) infinite; }

    @-webkit-keyframes loaderMove { 0%{ transform: translate(-186px,0); } 50%{ transform: translate(186px,0); } 100%{ transform: translate(-186px,0); } }
    @keyframes loaderMove { 0%{ transform: translate(-186px,0); } 50%{ transform: translate(186px,0); } 100%{ transform: translate(-186px,0); } }

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

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


/*--------------------------------------------------------------
    Responsive
--------------------------------------------------------------*/

    /*----*****---- << Mobile (Landscape) >> ----*****----*/

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {

    }


    /* Common Styles for the devices below 479px width */

    @media only screen and (max-width: 479px) {

    }