@import url('https://cdnjs.cloudflare.com/ajax/libs/open-iconic/1.1.1/font/css/open-iconic-bootstrap.min.css');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans');
@import url('https://fonts.googleapis.com/css2?family=Material+Icons');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined');

:root {
  /*#b5deff A lighter, brighter blue*/
  /*--main-bg-color: #a0d2eb;*/ /*A nice, darker, blue*/
  /*--main-bg-color: #fff5d7;*/ /*Ragin Beige*/
  /*--main-bg-color: #eef1ff;*/ /*A light, baby blue*/
  --main-bg-color: #A0DEFF;
  /*--second-bg-color: #FFE9D0;*/ /*Skin tone*/
  /*--second-bg-color: #BFD8AF;*/ /*A darker nature green*/
  --second-bg-color: #BFD8AF; /*A darker nature green*/
  --second-bg-color: #D0F5BE; /*A darker nature green*/
  --filter-bar-bg-color: #D0F5BE; /*light yellow-green that goes good with blue*/
  --formj-label-bg-color: #E1F0DA; /*Barely green soft pastel*/
  --formj-label-bg-color: #F0EDD4; /*Light skin tone with some pink*/
  --formj-label-bg-color: #F9FBE7; /*Very light earth yellow*/
  --formj-label-bg-color: #FFF2CC; /*Very light earthy yellow orange*/
  --formj-label-bg-color: #E9EDC9; /*Soft darker sand*/
}

/* Default Blazor CSS - Don't modify */

html, body {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

h1:focus {
  outline: none;
}

a, .btn-link {
  color: #0071c1;
}

.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

.content {
  padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}

.invalid {
  outline: 1px solid red;
}

.validation-message {
  color: red;
}

#blazor-error-ui {
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}

  #blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
  }

.blazor-error-boundary {
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
  padding: 1rem 1rem 1rem 3.7rem;
  color: white;
}

  .blazor-error-boundary::after {
    content: "An error has occurred."
  }

/* End Default Blazor CSS - Don't modify */

/* My Custom CSS */

body {
  overflow-y: scroll !important;
}

.CssMainBackgroundColor {
  background-color: var(--main-bg-color) !important;
}

.color-light-green-bg {
  background-color: #E1F0DA;
}

.CssFontSize13px {
  font-size: 13px !important;
}

.CssFontSize14px {
  font-size: 14px !important;
}

.CssFontSize15px {
  font-size: 15px !important;
}

.CssFontSize16px {
  font-size: 16px !important;
}

.text-underline-hover {
  text-decoration: none;
}

  .text-underline-hover:hover {
    text-decoration: underline;
  }

#btn-back-to-top {
  background-color: var(--filter-bar-bg-color);
  border: 2px solid #51d0de;
  color: #51d0de;
  font-weight: bold;
  font-size: 1.1em;
  position: fixed;
  bottom: 20px;
  right: 20px;
  display: none;
}

.CssFieldset {
  padding: 10px;
  margin: 10px 5px;
  border: 1px solid #dedede;
  border-radius: 5px;
}

.CssFieldsetLegend {
  float: none;
  width: auto !important;
  line-height: 22px;
  font-size: .97em;
  color: #666;
  padding: 0 7px;
  margin: 0 0 0 15px;
}

/*Used when needing to style a Google Symbols Outlined icon in the horizontal NavMenu*/
.oi-override {
  font-size: 16px;
  padding-right: .4rem;
  position: relative;
  top: 1px;
  speak: none;
  -moz-osx-font-smoothing: grayscale;
}

.p-7px {
  /* Don't change this from 7px. It's used to properly align static text in FormJ containers. */
  padding: 7px;
}

.CssStageSelectTd select {
  border-width: 1px;
  border-color: inherit;
  padding: 0 5px !important;
}

.CssStageFontColorWhite {
  color: white !important;
}

.CssStageFontColorBlack {
  color: black !important;
}

.CssMessagePs p {
  margin: 0px;
  padding: 0px;
}

.sticky-top-bob {
  background-color: var(--second-bg-color);
  border-bottom: 2px solid #aaa;
  border-top: 1px solid #ccc;
  position: sticky;
  top: 56px;
  z-index: 1020;
  padding: 6px 0 6px 0;
}

