/*-- scss:rules --*/

@font-face {
  font-family: "HurmeGeometricSans3Light";
  src: url('./webFonts/HurmeGeometricSans3Light/font.woff') format('woff');
}

@font-face {
  font-family: "HurmeGeometricSans3Regular";
  src: url('./webFonts/HurmeGeometricSans3Regular/font.woff') format('woff');
}

@font-face {
  font-family: "HurmeGeometricSans3Bold";
  src: url('./webFonts/HurmeGeometricSans3Bold/font.woff') format('woff');
}


/* Details on background image for banner*/

#title-block-header {
  margin-top: -5px;
}

.sidebar-menu-container {
  font-family: HurmeGeometricSans3Bold;
}

.sidebar-menu-container a:hover {
  color: #00975a;
}


@media (max-width: 991.98px){
  .quarto-title-block .quarto-title-banner{
  background-size: relative;
  background-repeat: no-repeat;
  height: 650px;
  background-position: center center;
  }
  
  .quarto-title-banner h1, .quarto-title-banner .h1, .quarto-title-banner h2, .quarto-title-banner .h2 {
    color: white;
    font-family: HurmeGeometricSans3Bold;
  }
  
  body .page-columns {
      display: grid;
      align-content: center;
      text-align: start;
      font-family: HurmeGeometricSans3Light;
  }
    
  .quarto-title-banner .quarto-title .title {
   font-size: 75px;
   text-align: center;
   }
   
  .lead {
    font-size: 35px;
    text-align: center;
    color: white;
  }

}


@media (min-width: 992px){
  .quarto-title-block .quarto-title-banner{
  background-size: relative;
  background-repeat: no-repeat;
  height: 800px;
  background-position: center center;
  }
  
  body .page-columns {
      display: grid;
      align-content: center;
      text-align: start;
      font-family: HurmeGeometricSans3Light;
  }
  
  .quarto-title-banner .quarto-title .title {
   font-size: 60px;
   text-align: start;
  }
  
  .quarto-title-banner h1, .quarto-title-banner .h1, .quarto-title-banner h2, .quarto-title-banner .h2 {
    color: white;
    font-family: HurmeGeometricSans3Bold;
  }

  .lead {
    font-size: 40px;
    text-align: start;
    font-family: HurmeGeometricSans3Regular;
    color: white;
  }
  
}



/*Leaflet legend adjust text left*/
figure.quarto-float div.leaflet-control {
  text-align: left;
}

/*Trying to center reactable*/ 
.quarto-float{
  position: center;
}

.reactable {
  position: center;
}
  
  

