/*--------------------------------------------------------------

    Loader

--------------------------------------------------------------*/



.pre-loader2 {

  height: 100%;

  left: 0;

  position: fixed;

  top: 0;

  width: 100%;

  z-index: 999991;

  background-color: var(--wdtBodyBGColor);

  transition: transform 400ms linear 100ms;

  -webkit-transition: transform 400ms linear 100ms;

}



.pre-loader2 .loader-inner {

  width: 100%;

  height: fit-content;

  margin: auto;

  position: absolute;

  left: 0;

  right: auto;

  top: 0;

  bottom: 0;

}



.pre-loader2 .loader-inner .loader-2-svg {

  position: absolute;

  bottom: 0;

  left: var(--left);

  z-index: 1;

  transition: left 500ms linear;

  -webkit-transition: left 500ms linear;

}



/* .pre-loader2 .loader-inner:before {

    content: "";

    position: absolute;

    display: block;

    width: 100vw;

    left: 0;

    height: 50px;

    background: var(--wdtHeadAltColor);

    bottom: -25px;

    box-shadow: 0 0 10px 0 rgb(var(--wdtHeadAltColorRgb),0.6);

    -webkit-box-shadow: 0 0 10px 0 rgb(var(--wdtHeadAltColorRgb),0.6);

}



.pre-loader2  .loader-inner:after {

    content: "";

    position: absolute;

    display: block;

    bottom: -2px;

    width: 100vw;

    left: 0;

    height: 2px;

    background-color: transparent;

    background-image: linear-gradient(90deg, var(--wdtAccentTxtColor) 50%, transparent 50%);

    background-size: 50px 100%; 

} */



svg.wdt-car-loader .wdt-cus-car-loader-svg-01 { 

    fill:none;

    stroke:var(--wdtPrimaryColor, #d70007);

    stroke-width:3;

    stroke-linecap:round;

    stroke-linejoin:round;

}



svg.wdt-car-loader .wdt-cus-car-loader-svg-02 { 

    fill: var(--wdtBodyBGColor, #ffffff);

    stroke: var(--wdtPrimaryColor, #d70007);

    stroke-width: 6;

    stroke-linecap:round;

    stroke-linejoin:round;

}



.pre-loader2.loader2 .loader-inner svg.wdt-car-loader {

    stroke: var(--wdtPrimaryColor);

    /* animation: wdt-car-loader-shake 0.3s ease-in-out 10 alternate;

    -webkit-animation: wdt-car-loader-shake 0.3s ease-in-out 10 alternate; */

    font-size: 100%;

    width: clamp(7.5rem, 6rem + 7.5vw, 15rem); /*240px - 120px*/

    height: clamp(2.5rem, 2rem + 2.5vw, 5rem); /*80px - 40px*/

    overflow: visible;

}



.pre-loader2.loader2 .loader-inner svg.wdt-car-loader .wdt-loader-car-body {

  stroke: var(--wdtPrimaryColor);

  /* animation: wdt-car-loader-shake 0.3s ease-in-out 10 alternate;

  -webkit-animation: wdt-car-loader-shake 0.3s ease-in-out 10 alternate; */

}



.pre-loader2.loader2 .loader-inner svg.wdt-car-loader .wdt-loader-car-wheel-left,

.pre-loader2.loader2 .loader-inner svg.wdt-car-loader .wdt-loader-car-wheel-right {

  stroke: var(--wdtPrimaryColor);

  /* animation: wdt-car-loader-shake 0.3s ease-in-out 10 alternate;

  -webkit-animation: wdt-car-loader-shake 0.3s ease-in-out 10 alternate; */

}



.pre-loader2.loader2 .loader-inner svg.wdt-car-loader .wdt-loader-car-line {

  stroke: var(--wdtPrimaryColor);

  transform-origin: center right;

  stroke-dasharray: 22;

  animation: wdt-car-loader-line 0.8s ease-in-out infinite;

  animation-fill-mode: both;

}



.pre-loader2.loader2 .loader-inner svg.wdt-car-loader .wdt-loader-car-line.wdt-loader-car-line-top {

  animation-delay: 0s;

  -webkit-animation-delay: 0s;

}



.pre-loader2.loader2 .loader-inner svg.wdt-car-loader .wdt-loader-car-line.wdt-loader-car-line-middle {

  animation-delay: 0.2s;

  -webkit-animation-delay: 0.2s;

}



.pre-loader2.loader2 .loader-inner svg.wdt-car-loader .wdt-loader-car-line.wdt-loader-car-line-bottom {

  animation-delay: 0.4s;

  -webkit-animation-delay: 0.4s;

}



@keyframes wdt-car-loader-shake {

	0% { transform: translateY(-2%); -webkit-transform: translateY(-2%); }

	100% { transform: translateY(4%); -webkit-transform: translateY(4%); }

}



@-webkit-keyframes wdt-car-loader-shake {

	0% { transform: translateY(-2%); -webkit-transform: translateY(-2%); }

	100% { transform: translateY(4%); -webkit-transform: translateY(4%); }

}



@keyframes wdt-car-loader-line {

	0% { stroke-dashoffset: 22; }

	25% { stroke-dashoffset: 22; }

	50% { stroke-dashoffset: 0; }

	51% { stroke-dashoffset: 0; }

	80% { stroke-dashoffset: -22; }

	100% { stroke-dashoffset: -22; }

}



@-webkit-keyframes wdt-car-loader-line {

	0% { stroke-dashoffset: 22; }

	25% { stroke-dashoffset: 22; }

	50% { stroke-dashoffset: 0; }

	51% { stroke-dashoffset: 0; }

	80% { stroke-dashoffset: -22; }

	100% { stroke-dashoffset: -22; }

}







/*--------------------------------------------------------------

    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) {}