.mud-input-control-input-container .mud-input .mud-input-root {
  padding: 10px 12px !important;
  color: #212529 !important;
}

.mud-input-control-input-container .mud-input-underline {
  margin-top: 0px !important;
}

.mud-input-outlined, .mud-input-outlined-border {
  border-color: #DEE2E6 !important;
}

.form-check-input {
  border-color: #999 !important;
}

.CssTableStriped tbody tr:nth-child(even) td {
  background-color: #f2f2f2;
}

.CssTableFormLabel {
  font-size: 1.1em;
  color: #aaa;
  width: 25%;
  text-align: right;
  padding: 6px 7px 2px 2px !important;
}

  .CssTableFormLabel span {
    font-size: .95em;
    color: #777;
  }

    .CssTableFormLabel span:after {
      content: ':';
    }

.CssTableFormRequired {
  padding: 2px 6px 2px 0 !important;
  width: 1%;
  font-size: 1.2em;
  color: red !important;
  line-height: 22px;
}

.CssTableFormValue {
  width: 75%;
  padding: 2px 0px 2px 2px;
}

.nav-link {
  padding: .5rem 1rem !important;
}

.sidebar {
  background: linear-gradient(0deg, rgba(78,177,255,1) 0%, rgba(0,54,101,1) 100%) !important;
}

.CssInputContainer1 {
}

.CssInputContainer1Label {
  font-family: 'Arial';
  font-weight: normal;
  font-size: .9rem;
  color: #555;
}

.CssInputContainer1LabelOpacity1Important {
  opacity: 1.0 !important;
}

.CssInputContainer1Form {
  border: 0px solid #ddd;
  border-radius: 4px;
}

.CssFormJDivContainerClass {
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 0;
  margin: 0;
}

.CssFormJTableClass {
  border-radius: 4px;
  width: 100%;
  border-collapse: collapse;
}

.CssFormJLabelTdClass {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  padding: 3px 7px;
  border-bottom: 1px solid #ccc;
  /*background: #E7F2F8;*/
  /*background: #F5F1D2; Ecru*/
  /*background: #D8EFD3;*/ /*light dull green*/
  /*background: #FCF8E8;*/ /*A better ecru*/
  background-color: var(--formj-label-bg-color);
}

  .CssFormJLabelTdClass div {
    font-family: 'Arial Rounded MT';
    /*font-family: 'Helvetica';*/
    font-weight: normal;
    font-size: 1rem;
    color: #555;
  }

.CssFormJFormTdClass {
  width: 99%;
  padding: 5px 5px 5px 7px;
}

  .CssFormJFormTdClass > div {
    min-height: 38px;
  }

.CssFormJRequiredClass {
  position: inherit;
  display: inline-block;
  padding: 0px 7px 3px 0;
  width: 1%;
  line-height: 1rem;
  font-size: 1.2rem;
  color: red !important;
}

.CssFormJRequiredMessageTdClass {
  font-weight: bold;
  padding: 0 9px 5px 9px;
  font-size: 1rem;
  color: red;
}

.CssBoxTitle {
  padding: 0;
  margin: 0 0 20px 0;
  /*background: #f7f7f7;*/
  /*border-top: 1px solid #d6d5d5;*/
  border-bottom: 1px solid #d6d5d5;
}

.CssBoxBody {
  margin-bottom: 40px;
  /*border-top: 1px solid #ccc;
  border-left: 1px solid #d6d5d5;
  border-right: 1px solid #d6d5d5;
  border-bottom: 1px solid #d6d5d5;*/
}

.CssUserAccessGreenCheck {
  color: green;
}

.CssLookupInputText {
  display: inline-block;
  position: relative;
  width: 100%;
}

.CssDivLookupContainer {
  max-height: 300px;
  background-color: #ffffff;
  position: absolute;
  width: 500px;
  overflow-y: scroll;
  overflow-x: hidden;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 10000;
  min-height: auto;
}

  .CssDivLookupContainer > div {
    margin: 0;
    /*border-top: 1px solid #ccc;*/
    border-collapse: collapse;
    padding: 2px 5px;
  }

    .CssDivLookupContainer > div:hover {
      /*cursor: pointer;*/
      background: #1967D2;
      color: white;
    }

    .CssDivLookupContainer > div > div {
      float: right;
    }


