* {
  font-size: 100%;
  font-family: Roboto, Helvetica, Arial, sans-serif;
 }
 
h1 {
  font-family: Roboto, Helvetica, Arial, sans-serif;
}

.md-typeset h1 {
  line-height: 1;
  margin: 0 0 1em;
}

.md-main__inner {
  margin-top: 1.1rem;
}

.md-content__inner {
  padding-top: 0;
}

h2 {
  color: rgba(0, 0, 0, 0.6);
}


h3 {
  color: rgba(0, 0, 0, 0.6);
}


.md-header {
  background-color: rgba(230, 230, 230, 1);
  box-shadow: 0 0 0.2rem #0000, 0 0.2rem 0.4rem #0000;
  color: var(--md-primary-bg-color);
  display: block;
  left: 0;
  position: sticky;
  right: 0;
  top: 0;
  z-index: 4;
}

.md-tabs {
  background-color: rgba(230, 230, 230, 1);
  color: var(--md-primary-bg-color);
  display: block;
  line-height: 1.3;
  overflow: auto;
  width: 100%;
  z-index: 3;
}

:root {
  --md-primary-fg-color:        #83bbdf;
  --md-primary-fg-color--light: #bdd9ea;
  --md-primary-fg-color--dark:  #3a6e8f;

  --md-accent-fg-color:              #83bbdf;
  --md-accent-fg-color--transparent: #bdd9ea;
  --md-accent-bg-color:              #3a6e8f;
  --md-typeset-blockquote-padding: 1px !important; /* Override the CSS variable */
}

.md-grid {
  max-width: 1280px; 
}

.md-ellipsis {
  color:rgba(0, 0, 0, 0.6);
  font-size: 100%;
}

.md-tabs__item {
  color:rgba(0, 0, 0, 0.6);
}

.md-icon svg {
  fill: rgba(0, 0, 0, 0.6);
}

.md-search__input::placeholder {
  color:rgba(0, 0, 0, 0.6);
}

.credits {
  margin-left: auto;
}

.md-tabs__item:nth-child(7) {
  margin-left: auto;
  margin-right: 8px;
}

.md-tabs__item:nth-child(8),
.md-tabs__item:nth-child(9) {
  margin-left: 0;
  margin-right: 8px;
}

.md-tabs__item:nth-child(9) { 
  color:#3a6e8f;
}

.md-tabs__item:nth-child(6)::after {
  content: "";
  flex-grow: 1;
  display: block;
}

.hint {
  background-color: #bdd9ea;
  border-left: 6px solid #3a6e8f;
  padding: 10px;
  margin: 10px 0;
}

blockquote {
  color:rgba(0, 0, 0, 0.75) !important;
  background-color:  #bdd9ea;
  border-left: 6px solid #3a6e8f !important;
  padding: 10px;
}

blockquote p {
  margin: 0;
}

blockquote a {
  color: white !important;
}

.md-footer-meta {
  display: flex;
  justify-content: space-between;
  background-color: var(--md-footer-bg-color);
  color: var(--md-footer-fg-color--lighter);
  font-size: .64rem;
  padding: .75rem 0.75rem;
}


.md-footer-meta a {
  color: var(--md-footer-fg-color--light);
}

.md-footer-meta a:hover {
  text-decoration: underline;
}

/* Hide sidebar and navigation for certain pages */
body.hide-sidebar .md-nav {
  display: none;
}

body.hide-sidebar .md-sidebar {
  display: none;
}

/* Disable table row hover effect*/
table tr:hover {
  background-color: unset !important;
}

/* Button styling */
.rounded-button {
  grid-column: 1 / 2; 
  padding: 10px 20px;      
  background-color: #3a6e8f; 
  color: white;             
  border: none;             
  border-radius: 25px;      
  font-size: 20px;
  text-align: center;         
  cursor: pointer;
  height: 60px;          
  transition: background-color 0.3s ease, transform 0.3s ease;
}

.grid-container > .rounded-button {
  align-self: center; /* Center vertically */
}

.rounded-button:hover {
  background-color: #3a6e8f; 
  transform: scale(1.05);   
}

.rounded-button:focus {
  outline: none;            
  box-shadow: 0 0 5px #bdd9ea; 
}

/* Tooltip container (card) */
.tooltip {
    position: relative;  /* Make sure the tooltip is positioned relative to the card */
    display: block;
    cursor: pointer;
}

