.loading-container {
	position: fixed;
	left: 0;
	top: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
  background-color: rgba(15, 17, 21, 0.9);
}

.loading-svg {
	width: 128px;
	height: 128px;
	color: var(--primary-color);
  position: relative;
}
.loading-svg img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.loading-title {
  font-size: 28px;
	font-weight: 500;
  color: #6a6a6a;
  margin-top: 0.5em;
}


.loading-spin {
  color: #c0d1db;
  width: 90%;
  left: 5%;
  top: 5%;
  position: absolute;
  aspect-ratio: 1;
  display: grid;
  border: 4px solid #0000;
  border-radius: 50%;
  border-right-color: currentColor;
  animation: l15 1s infinite linear;
}
/* .loading-spin::before, */
.loading-spin::after {    
  content: "";
  grid-area: 1/1;
  margin: 2px;
  border: inherit;
  border-radius: 50%;
  animation: l15 2s infinite;
}
/* .loading-spin::after {
  margin: 8px;
  animation-duration: 3s;
} */
@keyframes l15{ 
  100%{transform: rotate(1turn)}
}