/* Default colors */
body {
  --text-color: #000000;
  --bkg-color: #ffffff;
}

/* Dark theme colors */
body.dark-theme {
  --text-color: #ffffff;
  --bkg-color: #000000;
}

/* Styles for users who prefer dark mode at the OS level */
@media (prefers-color-scheme: dark) {
  /* Defaults to dark theme */
  body {
    --text-color: #ffffff;
    --bkg-color: #000000;
  }
  /* Override dark mode with light mode styles if the user decides to swap */
  body.light-theme {
    --text-color: #000000;
    --bkg-color: #ffffff;
  }
}

* {
  box-sizing: border-box;
}

body {
  min-height: 100vh;
  min-height: -webkit-fill-available; /* Mobile viewport iOS bug fix #1 */
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: var(--bkg-color);
  color: var(--text-color);
  /*font-family: Inter, sans-serif;*/
  font-family: Nimbus Sans L, sans-serif;
  font-size: 26px;
  font-weight: 800;
  line-height: 1.2;
}

html {
  height: -webkit-fill-available; /* Mobile viewport iOS bug fix #2 */
  text-size-adjust: none;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
}

::selection {
  background: #0000ff; /* webkit & blink browsers */
  color: #fff;
}
::-moz-selection {
  background: #0000ff; /* gecko browsers */
  color: #fff;
}

header, footer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

p {
  margin: 0.8rem 1rem;
  margin-bottom: 0.6rem;
}

a.link {
  text-decoration: none;
  color: var(--text-color);
}

a.link:hover {
  font-style: italic;
}

@media only screen and (max-width: 560px) {
  p {
    margin: 0.6rem;
  }
  footer {
    flex-direction: row-reverse;
    align-items: flex-end;
  }
  .corner.mail {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    margin-bottom: 0.6rem;
  }
  .corner.phone {
    writing-mode: vertical-lr;
    text-orientation: mixed;
    margin-bottom: 0.6rem;
    transform: rotate(180deg)
  }
}