:root {
  --black: #1a1a1a;
  --darkpurple: #200025;
  --darkgray: #303030;
  --lightgray: #909090;
  --white: #f0f0f0;
  --magenta: #ff00ac;
  --orange: #f7941d;
  --green: #8dc73f;
  --cyan: #65cdcd;
  --blue: #3f7fff;
  --purple: #9f4fdf;
  --brown: #a16946;
}

body {
  background-color: var(--darkgray);
  color: var(--white);
  font-family: monospace;
  font-size: 120%;
  margin: 0;
  padding: 0;
}

.navbar {
  width: 90%;
  text-align: center;
}

.gatewaypane {
  position: absolute;

  left: 0;
  right: 0;

  margin: auto;
  padding: 20px;

  width: 40%;

  text-align: center;
  background-color: var(--black);
  border-radius: 20px;
}

.gatewayheader {
  color: var(--white);
  font-weight: bold;
}

.gatewayheader:before {
  content: "";
}

.majorbutton {
  margin: auto;
  background-color: var(--black);
  border-radius: 20px;
  padding: 10px;
}

.contentpane {
  position: absolute;

  left: 0;
  right: 0;

  margin: auto;
  padding: 20px;

  width: 90%;

  background-color: var(--black);
  border-radius: 20px;
}

a {
  color: var(--orange);
}

a:hover {
  color: var(--cyan);
}

h1,
h2,
h3 {
  color: var(--blue);
}

h4,
h5,
h6 {
  color: var(--lightgray);
}

h1:before {
  content: "# ";
}

h2:before {
  content: "## ";
}

h3:before {
  content: "### ";
}

h4:before {
  content: "#### ";
}

h5:before {
  content: "##### ";
}

h6:before {
  content: "###### ";
}

pre,
:not(pre)>code {
  margin: 0;
  background-color: var(--darkgray);
  color: var(--green);
  border: 1px dashed var(--green);
  padding: 0px 4px 0px 4px;
  white-space: pre-wrap;
  font-family: monospace;
}

p {
  line-height: 1.2rem;
}