.load-screen {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #373431;
  color: white;
  z-index: 2000;
}

.load-filter {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2000;
  overflow: hidden;
}

.load-filter-exit {
  transform: translateY(0);
}

.load-filter-exit-active {
  transform: translateY(-100vh);
  transition: all 450ms;
    transition-timing-function: cubic-bezier(.82,.01,.89,.44);
}

.load-filter-exit .load-screen {
  transform: translateY(0);
}

.load-filter-exit-active .load-screen {
  transform: translateY(100vh);
  transition: all 450ms;
        transition-timing-function: cubic-bezier(.82,.01,.89,.44);

}

.centered-logo {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#r1 {
  opacity: 0;
}

.animate-logo #r1 {
  animation-delay: 1.235s;
  animation-duration: .79s;
  animation-name: rocketblastoff;
}

@keyframes rocketblastoff {
  0% {
    transform: translate(-780px, 1100px);
    opacity: 1;
  }
  80% {
    opacity: .6;
  }
  100% {
    transform: translate(0, 0);
    opacity: 0;
  }
}

.explorious-animation-primary, .explorious-animation-text{ 
  fill:currentColor;
}

.explorious-animation-text{ 
  font-size:542px;stroke:#1b1a18;stroke-miterlimit:10;stroke-width:4.5px;font-family:explorious, My Font;letter-spacing:0.01em; 
}
.cls-3{ 
  fill:red; 
}
#t-18 {
opacity: 0;
}

.animate-logo #t-18 {
animation: frame 1.5s forwards;
animation-delay: 0s;
}
#t-17 {
opacity: 0;
}

.animate-logo #t-17 {
animation: frame 1.5s forwards;
animation-delay: 0.07s;
}
#t-16 {
opacity: 0;
}

.animate-logo #t-16 {
animation: frame 1.5s forwards;
animation-delay: 0.14s;
}
#t-15 {
opacity: 0;
}

.animate-logo #t-15 {
animation: frame 1.5s forwards;
animation-delay: 0.21s;
}
#t-14 {
opacity: 0;
}

.animate-logo #t-14 {
animation: frame 1.5s forwards;
animation-delay: 0.28s;
}
#t-13 {
opacity: 0;
}

.animate-logo #t-13 {
animation: frame 1.5s forwards;
animation-delay: 0.35s;
}
#t-12 {
opacity: 0;
}

.animate-logo #t-12 {
animation: frame 1.5s forwards;
animation-delay: 0.42s;
}
#t-11 {
opacity: 0;
}

.animate-logo #t-11 {
animation: frame 1.5s forwards;
animation-delay: 0.49s;
}
#t-10 {
opacity: 0;
}

.animate-logo #t-10 {
animation: frame 1.5s forwards;
animation-delay: 0.56s;
}
#t-9 {
opacity: 0;
}

.animate-logo #t-9 {
animation: frame 1.5s forwards;
animation-delay: 0.63s;
}
#t-8 {
opacity: 0;
}

.animate-logo #t-8 {
animation: frame 1.5s forwards;
animation-delay: 0.7s;
}
#t-7 {
opacity: 0;
}

.animate-logo #t-7 {
animation: frame 1.5s forwards;
animation-delay: 0.77s;
}
#t-6 {
opacity: 0;

}
#t-5 {
opacity: 0;
}

.animate-logo #t-5 {
animation: frame 1.5s forwards;
animation-delay: 0.84s;
}
#t-4 {
opacity: 0;
}

.animate-logo #t-4 {
animation: frame 1.5s forwards;
animation-delay: 0.91s;
}
#t-3 {
opacity: 0;
}

.animate-logo #t-3 {
animation: frame 1.5s forwards;
animation-delay: 0.98s;
}
#t-2 {
opacity: 0;
}

.animate-logo #t-2 {
animation: frame 1.5s forwards;
animation-delay: 1.05s;
}        
#t-1 {
opacity: 0;
}

.animate-logo #t-1 {
animation: frame 1.5s forwards;
animation-delay: 1.12s;
}
#e {
opacity: 0;
}

.animate-logo #e {
animation: frameb 1.5s forwards;
animation-delay: 1.19s;
}

.explorious-animation-text {
opacity: 0;
}

.animate-logo .explorious-animation-text {
animation: tracking-in-expand 1s forwards;
animation-delay: 1.15s;
}

@keyframes frame {
0%,4.9%,100% {opacity: 0;}
5%,55% {opacity: 1;}
}    

@keyframes frameb {
0%,4.9% {opacity: 0;}
5%,55%,100%{opacity: 1;}
}    
@keyframes framec {
  0%,100 {opacity: 0;}
  0.1%,99.9%{opacity: 1;}
}

@keyframes tracking-in-expand {
  0% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
  20% {
    opacity: 0;
    }
  40% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}