.CssDivFilterContainer {
  background-color: #ffffff;
  position: absolute;
  width: 300px;
  overflow-y: scroll;
  overflow-x: hidden;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 10000;
}

  .CssDivFilterContainer > div {
    border-top: 1px solid #ccc;
    border-collapse: collapse;
    padding: 2px 5px;
  }

    .CssDivFilterContainer > div:hover {
      cursor: pointer;
      /*background: #26D07C;
      color: white;*/
      font-weight: bold;
    }

    .CssDivFilterContainer > div.active {
      background-color: #1E90FF; /* selected item blue */
      color: white;
    }

    .CssDivFilterContainer > div > div {
      float: right;
    }

.CssDivFilterContainerWithTwoDivs {
  background-color: #ffffff;
  position: absolute;
  width: 300px;
  overflow-y: scroll;
  overflow-x: hidden;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 10000;
}

.CssDivFilterContainer > div > div {
  border-top: 1px solid #ccc;
  border-collapse: collapse;
}

  .CssDivFilterContainer > div > div:hover {
    cursor: pointer;
    font-weight: bold;
  }

.CssManageDocumentInput input[type=text], .CssManageDocumentInput textarea, .CssManageDocumentInput select {
  width: 600px;
}

.font-size-15px {
  font-size: 15px !important;
}

.font-size-18px {
  font-size: 18px;
}

.text-light-gray {
  /*color: #2193b0 !important;*/ /*Original light gray aqua-ish color*/
  color: #4792E6 !important;
}

.google-menu-icons {
  /*color: #2193b0 !important;*/ /*Original light gray aqua-ish color*/
  color: #4eb1ff !important;
  position: relative;
  top: 5px;
  padding-right: 5px;
}

.min-width-400px {
  min-width: 400px;
}

.min-width-350px {
  min-width: 350px;
}

.min-width-300px {
  min-width: 300px;
}

.min-width-250px {
  min-width: 250px;
}

.min-width-200px {
  min-width: 200px;
}

.min-width-150px {
  min-width: 150px;
}

.w-99 {
  width: 99%;
}

.pt-2-5 {
  padding-top: .65rem !important;
}

.pt-1-5 {
  padding-top: .45rem !important;
}

.action-icon-with-hover {
  padding: 3px;
  border: 2px solid transparent;
}

  .action-icon-with-hover:hover {
    background-color: #999;
    border: 2px solid #dddddd;
  }

#divFilterBar.row {
  --bs-gutter-x: 0;
}

#dtDocSearchInput {
  display: inline-flex;
  width: 150px;
}

table.dataTable.no-footer {
  border-bottom: 1px solid #cfcfcf !important;
}

.dataTables_filter {
  padding-bottom: 3px;
}

  .dataTables_filter input {
    padding: 1px 6px !important;
  }

.dt-no-search {
  /*re: DataTables, class name used to indicate column not included in filter*/
}

.dt-no-order {
  /*re: DataTables, class name used to indicate column not orderable*/
}

.dt-no-visible {
  /*re: DataTables, class name used to indicate column not visible*/
}

table.dataTable tbody td {
  vertical-align: top;
}

table.dataTableVendor > thead .sorting::before {
  top: 64% !important;
}

table.dataTableVendor > thead .sorting::after {
  top: 74% !important;
}

.alert-box-lucidity-blue {
  font-size: 1.1rem;
  background-color: var(--filter-bar-bg-color);
  border: 2px solid #51d0de;
  border-radius: 4px;
  padding: 8px 10px;
}

  .alert-box-lucidity-blue ul {
    margin-bottom: 0;
    position: relative;
  }

    .alert-box-lucidity-blue ul li {
      padding-bottom: 5px;
      line-height: 1.5;
      padding: 0.5em 0;
      list-style-type: none !important;
    }

      .alert-box-lucidity-blue ul li:before {
        font-family: Material Symbols Outlined;
        content: "\e5c8";
        position: absolute;
        left: 0.4em;
        font-size: 1.2rem;
        font-weight: bold;
        color: #2193b0 !important;
      }

#divFilterBar {
  position: relative;
}

