/*--------------------------------------------------------------
    Loader
--------------------------------------------------------------*/

.pre-loader {
    height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 999991; 
    clip-path: circle(100% at 50% 50%); box-shadow: 0px 0px 0px 100vmax #fff; 
    transition: transform 1s ease-in-out, clip-path 1s ease-in-out .5s; }

.loader-inner {
    padding: 25px; position: absolute; left: 50%; top: 50%; text-align: center; width: 100%; 
    -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); 
    display: flex; justify-content: center; align-items: center; }

.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 Logo >> ----*****----*/

:root{ --loader-len: 100px; --loader-bre: 4px; --loader-color: var(--wdtLinkHoverColor); }

.loader-icon-logo { 
    display: flex; align-items: center; justify-content: center; font-size: clamp(5rem, 4.5552rem + 2.454vw, 7.5rem); /*120px - 80px */
    animation: loaderRotate 1300ms cubic-bezier(0.65,0,0.35,1) infinite; transform-origin: bottom center; }

@-webkit-keyframes loaderRotate { 0%{ transform: translateY(0px); } 50%{ transform: translateY(-5px); } 100%{ transform: translateY(0px); } }
@keyframes loaderRotate { 0%{ transform: translateY(0px); } 50%{ transform: translateY(-5px); } 100%{ transform: translateY(0px); } }


/*--------------------------------------------------------------
    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) {

}