html,
  body,
  #mapEl {
    padding: 0;
    margin: 0;
    height: 100%;
    width: 100%;
    display: flex;
  }


body {
  font-family: "Poppins";

}

  body {
    display: flex;
  }

  calcite-loader {
    align-self: center;
    justify-self: center;
  }

  #info-content {
    padding: 0.75rem;
  }

  calcite-rating {
    margin-top: 0.25rem;
  }



calcite-button[data-action-id="redID"] {
      --calcite-icon-color: red;
--calcite-button-border-color: #4A4A4A;
    }


calcite-button[data-action-id="blueID"] {
      --calcite-icon-color: blue;
--calcite-button-border-color: #4A4A4A;
    }

:root {
--calcite-button-background-color: white; /* Example: Blue color */
--calcite-button-text-color: #4A4A4A;
--calcite-button-border-color: #4A4A4A;
--calcite-tile-border-color: lightgrey;  //#4A4A4A;
--calcite-tile-heading-text-color: grey; 

    }

calcite-dialog[id="AlertDialog"]{
--calcite-panel-header-background-color: #F3F3F3;

}

calcite-dialog[id="WelcomeDialog"]{
--calcite-dialog-footer-background-color: #F3F3F3;
--calcite-dialog-border-color: white;
--calcite-dialog-scrim-background-color: rgba(0, 0, 0, 0.5);

}

calcite-button[data-action-id="ShowTables"] {
--calcite-button-border-color: white;
--calcite-button-text-color: #757575;

    }


/* *****************tool pad ******************/
calcite-shell-panel[id="floatingToolPad"] {
      --calcite-shell-panel-min-width: 0;
      --calcite-shell-panel-width: auto;
      --calcite-shell-panel-max-width: auto;

    }

calcite-shell-panel {
      --calcite-shell-panel-min-width: 300px;
      --calcite-shell-panel-width: 400px;
      --calcite-shell-panel-max-width: 500px;
    }


  calcite-tab-title[selected] {
        --calcite-tab-background-color: white;
    }

calcite-action-bar[id="PadID"]{
--calcite-action-bar-background-color: #F3F3F3;

}


/* *****************BELOW THIS IS NOT CALCITE!!!******************/


/* ******************  Position floating tools ***************************/
#fixedOverlayDiv {
      position: absolute;
      top: 5px;
      left: 150px;
      z-index: 10; /* Ensure it's above the map */
      background-color: rgba(255, 255, 255, 0.0);
   
      border-radius: 5px;
	
  }

.tab {
  float: left;
  border: 1px solid #ccc;
  background-color: #f1f1f1;

}

/* Style the buttons that are used to open the tab content */
.tab button {

  display: block;
  background-color: white;
  color: #757575;
  padding: 14px 14px 14px 14px;
  width: 145px;
  border: none;
  outline: 1px solid #F3F3F3;
  text-align: left;
  cursor: pointer;
  transition: 0.3s;
 font-size: 14px;
font-family: "Poppins";

}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #F3F3F3;
}

.tab button:focus {
  outline: 3px solid #00619B;
}


/* Create an active/current "tab button" class */
.tab button.active {
  background-color: #EAEAEA; 
border: 2px solid #4A4A4A;
 
}

/* Style the tab content */
.tabcontent {
  border: 1px solid #ccc;
  border-left: none;
width 100%;

}

/* Style the tab table content for bottom tabs */
.tabTablecontent {
 height:240px;
width: 90%;
}

/* Style the tab table content for bottom tabs */
.tabRESULTSTablecontent {
 height:220px;
width: 90%;
overflow: auto; 
}




/* Style the button for link to tax info */
.TTCButton {
     background:none;
     color:#00619B;
     border:none; 
     padding:0!important;
     font: inherit;
     /*border is optional*/
     border-bottom:1px solid #444; 
     border-color:#007FB0;
     cursor: pointer;
}