@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@100;400&display=swap);
.spinner {
  width: 80px;
  height: 80px;
  position: relative;
  margin: 0 auto;
  transform: translateX(50vw);
  transform: translateY(25vh);
}
.double-bounce1, .double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 60%;
  background-color: var(--navy);
  opacity: 0.6;
  position: absolute;
  top: 20vh;
  left: 0;
  
  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% { 
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% { 
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}
body,html{
  font-family: 'Roboto', sans-serif;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
    font-size: 2.604vw;  /* 1rem= 50px * 1920px*/
  }
  input:focus, textarea:focus, select:focus{
    outline: none;
  }
  
  *{
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    box-sizing: content-box;
  }
  
  .app{
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }

  .app-container{
    flex: 1;
  }

  #preview-portal{
    background-color: var(--navy);
  }

  :root{
    --blue:#2d386e;
    --dark-navy: #020c1b;
    --navy: #0a192f;
    --light-navy: #112240;
    --lightest-navy: #233554;
    --navy-shadow: rgba(2,12,27,0.7);
    --dark-slate: #495670;
    --slate: #8892b0;
    --light-slate: #a8b2d1;
    --green: #64ffda;
  }

/*# sourceMappingURL=style.fb7217e3.css.map*/