*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  /* DEBUGGING */
  --outline-solid-red: 3px solid red;
  --outline-solid-green: 3px solid green;
  --outline-solid-blue: 3px solid blue;
  --outline-solid-white: 3px solid white;
  --outline-solid-black: 3px solid black;

  /* body */
  --background-color-body: hsla(14deg 83% 14% / 100%);
  --background-url-body: url("/images/brownL4.png");
  --margin-body: 0;
  --padding-body: 6px;
  --font-family-body: verdana, arial, helvetica, sans-serif;
  --fs-body: 100%;
  --fw-body-bold: 800;
  --fw-body-med: 400;
  --fw-body-light: 200;
}

body {
  /* background-color: var(--background-color-body); */
  background-color: hsla(0deg 0% 0% / 0%);
  background-image: var(--background-url-body);
  margin: var(--margin-body);
  padding: var(--padding-body);
  font-family: var(--font-family-body);
  font-size: var(--fs-body);
}

*:focus {
    outline: 3px solid pink;
    padding: 3px;
}