html,
body {
  margin: 0;
}

body {
  width: 100vw;
  min-height: 100vh;
}

/* Loading screen styles */
loading-screen-static {
  position: fixed;
  box-sizing: border-box;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;

  /* Apply extra bottom padding, to push our content above browser chrome on
small-height devices, mostly older generation iPhones */
  padding: 1rem 1rem 4rem;

  /* The z-index of this Ember component should be lower than the equivalent,
server-rendered loading markup */
  z-index: 20;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #7b62ae;
  background-image: url("/assets/images/background-ddca0d8eae699da995cbf8be74f0b5f1.png");
}

#loader {
  display: block;
  width: 40rem;
  max-width: 100%;
  height: 40rem;
  max-height: 100%;
}

@media screen and (min-height: 400px) {
  loading-screen-static {
    padding-bottom: 1rem;
  }
}