/*************Tooltip text*******/
.hover-text {
    position: relative;
    display: inline-block;
    /*margin: 40px;*/
    text-align: center;
  }
  .tooltip-text {
    visibility: hidden;
    position: absolute;
    font-family:'Segoe UI', 'Helvetica Neue', sans-serif, Arial;
    font-weight: 400;
    z-index: 2;
    width: 180px;
    color: white;
    font-size: 12px;
    background-color: rgb(0, 71, 71);
    border-style: solid;
    border-width: thin;
    border-color: white ;
    border-radius: 16px;
    padding: 10px 15px 10px 15px;
  }
  
  .tooltip-text::before {
    content: "";
    position: absolute;
  }
  
  .hover-text:hover .tooltip-text {
    visibility: visible;
  }
  .hover-text:hover #fade { opacity: 1; }
  
  #top {
    top: -70px;
    left: 30%;
  }
  
  #top::before {
    top: 80%;
    left: 45%;
  }
  
  #bottom {
    top: 55px;
    left: 10%;
  }
  
  #bottom::before {
    top: -5%;
    left: 45%;
  }
  
  #left {
    top: -8px;
    right: 120%;
  }
  
  #left::before {
    top: 35%;
    left: 94%;
  }
  
  #right {
    top: -35px;
    left: 110%;
  }
  #tightright{
    top: 0px;
    left: 100%;
    
  }
  #tightleft{
    top: 0px;
    right: 100%;
    
  }
  #right::before {
    top: 30%;
    left: 0%;
  }
  /*******************************/