body.loading
{
    overflow: hidden;
}


.rotate {
	animation: rotation 8s infinite linear;
  }
  
  @keyframes rotation {
	from {
	  transform: rotate(0deg);
	}
	to {
	  transform: rotate(-359deg);
	}
  }
.loader-container {
    width: 100px;
    height: 100px;
    color: #FFFFFF;
    transform: translateY(70%);
}

/* Fade in and out */
@keyframes fade {
    0%   { opacity: 0.1; }
    40%  { opacity: 1; }
    100% { opacity: 0.1; }
}

.v-shape {
    fill: none;
    stroke: currentColor;
    stroke-width: 2;              /* thicker = ~25% bigger */
    stroke-linecap: square;
    stroke-linejoin: square;
    transform-origin: center;
    animation: fade 1s ease-in-out infinite;
}

/* ✅ Stagger by targeting the <g> wrappers */
.loader-container svg g:nth-child(1) .v-shape { animation-delay: 0s; }
.loader-container svg g:nth-child(2) .v-shape { animation-delay: 0.2s; }
.loader-container svg g:nth-child(3) .v-shape { animation-delay: 0.4s; }
.loader-container svg g:nth-child(4) .v-shape { animation-delay: 0.6s; }
.loader-container svg g:nth-child(5) .v-shape { animation-delay: 0.8s; }
.loader-container svg g:nth-child(6) .v-shape { animation-delay: 1s; }
.loader
{
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 1031;
	background: #DDD6C6;
	opacity: 1;
	
	top: 0;
	left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
	flex-wrap: wrap;
	flex-direction: column;
}


.loader .icon 
{

	width: 100px;
	height: 100px;
	background-position: center center;
	background-size: 50%;
	background-repeat: no-repeat;
	background-attachment: scroll;
	margin: 0 auto;
	text-align: center;

}

.loading_logo 
{
    width: 250px;
	z-index: 1032;
}


.loading_logo img
{
	width: 100%;
	height: auto;
	display: block;
}


.loader_rotate {
	animation: rotation 10s infinite linear;
  }
  
  @keyframes loader_rotation {
	from {
	  transform: rotate(0deg);
	}
	to {
	  transform: rotate(-359deg);
	}
  }


  @keyframes rotate3D {
	0% {
	  transform: perspective(1000px) rotateY(0deg);
	}
	100% {
	  transform: perspective(1000px) rotateY(-359deg);
	}
  }
  