body {
        background-color: #171819;
        color: #d7d3cd;
      }
      
      p, h1, h2, h3, h4, h5, h6 {
        color: #d7d3cd;
      }
      
      a {
        color: #5992e7;
      }
      
      table, th, td {
        border: 1px dotted #d7d3cd;
        padding: 5px;
        border-collapse: collapse;
        margin: 15px;
      }
      
      .body {
        max-width: 1300px;
        text-align:center;
        margin:auto;
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
      }
    
      .divider {
        border-top: 1px dotted #d7d3cd;
      }
      
      .leftgraphic {
        float: left;
        margin:20px;
        padding: 5px;
      }
      
      .left {
        max-width:15%;
        max-height: 1000px;
        overflow: scroll;
        background-color: #2f3335;
        color: #d7d3cd;
        border: 1px dotted #d7d3cd;
        margin: 20px;
        padding: 5px;
        float: left;
      }
      
      .main {
        max-width:58%;
        overflow: scroll;
        background-color: #2f3335;
        color: #d7d3cd;
        border: 1px dotted #d7d3cd;
        margin: 20px;
        padding: 5px;
        float: left;
      }
      
      .right {
        max-width:15%;
        max-height: 1000px;
        overflow: scroll;
        overflow-x: hidden;
        background-color: #2f3335;
        color: #d7d3cd;
        border: 1px dotted #d7d3cd;
        margin: 20px;
        padding: 5px;
        float: right;
      }
      
      .maintext {
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
      }
      
      .sectionheader {
        padding-top: 10px;
        display: flex;
        justify-content: center;
        margin:auto;
      }
      
      .table {
        padding: 0px 100px 20px 100px;
        justify-content:center;
        display:flex;
      }
      
      .gallery {
        margin: 5px;
        margin: auto;
        justify-content:center;
        max-width: 100%;
        height: auto;
        display:flex; 
      }
      
      .gallery img {
        padding: 5px;
        margin: 5px;
        height: 125px;
      }
      
      
      .tooltip {
        position: relative;
        display: inline-block;
      }

      .tooltip .tooltiptext {
        visibility: hidden;
        width: 120px;
        background-color: #555;
        color: #fff;
        text-align: center;
        padding: 5px 0;
        border-radius: 6px;

        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: 50%;
        margin-left: -60px;

        opacity: 0;
        transition: opacity 0.3s;
      }

      .tooltip .tooltiptext::after {
        content: "";
        position: absolute;
        top: 100%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: #555 transparent transparent transparent;
      }

      .tooltip:hover .tooltiptext {
        visibility: visible;
        opacity: 1;
      }
      
      
      @media screen and (max-width: 600px) {
        .body, .left, .main, .right {
          width: 100%; 
        }
      }