    /* Google Font Link */
    @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');
    
    #main-contents {
       overflow: scroll !important;
    }
    
    *{
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: "Nunito" , serif;
      /*font-family: 'IBM Plex Mono', monospace;*/
    }
    
    .logo-details{
      padding-left:10px;
      height: 60px;
      display: flex;
      align-items: center;
      position: relative;
    }
    
    .logo-details .logo_name{
      color: #fff;
      font-weight: 600;
      padding-top:8px;
    }
    
    .nsection .text{
      display: inline-block;
      color: #11101d;
      font-size: 25px;
      font-weight: 500;
      margin: 18px
    }
    
    
    /* Add a black background color to the top navigation */
    .topnav {
      background-image: linear-gradient(to bottom, #F5F4F9 0%, #ECEAF3 100%);
      height: 50px;
      border-bottom: solid 1px #cccc;
      vertical-align: middle;
      overflow: hidden;
    }
    
    .topnav-button {
        width: 40px;
        height: 40px;
        padding: 0px;
    }
    
    
    .text-client {
      color: #665611 !important;
    }
    
    .text-bg-client {
      color: #fff !important;
      background-color: #665611ab !important;
    }
    
    .text-request {
      color: #176977 !important;
    }
    
    .text-bg-request {
      color: #fff !important;
      background-color: #176977ab !important;
    }
    
    .text-bg-quote {
      color: #fff !important;
      background-color: #143181ab !important;
    }
    
    .text-quote {
      color: #143181 !important;
    }
    
    .text-bg-job {
      color: #fff !important;
      background-color: #106b1cab !important;
    }
    
    .text-job {
      color: #106b1c !important;
    }
    
    .text-bg-invoice {
      color: #fff !important;
      background-color: #661111ab !important;
    }
    
    .text-invoice {
      color: #661111 !important;
    }
    
    .btn-footer {
      padding: 0px 6px; 
      border-color: gray !important; 
      box-shadow: 2px 2px lightgray;
    }
    
    .btn-clients {
      padding: 0px 6px; 
      border-color: #988e5f !important; 
      box-shadow: 2px 2px #6f6846;
    }
    
    
    .mobile-nav {
      background: #F1F1F1;
      position: fixed;
      bottom: 0;
      height: auto;
      width: 100%;
      display: flex;
      justify-content: space-around;
    }
    
    .bloc-icon {
      display: flex;
      justify-content: center;
      align-items: center;
    }
    
    .bloc-icon img {
      width: 30px;
    }
    
    .mobile-nav .rec {
      padding:5px;
    
    }
    
    
    .db-card-left {
      padding-right: 0.25rem !important;
      flex: 0 0 auto;
      width: 50%;
    }
    
    .db-card-right {
      padding-left: 0.25rem !important;
      flex: 0 0 auto;
      width: 50%;
    }
    
    .db-card {
      margin-bottom: 1rem !important;
      height: 325px;
    }
    
    .db-card-header {
      padding: 0.25rem !important;
      height:42px; 
      padding-top:4px; 
      font-size: x-large;
    
    }
    
    .db-card-header span {
      margin-top: 1px;
      font-weight: 700 !important;
      font-size: 1.25rem;
    }
    
    .db-card div.card-body {
      height: 200px;
      font-size:1rem !important;
    }
    
    .card-body hr {
      margin: 0px;
    }
    
    .requestdiv {
      background-color: #5a93a117 !important;
    }
    
    .requestdiv:hover{
      background-color: #5a93a167 !important;
    }
    
    
    .quotediv {
      background-color: #586ea817 !important;
    }
    
    .quotediv:hover{
      background-color: #586ea867 !important;
    }
    
    .jobdiv {
      background-color: #ffffff !important;
    }
    
    .jobdiv.active{
      color: black !important;
      background-color: #106b1c67 !important;
      border-color: #106b1c !important;
    }
    
    .form-control {
      box-shadow:none !important;
    }
    
    .form-select {
      box-shadow:none !important;
    }
    
    #clientportal-contents{
      overflow: scroll !important;
    }
    
    .btn-outline-quotes {
      --bs-btn-color: #596da3;
      --bs-btn-border-color: #143181;
      --bs-btn-hover-color: #fff;
      --bs-btn-hover-bg: #596da3;
      --bs-btn-hover-border-color: #143181;
      --bs-btn-focus-shadow-rgb: 13, 110, 253;
      --bs-btn-active-color: #fff;
      --bs-btn-active-bg: #596da3;
      --bs-btn-active-border-color: #143181;
      --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
      --bs-btn-disabled-color: #596da3;
      --bs-btn-disabled-bg: transparent;
      --bs-btn-disabled-border-color: #143181;
      --bs-gradient: none;
    }

    .btn-outline-invoices {
      --bs-btn-color: #661111;
      --bs-btn-border-color: #661111;
      --bs-btn-hover-color: #fff;
      --bs-btn-hover-bg: #661111cf;
      --bs-btn-hover-border-color: #661111;
      --bs-btn-focus-shadow-rgb: 13, 110, 253;
      --bs-btn-active-color: #fff;
      --bs-btn-active-bg: #661111cf;
      --bs-btn-active-border-color: #661111;
      --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
      --bs-btn-disabled-color: #661111cf;
      --bs-btn-disabled-bg: transparent;
      --bs-btn-disabled-border-color: #661111;
      --bs-gradient: none;
    }
    
    .truncate {
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 2; /* Number of lines to show */
      -webkit-box-orient: vertical;
  }


  :root {
    --bg-global: #092762;
    --text-global: #ffffff;
  }
  
.text-global
{
  color: var(--bg-global) !important;
}

.bg-global
{
  background-color: var(--bg-global) !important;
  color:white !important;
}
.bg-globalsec {
  background-color: #6b7da1 !important;
  color:white !important;
}

.bg-globalsuccess {
  background-color: #198754 !important;
  color:white !important;
}

.btn-global{
  border: solid 1px white;
  color: white;
}

.btn-outline-global {
  --bs-btn-color: var(--bg-global);
  --bs-btn-border-color: var(--bg-global);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bg-global);
  --bs-btn-hover-border-color: var(--bg-global);
  --bs-btn-focus-shadow-rgb: 13, 110, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bg-global);
  --bs-btn-active-border-color: var(--bg-global);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--bg-global);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--bg-global);
  --bs-gradient: none;
}

.list-group-item
{
    background-color:white;
    border-radius:12px !important;
}