body{
  height: 95vh;
  background-color: gray;
  overflow-x: hidden;
}

.button1 {
  position: absolute;
  z-index: 1;
   width: 150px;
  margin-top: 20px;
  margin-left: 150px;
}
.button2 {
  position: absolute;
  z-index: 1;
  width: 150px;
  margin-top: 45px;
  margin-left: 150px;
}
.button3 {
  position: absolute;
  z-index: 1;
  width: 150px;
  margin-top: 70px;
  margin-left: 150px;
}
svg {
  font: 10px sans-serif;
  text-align: center;
  display: block;
  margin: auto;
}

#title{
 text-align: center;
  font-size: bold 1.5em Helvetica;
    margin-bottom: 0%;
}

#description {
  font: normal 14px verdana;
  margin-bottom: -20%;
}

.main{
  margin-left: 40px;
}

.mainbox{
  margin-top: 150px;
  
}

#tree-map{
  display: flex;
  flex-direction: column;
  text-align: center;
  align-self: center; 
  height: 850px;
  width: 1100px;
  box-shadow:  box-shadow: 1px 1px 10px;
  border-radius: 1%;
  background-color: whitesmoke;
}

text{
  font-family: verdana;
}

#tooltip {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  text-align: Left;
  background-color: DarkSlateGray;
  color: white;
  width: 250px;
  padding: 15px;
  font: 5%;
  box-shadow: 1px 1px 10px;
  border-radius: 10%;
  visibility: hidden; 
}