.grid-container {
    display: grid;
    grid-template-columns: 10% 90%;
    grid-gap: 20px;
}
.grid-container {
    display: grid;
    grid-template-columns: 10% 90%;
    grid-gap: 20px;
}

.grid-container-tool {
    display: grid;
    grid-template-columns: 20% 80%;
    grid-gap: 20px;
}
.predictors {
    background: #558849;
    color: white;
}
.content {
  overflow-y:scroll;
  height: 300px;
}
.downloads {
    background: #558849;
    color: white;
    text-align: center;
}
.plots {
    alignment: center;
    text-align: center;
}
.sidelink {
    text-decoration: none;
    border:0px;
    color: black;
    outline: 1px;
    font-size:130%;
    background-color: transparent;
    text-align: center;
}
.info {
        background: #558849;
        color: white;
    }

.tutorialText {
    text-align: left;
    width: 80%;
    color: mediumvioletred;
}

.token_form button{
    float: right;
    padding: 5px 10px;
    margin-right: 475px;
    font-size: 15px;
    font-weight: bold;
    border: none;
    cursor: pointer;
}
.token_form input{
    float: left;
    width: 15%;
    margin-left: 475px;
    font-size: 15px;
}

table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

td, th {
  border: 1px solid #878b87;
  text-align: center;
  padding: 8px;
}

thead > tr {
  background-color: #a5a8a5;
}

tr:nth-child(even) {
  background-color: #cfd0cf;
}

button.file_example_button {
    width: 80%;
    text-align: center;
    padding-bottom: 3px;
}

  @import url(http://fonts.googleapis.com/css?family=Raleway);
  #cssmenu,
  #cssmenu ul,
  #cssmenu ul li,
  #cssmenu ul li a,
  #cssmenu #menu-button {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    line-height: 1;
    display: block;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: #558849;
  }
  #cssmenu:after,
  #cssmenu > ul:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
  }
  #cssmenu #menu-button {
    display: none;
  }
  #cssmenu {
    width: auto;
    font-family: Raleway, sans-serif;
    line-height: 1;
  }
  #cssmenu > ul {
    background: #558849;
  }
  #cssmenu > ul > li {
    float: left;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    perspective: 1000px;
  }
  #cssmenu.align-center > ul {
    font-size: 0;
    text-align: center;
  }
  #cssmenu.align-center > ul > li {
    display: inline-block;
    float: none;
  }
  #cssmenu.align-right > ul > li {
    float: right;
  }
  #cssmenu > ul > li > a {
    padding: 16px 20px;
    font-size: 14px;
    color: #ffffff;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    background: #558849;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    -webkit-transform-origin: 50% 0;
    -moz-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
  }
  #cssmenu > ul > li.active > a {
    color: #dff2fa;
  }
  #cssmenu > ul > li:hover > a,
  #cssmenu > ul > li > a:hover {
    color: #dff2fa;
    -webkit-transform: rotateX(90deg) translateY(-23px);
    -moz-transform: rotateX(90deg) translateY(-23px);
    transform: rotateX(90deg) translateY(-23px);
    -ms-transform: none;
  }
  #cssmenu > ul > li > a::before {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: -1;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding: 16px 20px;
    color: #dff2fa;
    background: #558849;
    content: attr(data-title);
    -webkit-transition: background 0.3s;
    -moz-transition: background 0.3s;
    transition: background 0.3s;
    -webkit-transform: rotateX(-90deg);
    -moz-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
    -webkit-transform-origin: 50% 0;
    -moz-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -ms-transform: translateY(- -18px);
  }
  #cssmenu > ul > li:hover > a::before,
  #cssmenu > ul > li > a:hover::before {
    background: #558849;
  }
  #cssmenu.small-screen {
    width: 100%;
  }
  #cssmenu.small-screen > ul,
  #cssmenu.small-screen.align-center > ul {
    width: 100%;
    text-align: left;
  }
  #cssmenu.small-screen > ul > li,
  #cssmenu.small-screen.align-center {
    float: none;
    display: block;
    border-top: 1px solid rgba(100, 100, 100, 0.1);
  }
  #cssmenu.small-screen > ul > li:hover > a,
  #cssmenu.small-screen > ul > li > a:hover {
    color: #dff2fa;
    -webkit-transform: none;
    -moz-transform: none;
    transform: none;
    -ms-transform: none;
  }
  #cssmenu.small-screen > ul > li > a::before {
    display: none;
  }
  #cssmenu.small-screen #menu-button {
    display: block;
    padding: 16px 20px;
    cursor: pointer;
    font-size: 14px;
    text-decoration: none;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 1px;
    background: #558849;
  }
  #cssmenu.small-screen #menu-button:after {
    content: "";
    position: absolute;
    right: 20px;
    top: 17px;
    display: block;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    width: 22px;
    height: 3px;
  }
  #cssmenu.small-screen #menu-button.menu-opened:after {
    border-top: 2px solid #dff2fa;
    border-bottom: 2px solid #dff2fa;
  }
  #cssmenu.small-screen #menu-button:before {
    content: "";
    position: absolute;
    right: 20px;
    top: 27px;
    display: block;
    width: 22px;
    height: 2px;
    background: #ffffff;
  }
  #cssmenu.small-screen #menu-button.menu-opened:before {
    background: #558849;
  }
  .token_input{
    float:left;
    margin:7px;
    opacity:1;
    }

  .token_input button{
      background-color: #616161;
      color: #f2f2f2;
      float: right;
      padding: 5px 10px;
      margin-right: 16px;
      font-size: 15px;
      font-weight: bold;
      border: none;
      cursor: pointer;
  }
  .token_input input{
      background-color: #FAFCFA;
      float: left;
      width: 40%;
      font-size: 15px;
  }
  .token_input label{
      float: left;
      color: #dff2fa;
      font-size: 18px;
      padding: 5px 10px;
      width: auto;
      font-family: Raleway, sans-serif;
      line-height: 1;
  }
  .email_input{
    float:center;
    margin:7px;
    opacity:1;
    }
    .email_input input{
        background-color: #FAFCFA;
        float: left;
        width: 60%;
        font-size: 15px;
    }
    .email_input label{
        float: left;
        font-size: 18px;
        padding: 5px 10px;
        width: auto;
        font-family: Raleway, sans-serif;
        line-height: 1;
      }
      .token_email{
        float:center;
        margin:7px;
        opacity:1;
        }
        .token_email input{
            background-color: #FAFCFA;
            float: left;
            width: 30%;
            font-size: 15px;
        }
        .token_email label{
            float: left;
            font-size: 18px;
            padding: 5px 10px;
            width: auto;
            font-family: Raleway, sans-serif;
            line-height: 1;
          }
          a:hover {
          text-decoration: none;
          }

          .apexcharts-xaxis-texts-g text[id^='SvgjsText'] {
            display: none;
          }
          .apexcharts-xaxis-texts-g text[id^='SvgjsText']:nth-of-type(10n){
            display: revert;
          }