
:root {
  --d-color: #1b1b1b;
  --d-color-transparent: #1b1b1be0;
  --m-color: #303030;
  --ml-color: #404040;
  --l-color: #a02c4e;
}
body {
  margin: 1em;
  background-color: var(--d-color);
  background: url('res/bg.png');
  font-family: Helvetica, Arial;
  font-size: 1.2em;
}
h1 {
  color: var(--l-color);
}
h2 {
  color: var(--l-color);
}
h3 {
  color: var(--l-color);
}
h4 {
  color: var(--l-color);
}
h5 {
  color: var(--l-color);
}
*::selection {
  background: var(--l-color);
  color: var(--d-color);
}
*::-moz-selection {
  background: var(--l-color);
  color: var(--d-color);
}
*::-webkit-selection {
  background: var(--l-color);
  color: var(--d-color);
}
ul {
  word-break: break-word;
}
.sidebar {
  grid-area: sidebar;
}
.content {
  grid-area: content;
}
.cover {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 70vh;
  width: 100vw;
  background: url('res/top_bg.png');
  background-size: cover;
  opacity: 15%;
  z-index: -1;
}
.header {
  border-bottom: 3px solid var(--l-color);
  grid-area: header;
  padding-left: 0 !important;
}
.header h1 {
  font-size: 3em;
  text-align: center;
}
.header img {
  width: 30%;
}
.logo {
  grid-area: logo;
}
.connections {
  grid-area: connections;
}
.wrapper {
  margin-left: auto;
  margin-right: auto;
  width: 50vw;
  display: grid;
  grid-gap: 1em;
  grid-template-areas:
    "menu"
    "header"
    "content"
    "footer";
}
@media only screen and (max-width: 1024px) {
  .wrapper {
    width: 100%;
  }
}
.box {
  color: #fff;
  padding: 1em;
}
.content {
  background-color: var(--d-color-transparent);
}
.footer {
  background-color: var(--d-color-transparent);
}
code {
  font-family: Terminus, Monospace;
  background-color: var(--l-color);
  padding: 1em;
  color: white;
  display: block;
}
.menu {
  font-size: x-large;
}
a:link {
  color: white;
}
a:visited {
  color: gray;
}
a:hover {
  color: white;
}
a:active {
  color: white;
}
img {
  margin: 1em;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  display: block;
}
img.pixelart {
  image-rendering: pixelated;
}
hr {
  border: 1px solid var(--m-color);
}
