@import url("shared.css");

:root {
  --atmos-mid-fill: #666;
  --atmos-invert-bg: #000;
  --atmos-invert-fg: #fff;
  --atmos-shaded: #eee;
  --atmos-space-mid: 0.4rem;
  --atmos-space-small: calc(var(--atmos-space-mid) * 0.5);
}

html, body {
  margin: 0;
  padding: 0;
}
body {
  font-family: Barlow;
}
main {
  max-width: var(--block-width);
  margin: auto;
  min-height: 100vh;
  padding: 2rem 1rem 1rem 1rem;
}
a {
  color: var(--contrasted);
  text-decoration-thickness: 3px;
  text-decoration-color: var(--blue);
}
a:hover {
  text-decoration-color: var(--red);
}

atmos-browser {
  margin-top: 1rem;
  margin-bottom: 3rem;
}

h2 {
  margin-top: 2rem;
  border: var(--brutal-border);
  text-decoration-color: var(--red);
}
h3 {
  margin: 1rem 0 0 0;
}
h3 + p {
  margin-top: 0;
}
pre {
  padding: 1rem;
  background-color: #eee;
}
section img {
  max-width: 100%;
}