/* Tooltip text */
.tooltip .tooltiptext {
    visibility: hidden;   /* Hidden by default */
    width: 150px;
    background-color: #333;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px;
    position: absolute;   /* Positioned absolutely within the card */
    z-index: 1;
    bottom: 100%;         /* Position above the card */
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* Tooltip arrow */
.tooltip .tooltiptext::after {
    content: '';
    position: absolute;
    top: 100%; /* At the bottom of the tooltip */
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #333 transparent transparent transparent;
}

/* Show the tooltip when hovering over the entire card */
.tooltip:hover .tooltiptext {
    visibility: visible;  /* Show the tooltip on hover */
    opacity: 1;
}

.grid.cards.index {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-gap: 20px;
  grid-column: 1 / -1; /* Ensure the cards span across the entire grid */
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4 equal columns for cards */
  grid-gap: 20px;
}

.md-typeset .grid .card {
  background-color: white;
}

.md-typeset .info>.admonition-title, .md-typeset .info>summary  {
  background-color: #bdd9ea;

}

.md-typeset .info>.admonition-title:before, .md-typeset .info>summary:before,
.md-typeset .info>summary:after {
  color: #3a6e8f;
  background-color: #3a6e8f;
  border-color: #3a6e8f;
}

.md-typeset .admonition.info, .md-typeset details.info {
  border-color: #3a6e8f;
}

.md-typeset details.info:focus-within,
.md-typeset details.success:focus-within {
  box-shadow:0 0 0 .2rem #bdd9ea70;
}

.md-typeset .question>.admonition-title, .md-typeset .question>summary  {
  background-color: #bdd9ea;

}

.md-typeset .question>.admonition-title:before, .md-typeset .question>summary:before,
.md-typeset .question>summary:after {
  color: #3a6e8f;
  background-color: #3a6e8f;
  border-color: #3a6e8f;
}

.md-typeset .admonition.question, .md-typeset details.question {
  border-color: #3a6e8f;
}

.md-typeset details.question:focus-within,
.md-typeset details.success:focus-within {
  box-shadow:0 0 0 .2rem #bdd9ea70;
}

.grid.cards.actions {
  display: grids;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-gap: 20px;
  grid-column: 1 / -1; /* Ensure the cards span across the entire grid */
  grid-template-columns: repeat(4, 1fr); /* 4 equal columns for cards */
  grid-gap: 20px;
}
  
/* Define the grid structure */
.grid-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 4 equal columns */
    grid-template-rows: auto auto; /* Two rows: one for the button/text, one for the cards */
    grid-gap: 20px;
    margin-bottom: 20px; /* Space between button/text and cards */
}

/* Button spanning one column (the width of the first card) */
.wide-button {
    grid-column: 1 / 2; /* Span the first column only */
    padding: 10px 20px;
    background-color: #007BFF;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-align: center;
}

.wide-text {
    grid-column: 2 / 5; /* Span from column 2 to column 4 (three columns wide) */
    align-self: center; 
    font-size: 1.2em;
    color: #333;
}

.grid-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4 equal columns */
  grid-template-rows: auto auto; /* Two rows: one for the button/text, one for the cards */
  grid-gap: 20px;
  margin-bottom: 20px; 
}

/* Individual card styling */
.card {
  text-decoration: none;
  color: black !important; 
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 20px;
  background-color: #f9f9f9;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  text-align: center;
  text-decoration: none;
  color: inherit;
  height: 100%;
}

