@import url(https://fonts.googleapis.com/css2?family=Orbitron&display=swap);

/* variables */
:root {
  /* --font-color: #dddddd; */
  --header-color: #dedede;
  --anchor-color: #f2ecdd;
  --anchor-hover: #dddddd;
  --font-color: #7ebde9; /* #294058 */
  --font-color2: #c3c9ed;
  --font-color3: #cd9c20;
}

/* Resets */
*:not(ul),
*:before,
*:after{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Removing inherited blue outline focus */
*:focus{
  border: 0;
  outline: 0;
}

/* Setting base background for browsers with elastic viewports */
html {
  background: #000;
}

/* Setting the basic content background */
body {
  position: relative;
  background: #000;
  color: var(--font-color);
  height: 100%;
  width: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Site container sections */
.container {
  margin: 0 auto;
  max-width: 1220px;
  position: relative;
}

/* Typography */
h1, h2, h3, h4, h5, h6, .color-white {
  color: var(--header-color);
  margin: 0;
  padding: 0;
}

.color-red {
  color: var(--font-color3)
}

p {
  margin: 0;
  padding: 0;
  font-size: 16px;
}

p, #sun-planets-container ul {
  line-height: 1.5rem;
  /* font-size: 1.15rem; */
  font-family: "Orbitron", Arial, Tahoma, sans-serif;
  /* font-family: "Space Mono", monospace; */
}

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

a:hover {
  color: var(--anchor-hover);
  text-decoration: none;
}