.errorBoxContainer {
  padding: 3rem;
  border: 1px solid var(--gallery);
  border-radius: 5px;
  margin-bottom: 3rem;
  box-shadow:
    0 4px 4px rgb(0 0 0 / 1.7%),
    0 7px 11px rgb(0 0 0 / 2.5%),
    0 12px 26px rgb(0 0 0 / 3.3%),
    0 26px 80px rgb(0 0 0 / 5%);
  font-size: 1.4rem;

  & .errorActionContainer {
    margin: 3rem 0 0;
  }

  & button {
    padding: 3px 16px;
    border: 1px solid var(--cerulean);
    border-radius: 3px;
    background: var(--cerulean);
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-size: inherit;
    line-height: 24px;

    &:hover,
    &:focus {
      border-color: var(--azure);
      background-color: var(--azure);
      outline: none;
    }
  }
}