.card-title {
  height: 20%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Divider line style */
.card hr {
  margin: 10px 0; 
}

/* Image styling */
.card img {
  max-width: 100%;
  height: auto;
}

/* Media query for smaller screens (e.g., max-width 768px) */
@media (max-width: 768px) {
  .grid-container {
      grid-template-columns: repeat(2, 1fr); /* Change to 2 equal columns */
  }

  /* Adjust the text spanning across the columns */
  .wide-text {
      grid-column: 1 / 3; /* Span from column 1 to column 2 (2 columns wide) */
  }

  /* Adjust the card layout to match 2 columns */
  .grid.cards.index {
      grid-template-columns: repeat(2, 1fr); /* Change to 2 equal columns for cards */
  }

    /* Adjust the card layout to match 2 columns */
    .grid.cards.actions {
      grid-template-columns: repeat(2, 1fr); /* Change to 2 equal columns for cards */
  }
}

.md-nav__link--active.force-active {
  font-weight: bold;
}

/* Replace MkDocs arrow icon with locally hosted icon to satisfy CSP*/

.md-nav__icon {
  content: url('img/icons/keyboard_arrow_right.svg') !important; 
  transition: transform 0.3s ease; 
  transform: rotate(0deg);
  height: 16px;
  width: 16px;
}

.md-nav__toggle:checked + label .md-nav__icon {
  transform: rotate(90deg); 
}


/* Icons in List of Actions Nav*/

.md-nav__link.icon-listOfActions[href*="breach.html"]::before {
  content: url('img/icons/Breach_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="aquaBarrierVertical.html"]::before,
.md-nav__link.icon-listOfActions[href*="aquaBarrier.html"]::before {
  content: url('img/icons/AquaBarrier_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="aquariwa.html"]::before {
  content: url('img/icons/AquaRiwa_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="bigBags.html"]::before {
  content: url('img/icons/BigBags_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="concreteWall.html"]::before {
  content: url('img/icons/Wall_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="existingProtectionLine.html"]::before {
  content: url('img/icons/Line_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="mobileWalls.html"]::before {
  content: url('img/icons/MobileWalls_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="sandbags.html"]::before {
  content: url('img/icons/Sandbags_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="building.html"]::before{
  content: url('img/icons/Building_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="customOutlet.html"]::before{
  content: url('img/icons/CustomOutletForRoof_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="disableWallBoundaries.html"]::before{
  content: url('img/icons/DisableBuildingWallBoundaries_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}


.md-nav__link.icon-listOfActions[href*="gateway.html"]::before {
  content: url('img/icons/Gateway_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}


.md-nav__link.icon-listOfActions[href*="importantBuilding.html"]::before{
  content: url('img/icons/ImportantBuilding_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="catchmentDerivationZone.html"]::before{
  content: url('img/icons/CatchmentDerivation_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="catchmentExclusion.html"]::before{
  content: url('img/icons/CatchmentExclusion_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="catchmentInclusion.html"]::before{
  content: url('img/icons/CatchmentInclusion_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="decorativeDomain.html"]::before{
  content: url('img/icons/Domain_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href="invalidZone.html"]::before,
  .md-nav__link.icon-listOfActions[href*="domainSetup/invalidZone.html"]::before{
    content: url('img/icons/InvalidZone_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="invalidationPoint.html"]::before {
  content: url('img/icons/InvalidationPoint_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="simulationDomain.html"]::before,
.md-nav__link.icon-listOfActions[href*="maximumSimulationDomain.html"]::before {
  content: url('img/icons/Domain_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px; 
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href="smsMask.html"]::before,
.md-nav__link.icon-listOfActions[href*="domainSetup/smsMask.html"]::before
{
  content: url('img/icons/SMSMask_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px; 
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href="validZone.html"]::before,
.md-nav__link.icon-listOfActions[href*="domainSetup/validZone.html"]::before
{
  content: url('img/icons/ValidZone_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px; 
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="buildingInspection.html"]::before {
  content: url('img/icons/BuildingPick_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="catchmentInspection.html"]::before {
  content: url('img/icons/CatchmentInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="culvertInspection.html"]::before {
  content: url('img/icons/CulvertInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="roofInspection.html"]::before {
  content: url('img/icons/BuildingPick_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="spatialInspection.html"]::before {
  content: url('img/icons/Gauge_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="profileInspection.html"]::before {
  content: url('img/icons/ProfileInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="greenRoof.html"]::before {
  content: url('img/icons/GreenRoof_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="replaceBuildingMeshes.html"]::before,
.md-nav__link.icon-listOfActions[href*="replaceBuildings.html"]::before,
.md-nav__link.icon-listOfActions[href*="replaceCulverts.html"]::before,
.md-nav__link.icon-listOfActions[href*="replaceLanduse.html"]::before,
.md-nav__link.icon-listOfActions[href*="replaceRoads.html"]::before,
.md-nav__link.icon-listOfActions[href*="replaceTerrain.html"]::before{
  content: url('img/icons/ReplaceData_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="bridge.html"]::before {
  content: url('img/icons/Bridge_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px;
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="bridgeWaterway.html"]::before {
  content: url('img/icons/BridgeWaterway_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px;
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="disableAutomaticInflow.html"]::before,
.md-nav__link.icon-listOfActions[href*="disableAutomaticLateralInflows.html"]::before,
.md-nav__link.icon-listOfActions[href*="disableAutomaticOutflow.html"]::before {
    content: url('img/icons/DisableAutomaticFlow_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="inflow.html"]::before {
    content: url('img/icons/Inflow_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="lateralInflow.html"]::before {
  content: url('img/icons/Inflow_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px;
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="outflow.html"]::before {
  content: url('img/icons/Outflow_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="riverBank.html"]::before {
  content: url('img/icons/RiverBank_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="riverLine.html"]::before {
  content: url('img/icons/RiverLine_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="conduitInspection.html"]::before {
  content: url('img/icons/SewerConduitInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="dischargeControllerInspection.html"]::before {
  content: url('img/icons/DischargeController_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="dischargeRestrictorInspection.html"]::before {
  content: url('img/icons/DischargeRestrictor_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="nodeInspection.html"]::before {
  content: url('img/icons/SewerNodeInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="orificeInspection.html"]::before {
  content: url('img/icons/SewerOrificeInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="outfallInspection.html"]::before {
  content: url('img/icons/SewerOutfallInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="pumpInspection.html"]::before {
  content: url('img/icons/SewerPumpInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="storageInspection.html"]::before {
  content: url('img/icons/SewerStorageInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="storageInspection.html"]::before {
  content: url('img/icons/SewerStorageInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="weirInspection.html"]::before {
  content: url('img/icons/SewerWeirInspection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px;
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="conduitClogging.html"]::before {
  content: url('img/icons/PipeClogging_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px;
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="disableJunctionInflow.html"]::before {
  content: url('img/icons/DisableJunctionInflow_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px;
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="disableJunctionOverflow.html"]::before {
  content: url('img/icons/DisableJunctionOverflow_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px;
  height: 0px;
  transform: scale(0.25);
}

.md-nav__link.icon-listOfActions[href*="sewerNodeInflow.html"]::before {
  content: url('img/icons/SewerNodeInflow_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="stormDrain.html"]::before {
  content: url('img/icons/StormDrain_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="culvert.html"]::before {
  content: url('img/icons/Culvert_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}


.md-nav__link.icon-listOfActions[href*="drainingZone.html"]::before {
  content: url('img/icons/DrainingZone_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="impermeableZone.html"]::before {
  content: url('img/icons/ImpermeableZone_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="infiltrationZone.html"]::before,
.md-nav__link.icon-listOfActions[href*="bioretentionSwale.html"]::before,
.md-nav__link.icon-listOfActions[href*="genericNatureBasedSolution.html"]::before,
.md-nav__link.icon-listOfActions[href*="infiltrationPit.html"]::before,
.md-nav__link.icon-listOfActions[href*="rainGarden.html"]::before {
  content: url('img/icons/InfiltrationZone_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="interceptionZone.html"]::before {
    content: url('img/icons/InterceptionZone_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="landuse.html"]::before {
  content: url('img/icons/Landuse_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="pointSource.html"]::before {
  content: url('img/icons/SewerOverflow_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="roughnessZone.html"]::before {
  content: url('img/icons/RoughnessZone_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="waterFilling.html"]::before {
  content: url('img/icons/WaterFilling_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="structure.html"]::before,
.md-nav__link.icon-listOfActions[href*="structureRemoval.html"]::before,
.md-nav__link.icon-listOfActions[href*="complexStructureAxis.html"]::before,
.md-nav__link.icon-listOfActions[href*="complexStructureRemoval.html"]::before {
  content: url('img/icons/StructureRemoval_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="dike.html"]::before {
  content: url('img/icons/Dike_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="hill.html"]::before {
  content: url('img/icons/Hill_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="hole.html"]::before,
.md-nav__link.icon-listOfActions[href*="holeRepair.html"]::before {
  content: url('img/icons/HoleRemoval_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="retentionBasin.html"]::before {
  content: url('img/icons/Retention_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="riverBed.html"]::before,
.md-nav__link.icon-listOfActions[href*="riverCutOut.html"]::before {
  content: url('img/icons/Riverbed_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="annotationZone.html"]::before,
.md-nav__link.icon-listOfActions[href*="annotationLine.html"]::before,
.md-nav__link.icon-listOfActions[href*="workTileStatus.html"]::before{
    content: url('img/icons/Annotation_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="noForest.html"]::before{
    content: url('img/icons/NoForest_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="noWaterShapeProjection.html"]::before{
  content: url('img/icons/NoWaterShapeProjection_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="plant.html"]::before{
  content: url('img/icons/Plant_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="road.html"]::before{
  content: url('img/icons/Road_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}


.md-nav__link.icon-listOfActions[href*="stillWater.html"]::before{
  content: url('img/icons/StillWater_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}

.md-nav__link.icon-listOfActions[href*="vegetation.html"]::before{
  content: url('img/icons/VisualContext_60.png');
  display: inline-block;
  vertical-align: middle;
  margin-right: 15px;
  width: 0px; 
  height: 0px;
  transform: scale(0.25); 
}