body{

  


}
.wrapper {
  display: grid;
  grid-template-columns: 10% 20% 20% 20% 20% 10%;
  grid-template-rows: 40px 120vh 40px 800px 20px;
  color: #444;
}



@media only screen and (min-width: 50px)  {
.footer {
        grid-column-start: 2;
        grid-column-end: 6;
        grid-row-start: 4;
        grid-row-end: 5;

    }
 .quote{
font-family: EB Garamond, serif;
text-align: justify;
font-style: italic;

}

  #warning { display: block; 
        grid-column-start: 2;
        grid-column-end: 6;
        grid-row-start: 1;
        grid-row-end: 2;
  }
}

@media only screen and (min-width: 900px)   {
.footer {
        grid-column-start: 3;
        grid-column-end: 5;
        grid-row-start: 4;
        grid-row-end: 5;
    }
 .quote{
font-family: EB Garamond, serif;
text-align: justify;
margin-right: 20pt;
margin-left: 20pt;

}
  #warning { display: none; } 
}

.content {
        grid-column-start: 2;
        grid-column-end: 6;
        grid-row-start: 2;
        grid-row-end: 3;
    }




a{
color:#108b99;
  text-decoration: underline dotted;

}


 p{
font-family: EB Garamond, serif;
text-align: justify;
}


.toolTip {
  position: absolute;
  display: none;
  min-width: 80px;
  height: auto;
    background-color: #ffffff;
    padding: 3px 12px;
font-family: Baumans, sans;
    border-radius: 25px;

    border: 1px solid #000000;
   /* box-shadow: 1px 1px 4px #bbbbbb; */
  /*     opacity: 0.9;
    filter: alpha(opacity=90);
*/

}


svg {
  width: 100%;
  height: 100%;
}


.bubble {
 /* fill: rgba(76,106,107,0.6);*/

  fill: rgba(255,255,255,0.6);
   stroke: black;

}
.bubble:hover {
  stroke: black;
  fill: rgba(255,193,0,0.8);



  vector-effect: non-scaling-stroke;
}

.link {
  fill: none;
   stroke: rgba(231,1,25 ,.2);

   stroke-linecap: round;
}

.link:hover {
  fill: none;
  stroke-linecap: round;
   stroke: rgba(14,113,178,1);

}