body {
      overflow-y: hidden;
      margin:0;
      background-color: #FFFBF8; 
    }
    a:link {
    color: white;
    }

    /* visited link */
    a:visited {
        color: white;
    }

    /* mouse over link */
    a:hover {
        color: white !important;
    }

    /* selected link */
    a:active {
        color: white !important;
    }

    


    .cont {
      padding: 0 !important;
      margin: 0 !important;
      overflow: hidden;
    }

    .closeButton {
      /*color: #777;*/
      font: 10px;
      position: absolute;
      font-family: Arial;
      right: 5px;
      top: 5px;
      cursor: pointer; 
      cursor: hand;
    }


    /* SVG shit */

    .svg{
      background-color: rgba(255,255,255,0);
      position: absolute;
      margin:0;
    }
    .introBG{
      position: absolute;
      display: block;
      margin: auto;
      width: 100%;
      height: 100%;
      background-color: #FFFBF8; 
      opacity: .8;
    }
 
    .links line {
      stroke: #aaa;
      /*stroke-opacity: .3;*/
      /*stroke-width: 2px;*/
    }

    .nodes  {
    /*fill:green;
    opacity: .3;*/
    pointer-events: all;
    /*stroke-width: 22px;
    stroke-opacity:1;*/
    }
    .txt{
      font-family: lekton;
      /*font-weight: bold;  */
      font-size:10px;
      text-anchor:middle;
      cursor:default;
      pointer-events: none;
      user-select: none;
      -moz-user-select: none;
      -khtml-user-select: none;
      -webkit-user-select: none;
      -o-user-select: none;
      padding-bottom: 5px;
    } 
    .txtHover{
      font-size:12px;
      /*font-weight: bold;*/
    }
    .small{
      color:#26596B;
      font-family: lekton;
      /*font-weight: bold;  */
      font-size: 14px;
      text-anchor:middle;
      cursor:default;
      pointer-events: none;
      user-select: none;
      -moz-user-select: none;
      -khtml-user-select: none;
      -webkit-user-select: none;
      -o-user-select: none;
      padding-bottom: 5px;
    }

    #loadingText{
      font-family: lekton;
      /*font-weight: bold;  */
      font-size:1px;
      text-anchor:middle;
      text-align: left;
    } 

    .num{ /*txt subclass badly done*/    
      font-size:10px;
      font-weight: normal; 
    }

    .numTot{ /*txt subclass badly done*/    
      font-size:24px;
      /*font-style: italic;*/
      /*line-height: 140%;*/
    }

    .active{
      /*stroke: #000;
      stroke-width: 8px;*/
    }

    .btnText{
      font-weight: normal; 
      font-size:12px; 
    }

    .introduction-overlay{
      margin: auto;
      position: absolute;
      top: 0; left: 0; bottom: 0; right: 0;
      width: 95%;
      height: 95%;
      max-height: 700px;
      max-width: 700px;
      align-items: center;
      /*background-color: white;*/
/*      border-style: solid;
      border-width: 1px;
      border-color: #3B4F6B #3B4F6B;
      border-radius: 3px;*/
      padding: 0;
      -ms-transform: scale(0.83, 0.83); /* IE 9 */
    -webkit-transform: scale(0.83, 0.83); /* Safari */
    transform: scale(0.83, 0.83);
    z-index: 3; 
    }

    .introduction-overlay span{
      color: #3B4F6B;
      /*background-color: #ff0000;*/
    }

    .centerButton {
      bottom: 0;
      left: 50%;
      position: absolute;
      transform: translateX(-50%);
      color: #3B4F6B;
      cursor: pointer; 
      cursor: hand;
    }

    div.tooltip {
        color: white;
        font-family: lekton;
        background: #26596b;
        position: absolute;     
        text-align: center;     
        z-index: 10;
        /*width: 90px;          
        height: 28px; */        
        padding: 8px;       
        font-size: 12px;
        letter-spacing: 1px; 
        border: 0px;    
        border-radius: 2px;     
        pointer-events: none;  
        opacity:.9; 
        transform:scale(1); 
        left: -20px;
        top: 10px;
    }

    .tooltip:after {
        top: 100%;
        left: 50%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-color: rgba(38, 89, 107, 0);
        border-top-color: #26596b;
        border-width: 10px;
        margin-left: -10px;
    }

    .tooltip.ui{

    }

    #btn_intro {
      cursor: pointer;
      cursor: hand;
    }

    #btn_close {
      cursor: pointer;
      cursor: hand;
    }

    #btn1 {
      cursor: pointer;
      cursor: hand;
    }

    #btn2 {
      cursor: pointer;
      cursor: hand;
    }

    .info-icon {
      color: black;
      font-family: lekton;
      fill: #FFFBF8;
      stroke: #26596b;
      stroke-width: 2;
      background: #26596b;
      cursor: pointer;
      cursor: hand;
    }

    #info-container {
        margin-left: 15px;
        bottom: 10px;
        z-index: 20; 
        position:absolute;
    }

    #logoId {
      width:40%;
      max-width:250px;
      margin-left: 10px;
      top: 10px;
      z-index: 1; 
      position: absolute;
      cursor: pointer;
    }

    #legendId {
      /*opacity: .1;*/
      width: 40%;
      max-width: 250px;
      margin-left: 10px;
      top: 130px;
      z-index: 1; 
      position: absolute;
      pointer-events: none;
      touch-action: none;
      /*cursor: auto;*/
      -webkit-touch-callout: none;
      -webkit-user-select:none;
      -khtml-user-select:none;
      -moz-user-select:none;
      -ms-user-select:none;
      -o-user-select:none;
      user-select:none;
    }
/*    #legendId img{
        user-select: none;
        -moz-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -o-user-select: none;
    }*/

    #aboutId{
      width:10%;
      /*float: right;*/
      right: 15px;
      max-width: 65px;
      /*margin-left: 10px;*/
      top: 10px;
      z-index: 1; 
      position: absolute;
      cursor: pointer;
        
    }
        
    /* On small screens, set height to 'auto' for sidenav and grid */
    @media screen and (max-width: 769px) {
    div.tooltip{
      transform: scale(1);
      overflow: hidden;
    }
    #legendId {
      top: 20vw;
    }

    @media (min-width: 450px) {
        div.tooltip {
         overflow-x: hidden;
      }
    }