html {
  height: 100%;
  color: #fff;
  font-family: "Overpass-Regular", sans-serif;
  background-color: black;
}

body,
#root {
  min-height: 100%;
  height: 100%;
}

.wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
}

.logo {
  display: flex;
  justify-content: center;
}

.logo img {
  height: 80px;
}

.desc {
  display: flex;
  justify-content: center;
  margin: 20px;
  text-align: center;
}

.mailto {
  display: flex;
  justify-content: center;
  margin: 20px;
}

.mailto a {
  color: #fff;
}

@media (min-width: 576px) and (orientation: portrait),
  (min-width: 768px) and (orientation: portrait) {
  .desc {
    margin: 80px;
    font-size: 4em;
  }
  .mailto {
    font-size: 4em;
  }
  .logo img {
    height: 10em;
  }
}

@media (min-width: 992px), (min-width: 1200px), (min-width: 1400px) {
  .logo img {
    height: 80px;
  }
}