body {
      font-family: ms ui gothic;
      margin: 0;
      background-color: #081707;
      /* you can delete the line below if you'd prefer to not use an image */
      background-size: 65px;
      background-image: var(--body-bg-image);
      color:#ffffff
  }

  * {
      box-sizing: border-box;
  }

  /* website wrap*/
  #container {
      max-width: 1000px;
      margin-top:25px;
      margin-right:90px;
      margin-left:60px;
      min-width: 650px;
  }

  body a {
      color: #e3e566;
      text-decoration:none;
      transition: text-shadow 0.2s ease-in-out;
  }

  body a:hover {
      text-shadow: 0 0 5px #d9ff00, 0 0 10px #8cff00b3;;
      }

  #header {
      border: #4CAF50 solid 1px;
      border-radius: 5px;
      width: 100%;
      height: 100px;
      background-size: 100%;
      margin:5px;
  }

  #flex {
      display: flex;
  }

  aside {
      width: 200px;
      font-size: smaller;
      /* this makes the sidebar text slightly smaller */
  }

  .asideBox {
      border: #4CAF50 solid 1px;
      border-radius: 5px;
      padding:20px;
      width: 100%;
  }

  .tree-view {
      background-color: transparent !important;
      border: transparent !important;
      outline: none !important;
      box-shadow: none !important;
      color:#ffffff;
      font-family: ms ui gothic;
  }

  .tree-view li {
      font-size:20px;
      font-family: ms ui gothic;
      padding-bottom: 10px;
  }

  .tree-view ul {
      padding: 0 !important; 
      padding-left:10px !important;
      overflow-y: hidden !important;  /* Prevents any overflow from creating unwanted boxes */
  }
  
  main {
      flex: 1;
      order: 2;
      margin: 5px;
  }

  .mainBoxfull {
      border: #4CAF50 solid 1px;
      border-radius: 5px;
      width: 101%;
      min-height: 675px;
      height:100%;
      overflow-x: hidden;
      overflow-y: hidden;
      position: relative;
      padding:10px;
  }

  .mainFlex {
      display: flex;
      justify-content: space-around;
  }

  table, th, td {
      border:1px solid #4CAF50;
      background-color: #0f140f;
      font-size: 15px;
      margin: auto;

  }
  
  table {
  max-width: 90%;
  table-layout: fixed;
  
  }

  th, td {
      padding: 10px !important;
      word-wrap: break-word;
      white-space: normal !important;
      word-break: break-word;
  }


  section {
      /* ! Everything below is needed ! */
      display: none;
      position: absolute;
      top: 0;
      background: var(--bgcolor);
      width:100%;
  }

  section:target { /* Show section */
      display: block;
  }

  section#home { /* Show #home by default */
      display: block;
  }


  #leftSidebar {
      order: 1;
      margin:5px;
  }

  footer {
      border: #4CAF50 solid 1px;
      border-radius: 5px;
      width: 100%;
      height: 40px;
      text-align: center;
      margin:5px;
  }

  h1 {
      font-size: 25px;
  }

  h2{
      font-size: 20px;
  }

  p {
      color: #A5CF61;
      font-size: 15px;
  }
  
  .mainBoxfull p {
      white-space: normal;
      overflow-wrap: break-word;
      word-wrap: break-word;
      word-break: break-word;
      padding-right: 15px;
  }