/* Fullscreen Overlay */
.ip-header {
	position: fixed;
	inset: 0;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
}

/* Loader */
.loader {
  height: 60px;
  aspect-ratio: 1;
  --c:no-repeat linear-gradient(#4996d1 0 0);
  background: var(--c), var(--c), var(--c), var(--c);
  background-size: 33.4% 33.4%;
  animation: l2 1.2s infinite linear;
}

@keyframes l2 {
  0%    {background-position:0   0  ,50%  0  ,0   50% ,50%  50%}
  12.5% {background-position:50% 0  ,100% 0  ,0   50% ,50%  50%}
  25%   {background-position:50% 0  ,100% 0  ,50% 50% ,100% 50%}
  37.5% {background-position:50% 0  ,100% 50%,50% 50% ,100% 100%}
  50%   {background-position:50% 50%,100% 50%,50% 100%,100% 100%}
  62.5% {background-position:50% 50%,100% 50%,0   100%,50%  100%}
  75%   {background-position:0   50%,50%  50%,0   100%,50%  100%}
  87.5% {background-position:0   0  ,50%  50%,0   50% ,50%  100%}
  100%  {background-position:0   0  ,50%  0  ,0   50% ,50%  50%}
}

/* Smooth Fade Out */
.loaded .ip-header {
	animation: fadeOut 0.5s ease forwards;
}

@keyframes fadeOut {
	to {
		opacity: 0;
		visibility: hidden;
	}
}