html,
body {
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
  min-width: 300px;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

/* Utility */

.flex-grow {
  flex-grow: 1;
}

.flex-grow-half {
  flex-grow: 0.5;
}

.flex-grow-double {
  flex-grow: 2;
}

.hidden {
  visibility: hidden;
}

.display-none {
  display: none !important;
}

/* Components */

.nq-card {
  max-width: 75rem;
  background: var(--nimiq-card-bg);
  border-radius: 1.25rem;
  box-shadow: 0 0.5rem 3.5rem rgba(0, 0, 0, 0.111158);
  margin: 2rem;
  color: var(--nimiq-blue);
}

@media (max-width: 450px) {
  .nq-card {
    margin: 2rem 1rem;
  }
}

.nq-card-header {
  padding: 4rem;
  text-align: center;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}

@media (max-width: 450px) {
  .nq-card-header {
    padding: 3rem;
  }
}

.nq-card-header .nq-h1,
.nq-card-header .nq-h2 {
  margin: 0;
}

.nq-card-header .nq-notice {
  margin: 3rem 0 0;
  text-align: center;
}

.nq-card-body {
  padding: 4rem;
}

@media (max-width: 450px) {
  .nq-card-body {
    padding: 3rem;
  }
}

.nq-card-header + .nq-card-body {
  padding-top: 1rem;
}

.nq-card-body > *:first-child {
  margin-top: 0;
}

.nq-card-body > *:last-child {
  margin-bottom: 0;
}

.nq-card-footer {
  padding: 1rem;
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
}

.nq-card-body + .nq-card-footer {
  padding-top: 0;
}

/* Spacing */

.margin-top-5 {
  margin-top: 5rem;
}

.margin-top-4 {
  margin-top: 4rem;
}

.margin-top-3 {
  margin-top: 3rem;
}

.margin-top-2 {
  margin-top: 2rem;
}

.margin-top-1 {
  margin-top: 1rem;
}

/* Shadow */

.nq-shadow {
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15);
}

.nq-shadow-l {
  box-shadow: 0 0.5rem 2.5rem rgba(0, 0, 0, 0.15);
}