#labelFilterBar {
  opacity: 0.9;
  text-align: center;
  font-size: .9rem;
  display: inline-block;
  width: 100px;
  color: #666;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  line-height: 18px;
  padding: 0 5px;
  position: absolute;
  /* Adjust these values to posiytion the title or label */
  top: -11px;
  left: 25px;
}

#TableRequestListHomePage_filter {
  display: none;
}

/*                                                                  All tbody td's */
#TableRequestListHomePage tbody tr td {
  vertical-align: top;
}

/*                                                                  nth 1 Edit & View Details */
#TableRequestListHomePage tbody tr td:nth-child(1) {
  width: 1%;
  padding-top: .50rem !important;
  white-space: nowrap;
}

  #TableRequestListHomePage tbody tr td:nth-child(1) div {
    line-height: .9rem;
    display: inline-flex;
    color: #2193b0;
    padding: 3px;
    border: 2px solid transparent;
  }

    #TableRequestListHomePage tbody tr td:nth-child(1) div:hover {
      cursor: pointer;
      color: #ffffff;
      background-color: #999;
      border: 2px solid #dddddd;
    }

    #TableRequestListHomePage tbody tr td:nth-child(1) div span i {
      font-size: 18px;
    }

/*                                                                  nth 2 Date Request Created */
#TableRequestListHomePage tbody tr td:nth-child(2) {
  width: 1%;
  white-space: nowrap;
  padding-top: .66rem;
}

  #TableRequestListHomePage tbody tr td:nth-child(2) a {
    color: #0071C1;
    text-decoration: none;
  }

    #TableRequestListHomePage tbody tr td:nth-child(2) a:hover {
      text-decoration: underline;
    }

/*                                                                  nth 3 LLC */
#TableRequestListHomePage tbody tr td:nth-child(3) {
  width: 20%;
  padding-top: .66rem;
  padding-right: .50rem;
}

/*                                                                  nth 4 Type */
#TableRequestListHomePage tbody tr td:nth-child(4) {
  width: 1%;
  white-space: nowrap;
  padding-top: .66rem;
  padding-right: .50rem;
}

/*                                                                  nth 5 Requestor */
#TableRequestListHomePage tbody tr td:nth-child(5) {
  width: 1%;
  white-space: nowrap;
  padding-top: .66rem;
  padding-right: .50rem;
}

/*                                                                  nth 6 Vendor */
#TableRequestListHomePage tbody tr td:nth-child(6) {
  width: 18%;
  padding-top: .66rem;
  padding-right: .50rem;
}

/*                                                                  nth 7 Opp ID */
#TableRequestListHomePage tbody tr td:nth-child(7) {
  width: 1%;
  white-space: nowrap;
  padding-top: .66rem;
  padding-right: .50rem;
}

/*                                                                  nth 8 Customer */
#TableRequestListHomePage tbody tr td:nth-child(8) {
  width: 24%;
  padding-top: .66rem;
  padding-right: .50rem;
}

/*                                                                  nth 9 Title */
#TableRequestListHomePage tbody tr td:nth-child(9) {
  width: 18%;
  padding-top: .66rem;
  padding-right: .50rem;
}

/*                                                                  nth 10 Stage */
#TableRequestListHomePage tbody tr td:nth-child(10) {
  width: 18%;
  padding-top: .66rem;
  padding-right: .50rem;
}

/*                                                                  nth 11 Updated */
#TableRequestListHomePage tbody tr td:nth-child(11) {
  width: 1%;
  white-space: nowrap;
  padding-top: .66rem;
  padding-right: .50rem;
}

  /*                                                                  nth 12 Archived */
  #TableRequestListHomePage tbody tr td:nth-child(12) {
    width: 1%;
    white-space: nowrap;
    padding-top: .66rem;
    padding-right: .50rem;
  }

  /*                                                                  nth 13 Canceled */
  #TableRequestListHomePage tbody tr td:nth-child(13) {
    width: 1%;
    white-space: nowrap;
    padding-top: .66rem;
    padding-right: .50rem;
  }

/*#TableRequestListHomePage tbody tr td:nth-child(10) div input[type=checkbox] {
  border: 1px solid #888;
  pointer-events: none;
  filter: none;
  opacity: .5;
  border-radius: .25em;
  width: 1em;
  height: 1em;
  margin-top: .25em;
  vertical-align: top;
  appearance: none;
}

#TableRequestListHomePage tbody tr td:nth-child(10) div input[type=checkbox]:checked {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
  border-color: #0d6efd;
  background-color: #0d6efd;
}*/


