body {
  margin: 0;
  background-color: #131313;
  display: flex;
  height: 100vh;
  flex-direction: column;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji";
}
header {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 25%;
}
main {
  height: 75%;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 30px 0;
}
.image-container {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.error {
  max-width: 100%;
}
.bug {
  position: absolute;
  bottom: 0;
  width: 50%;
  max-width: 100%;
}
.text-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 28rem;
  gap: 10px 0;
}
h1 {
  font-size: 46px;
  font-weight: 700;
  color: white;
  margin: 0;
}
p {
  font-weight: 400;
  font-size: 18px;
  color: rgba(255, 255, 255, 0.6);
  margin: 0;
}
.button-container {
  display: flex;
  gap: 10px;
}
a {
  padding: 1rem 2rem;
  color: white;
  text-decoration: none;
  font-size: 18px;
  font-weight: 700;
}
.button-container .home {
  background-color: #3f4ef1;
}
.button-container .try-again {
  background-color: #d61a4c;
}
@media (min-width: 768px) {
  .bug {
    width: auto;
  }
}
@media (max-width: 768px) {
  body {
    padding: 10px;
  }
  h1 {
    font-size: 32px;
  }
  p {
    font-size: 14px;
  }
  a {
    font-size: 14px;
    padding: .5rem 1rem; 
  }
  header img {
    height: 60px;
  }
}