:root { 
  --errorcolor: #ff2453; 
  --bgcolor: #1C2322;
  --fgcolor: #52CCBF;
  --bgcoloralt: #000000;
  --fgcoloralt: #ed9467;
  --textcolor: #fafcfb;
}

.text {
  color: var(--textcolor);
}

nav {
  border-top: 2px dashed var(--textcolor);
  border-bottom: 2px dashed var(--textcolor);
  width: 80ch;
}

nav ul {
  text-align: justify;
  line-height: 0;
  margin-top: 1ch;
  margin-bottom: 1ch;
  padding: 0;
}

nav ul:after {
  content: '';
  display: inline-block;
  width: 100%;
}

nav ul li {
  display: inline-block;
  line-height: 100%;
  margin-top: 4px;
  margin-bottom: 4px;
}

.halfbanner {
  display: none;
}

.main_menu {
  height: 4ch;
}

#top_wrapper {
  height: 27ch;
  background-color: var(--bgcolor);
  z-index: 10000;
  display: none;
}

#top {
  background-color: var(--bgcolor);
  height: 27ch;
  position: fixed;
  top: 0; 
  z-index: 10000;
}

.left_container {

  background-color: var(--bgcolor);
  float: left;
  width: 80ch;
  height: 100%;
  margin-bottom: 2ch;
}

@media (max-width: 767px) {
    nav {
      width: 40ch;
    }
    nav li {
        display: block;
        width: 100%;
        text-align: center;
    }

    .fullbanner {
      display: none;
    }
    .halfbanner {
      display: block;
    }


    .main_menu {
      height: 11ch;
    }

    #top_wrapper {
      height: 32ch;
      background-color: var(--bgcolor);
      z-index: 10000;
    }

    #top {
      background-color: var(--bgcolor);
      height: 32ch;
      position: fixed;
      top: 0;
      z-index: 10000;
    }

    .left_container {
      background-color: var(--bgcolor);
      float: left;
      width: 40ch;
      height: 100%;
      margin-bottom: 2ch;
    }

}

body {
  background-color: var(--bgcolor);
  font-family: FixedsysExcelsior301Regular, monospace;
  font-size: medium;
  margin: 0px;
  border: 0px;
  padding: 0px;
  font-smooth: never;
  -webkit-font-smoothing : none;
}

.container {
    display: table;
    margin: 0 auto;
}



.right_container {
}

#asciicam {
  font-family: Courier;
  font-size: 5px;
  width: 50%;
  background-color: var(--bgcolor);
  color: #DDA123;
}

.corpulent {
  display: none;
}

pre {
  display:inline-block; 
  color: var(--textcolor);
  font-family: FixedsysExcelsior301Regular, monospace;
  font-size: medium;
  white-space: pre-wrap;
  overflow: visible;
  word-break: normal;
  word-wrap: normal;
  margin: 0 auto;
  margin-bottom: 2ch;
  margin-top: 2ch;
  display: block;
  font-smooth: never;
  -webkit-font-smoothing : none;
}



pre.banner {
  color: var(--fgcolor);
}

pre.loadscreen {
  color: var(--textcolor);
}


.loadscreen_fill {
  color: var(--fgcoloralt);
}