*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
}
html {
  box-sizing: border-box;
  font-size: 62.5%;
  font-family: "Alliance", sans-serif;
}
.error-grid {
  grid-column: 2/11;
  display: grid;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  height: 80vh;
  /* grid-template-rows: 1fr 1fr; */
  grid-template-columns: repeat(5, minmax(50px, 150px));
}
.back-tohome:hover {
  transform: rotate(180deg);
}
.error-grid figure {
  max-width: 200px;
  justify-self: center;
  display: grid;
  gap: 0.5rem;
  grid-template-rows: 1fr 0.2fr;
}
.error-grid figure img {
  width: 100%;
  height: 100%;
}
.msg-error {
  text-align: center;
  font-weight: 300;
  font-size: 1.5rem;
  align-self: end;
}

@media (max-width: 767.98px) {
  .error-grid {
    grid-template-rows: repeat(2, 175px);
    grid-template-columns: repeat(3, minmax(50px, 120px));
    height: 60vh;
    gap: 0.5rem 1rem;
    margin-top: 7rem;
  }
  .error-grid > figure {
    justify-self: left;
  }
  .order-1-3 {
    grid-row: 1/1;
    grid-column: 3/4;
  }
  .order-1-1 {
    grid-column: 1/3;
    width: 50%;
  }
}
@media (max-width: 1239.99px) {
  html {
    font-size: 50%;
  }
}
