@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap');
@import "./index.css";

body{
  margin: 0;
  background-color: #ffffff;
}

body * {
  font-family: "Lora", serif;
  font-size: 14px;
}

input[type="text"],
input[type="number"],
input[type="password"] {
  margin: 0;
  all: unset;
}

:root {
  --loading-color: seagreen;
  --current-location: coral;
  --location: limegreen;
  --location-bright: #a0eea0;
}

div.load_animation {
  position: fixed;
  top: 2px;
  right: 2px;
  font-family: "Source Code Pro", monospace;
  letter-spacing: 0px;
  font-size: 1.2em;
  animation: loading .4s infinite;
  backdrop-filter: blur(4px);
  background-color: #6A4BDB;
  width: 2em;
  height: 2em;
  opacity: 1;
  display: none;
  border-radius: 10%;
}

div.load_animation.active {
  display: block;
}

@keyframes loading {
  0% {
    background: linear-gradient(0deg,#0000 50%, var(--loading-color) 50%);
  }
  25% {
    background: linear-gradient(90deg, #0000 50%, var(--loading-color) 50%);
  }  
  50% {
    background: linear-gradient(180deg, #0000 50%, var(--loading-color) 50%);
  }  
  75% {
    background: linear-gradient(270deg, #0000 50%, var(--loading-color) 50%);
  }  
  100% {
    background: linear-gradient(0deg, #0000 50%, var(--loading-color) 50%);
  }  
}