.CssTableVendorContacts {

}

  .CssTableVendorContacts thead tr th {
    font-family: 'Arial';
    font-weight: bold;
    font-size: .9rem;
    color: #555;
  }

  .CssTableVendorContacts tbody tr td table tbody tr td:nth-child(1) {
    width: 40%;
    padding-top: 8px;
    text-align: right;
    vertical-align: top;
    font-family: 'Arial';
    font-weight: normal;
    font-size: .9rem;
    color: #555;
  }

  .CssTableVendorContacts tbody tr td table tbody tr td:nth-child(2) {
    width: 60%;
    text-align: left;
    vertical-align: top;
  }

  .CssVendorLabels {
    font-family: 'Arial';
    font-weight: normal;
    font-size: .9rem;
    color: #555;
  }

.CssEditContactsTable {

}

  .CssEditContactsTable thead tr th {
    width: 25%;
    padding: 4px 7px 0px 4px;
    font-family: 'Arial';
    font-weight: bold;
    font-size: .9rem;
    color: #333;
  }

  .CssEditContactsTable tbody tr td {
    width: 25%;
    padding: 4px 7px 0px 4px;
    font-family: 'Arial';
    font-weight: normal;
    font-size: .9rem !important;
    color: #333;
  }

    .CssEditContactsTable tbody tr td:nth-child(5) {
      width: 1%;
      color: blue;
      text-align: center;
      vertical-align: top;
      cursor: pointer;
    }

    .CssEditContactsTable tbody tr td:nth-child(5) div span i {
      font-size: .9rem;
      color: #37a3ff;
      cursor: pointer;
    }

.top-row {
  z-index: 9999 !important;
}

.sidebar .top-row {
  z-index: 9999 !important;
  background-color: #002f58 !important;
}

.navbar {
  --bs-navbar-padding-x: 1.5rem;
  padding-top: 10px;
  /*background-color: #cfe2ff;*/ /*bootstrap blue*/
  /*background-color: #a0d2eb;*/ /*ice cold*/
  /*background-color: #e8f9fd;*/ /*dimly blue*/
  /*background-color: #f7f7f7;*/ /*blue gray edge*/
  /*background-color: #fff5d7;*/ /*nice tan-brown, Ragin Beige https://hookagency.com/blog/website-color-schemes-2020/ */
  /*background-color: #c2dde6;*/ /* seafoam aqua green */
  /*background-color: #CFE2FF;*/ /* blue bootstrap alert background */
  background-color: var(--main-bg-color);
  border-top: 0px solid #00a0a0;
  border-bottom: 0px solid #51d0de;
  /*justify-content: flex-end;*/
  height: 3.5rem;
  display: flex;
  align-items: center;
}

.navbar-brand {
  display: flex;
  align-items: center;
  font-size: 1.8rem;
  color: #084298;
  font-family: Arial, Helvetica, sans-serif;
}

  .navbar-brand img {
    margin-right: 0.7rem;
    width: 61px;
  }

.my-nav-link {
  /*color: yellow;*/
  /*border: 1px dashed green;*/
}

  .my-nav-link span.oi {
    padding-right: .4rem;
  }

  .my-nav-link.active {
    font-weight: bold;
  }

  .my-nav-link .material-icons {
    position: relative;
    top: 1px;
    display: inline-block;
    font-size: inherit;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
  }

.dropdown-menu {
  --bs-dropdown-link-active-bg: inherit
}

.CssLoadingOverlay {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.6);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  /*justify-content: center;*/
  align-items: center;
}

.CssLoadingOverlaySpinnerDiv {
  width: 4rem !important;
  height: 4rem !important;
  z-index: 20;
  background-color: var(--main-bg-color) !important;
  opacity: 1.0;
}

.CssLoadingOverlaySpinnerPositioningDiv {
  display: block;
  height: 250px;
  opacity: 1.0;
}

.CssLoadingOverlaySpinnerTextDiv {
  color: #aaa;
  font-style: italic;
  margin-top: 12px;
  padding: 3px 10px;
  background: #f9f9f9;
  border: 1px solid #f9f9f9;
  border-radius: 3px;
}