@import url("https://fonts.googleapis.com/css2?family=Damion&family=Roboto:wght@700&display=swap");

.loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 50;
	background-color: #fff;
}
.loading__inner {
  display: flex;
  justify-content: center;
  align-items: center;
	flex-direction: column;
  height: 100%;
}

.loading__text{
	font-family: "Damion", cursive;
	font-size: 40px;
	-webkit-animation: fontColor 5s infinite;
	        animation: fontColor 5s infinite;
}

@-webkit-keyframes fontColor{
	0%{
		color: #256E45;
	}
	33%{
		color: #4ea071;
	}
	66%{
		color:#b8edcf;
	}
	100%{
		color:#256E45;
	}
}
@keyframes fontColor{
	0%{
		color:#256E45;
	}
	33%{
		color:#4ea071;
	}
	66%{
		color:#b8edcf;
	}
	100%{
		color:#256E45;
	}
}


.loaded {
  display: none;
}

.sp {
  width: 60px;
  height: 60px;
  clear: both;
}
.sp-3balls,
.sp-3balls:before,
.sp-3balls:after {
  border-radius: 50%;
  /* background-color: #000; */
  background-color: #b8edcf;
  width: 36px;
  height: 36px;
  transform-origin: center center;
  display: inline-block;
}
.sp-3balls {
  position: relative;
  background-color: #b8edcf;
  opacity: 1;
  -webkit-animation: spScaleAlpha 1s infinite linear;
  animation: spScaleAlpha 1s infinite linear;
}
.sp-3balls:before,
.sp-3balls:after {
  content: "";
  position: relative;
  opacity: 0.25;
}
.sp-3balls:before {
  left: 50px;
  top: 0px;
  -webkit-animation: spScaleAlphaBefore 1s infinite linear;
  animation: spScaleAlphaBefore 1s infinite linear;
}
.sp-3balls:after {
  left: -50px;
  top: -42px;
  -webkit-animation: spScaleAlphaAfter 1s infinite linear;
  animation: spScaleAlphaAfter 1s infinite linear;
}
@-webkit-keyframes spScaleAlpha {
  0% {
    opacity: 1;
  }
  33% {
    opacity: 0.25;
  }
  66% {
    opacity: 0.25;
  }
  100% {
    opacity: 1;
  }
}
@keyframes spScaleAlpha {
  0% {
    opacity: 1;
  }
  33% {
    opacity: 0.25;
  }
  66% {
    opacity: 0.25;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes spScaleAlphaBefore {
  0% {
    opacity: 0.25;
  }
  33% {
    opacity: 1;
  }
  66% {
    opacity: 0.25;
  }
}
@keyframes spScaleAlphaBefore {
  0% {
    opacity: 0.25;
  }
  33% {
    opacity: 1;
  }
  66% {
    opacity: 0.25;
  }
}
@-webkit-keyframes spScaleAlphaAfter {
  33% {
    opacity: 0.25;
  }
  66% {
    opacity: 1;
  }
  100% {
    opacity: 0.25;
  }
}
@keyframes spScaleAlphaAfter {
  33% {
    opacity: 0.25;
  }
  66% {
    opacity: 1;
  }
  100% {
    opacity: 0.25;
  }
}