html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 62.5%;
}

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

html,
body {
  height: 100%;
}

body {
  background-color: var(--color-white);
  background-size: cover;
  background-position: center center;
  background-image: var(--background-image-url--landscape--2000);

  margin: 0;
}

@media (orientation: landscape) {
  body {
    background-image: var(--background-image-url--landscape--4000);
  }
}

@media (orientation: portrait) {
  body {
    background-image: var(--background-image-url--portrait--4000);
  }
}

@media (orientation: landscape) and (max-width: 2000px) {
  body {
    background-image: var(--background-image-url--landscape--2000);
  }
}

@media (orientation: portrait) and (max-width: 2000px) {
  body {
    background-image: var(--background-image-url--portrait--2000);
  }
}

@media (orientation: landscape) and (max-width: 1000px) {
  body {
    background-image: var(--background-image-url--landscape--1000);
  }
}

@media (orientation: portrait) and (max-width: 1000px) {
  body {
    background-image: var(--background-image-url--portrait--1000);
  }
}

p {
  margin: 0;
  padding: 0;
}

p:not(:last-child) {
  margin-bottom: var(--lh, 1em);
}
