/* This file contains the style sheets that caused the engine to work properly */
/* Edit with caution.                                                          */

div {
  box-sizing: border-box;       
}

sub.menu {
   font-size: 10px;
   vertical-align: inherit;
}

a.menu {
   font-size: 12pt;
   line-height: 24px;
   color: black;
   display: block;
   padding-right: 16px;
}

a.current {
   font-weight: bold;
   line-height: 20px;
   text-decoration: none;
   padding-right: 16px;
   display: block;
}

a.docold {
}

a.docnew:after {
  content: url('images/star.png');
  vertical-align: middle;
}


div.toc a {
   line-height: 16px;
}

div.toc {
  font-size: 10pt;
  white-space: normal;
  overflow: auto;
  margin-top: 16px;
  padding-bottom: 8px;
}

a.menu img {
  vertical-align: middle;
}


a.current img {
  vertical-align: middle;
}


img {
  border-style: none;
  border-width: 0px;
}


div.mainmenu {
  position: fixed;
  background-color: #800010;
  display: none;
  padding: 16px;
  left: 70%;
  top: 40px;
  max-height: calc(100% - 56px);
  max-width: 28%;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 380;
  box-shadow: -4px 4px 8px black;
}


div.mainmenu * {
  color: white;
}

label#hamburger {
  float: left;
  display: block;
  position: fixed;
  right: 31%;
  right: calc(30% + 20px);
  top: 8px;
  text-align: left;
  height: 64px;
  width: 64px;
  background-color: #f00000;
  z-index: 400;

  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;

  box-shadow: -4px 4px 8px black;
}

label#hamburger > img {
  position: relative;
  left: 16px;
  top: 16px;
}

input#menubutton {
  display: none;
}

input#menubutton:checked + div.mainmenu {
  display: block;
}


/* the maxwidth menu container. It should be invisible, but to exists as a wide */
div.spacer {
   vertical-align: top;
   font-size: 12pt;
   background-color: transparent;
   color: transparent;
   height: 0px;
   overflow: hidden;
}

div.menu > div {
  line-height: 4px;
}

input.dirmenu:checked + div.menu > a {
  display: block;
}

input.dirmenu:checked + div.menu > img {
  display: inline;
}

input.dirmenu:checked + div.menu > label {
  display: inline;
}

input.dirmenu:checked + div.menu > div {
  display: block;
}

div.menu br {
  display: block;
}

div.menu > br {
  display: block;
}

input.dirmenu:checked + div.menu > br {
  display: block;
}



input.dirmenu + div.menu > * {
  display: none;
}


input.dirmenu {
  display: none;
}

label.dirmenu {
  padding-left:   20px;
  padding-right:  16px;
  line-height:    24px;
  vertical-align: middle;
  white-space: nowrap;
}

input.dirmenu + div.menu {
  background-image: url(images/folder.gif);
  background-origin: border-box;
  background-position: 0px -2px;
  background-repeat: no-repeat;
  background-size: 20px 30px;

  padding-top: 16px;
  padding-left: 20px;
  margin-top: -1em;
}

div.fakemenu {
  border-top: 20px solid transparent;
  border-left: 20px solid transparent;
  margin-top: -20px;
}

input.dirmenu:checked + div.menu {
  background-position: 0px -18px;
}

label.dirmenu {
  cursor: pointer;
}


input.tocmenu:checked + div.menu > a {
  display: inline;
}

input.tocmenu:checked + div.menu > img {
  display: inline;
}

input.tocmenu:checked + div.menu > label {
  display: inline;
}

input.tocmenu:checked + div.menu > div {
  display: block;
}

input.tocmenu:checked + div.menu > br {
  display: block;
}


input.tocmenu + div.menu > * {
  display: none; 
}

input.tocmenu {
  display: none;
}

input.tocmenu + div.menu {
  font-size: 0.8em;

  background-image: url(images/folder.png);
  background-origin: border-box;
  background-position: 0px 0px;
  background-repeat: no-repeat;
  background-size: 20px 32px;

  border-top: 16px solid transparent;
  border-left: 20px solid transparent;
  margin-top: 0em;
  margin-bottom: 0em;

  padding-bottom: 0em;
  padding-top: 0em;
  padding-left: 20px;
  margin-top: -18px;
}

input.tocmenu:checked + div.menu {
  background-position: 0px -16px;
}

label.tocmenu {
  cursor: pointer;
  padding-left:   20px;
  line-height:    20px;
  vertical-align: top;
  font-size: 0.95em;
}


