:root {
    --palette-main-1: #36474f;
    --palette-main-2: #5c6a70;
    --palette-main-3: #f6f6f7;
    --pallete-main-4: #f8f9fa;
    --palette-primary-1: #358ed7;
    --palette-primary-2: #257dc4;
    --palette-primary-3: #18649f;
    --palette-primary-4: #5da5df;
    --palette-primary-5: #86bbe7;
    --palette-primary-6: #b9d8f1;
    --palette-primary-7: #d7e8f7;
    --palette-positive-1: #7ed321;
    --palette-positive-2: #71c101;
    --palette-positive-3: #66b101;
    --palette-positive-4: #b2e47a;
    --palette-positive-5: #e5f6d3;
    --palette-negative-1: #f01526;
    --palette-negative-2: #d50115;
    --palette-negative-3: #9b0001;
    --palette-negative-4: #f9a1a8;
    --palette-negative-5: #fab8bd;
    --palette-negative-6: #fef3f4;
    --palette-noactive-1: #828d91;
    --palette-noactive-2: #c5c5c5;
    --palette-noactive-3: #9aa3a7;
    --palette-noactive-4: #afb5b9;
    --palette-noactive-5: #d7dadc;
    --palette-noactive-6: #eaeced;
    --palette-noactive-8: #fafafa;
    --palette-warning-1: #f8c51c;
    --palette-warning-2: #f4f7b2;
    --palette-white: #fff;
    --palette-black: #000;
  
    --campus: rgba(211, 84, 0, 0.9);
    --campus-transparent: rgba(211, 84, 0, 0.9);
    --campus-light-transparent: rgba(211, 84, 0, 0.15);
    --campus-nav-link-active: hsla(210, 11%, 15%, 1);
    --campus-nav-link: hsla(0, 0%, 100%, 0.6);
  }
  
  body {
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }
  
  html {
    height: -webkit-fill-available;
  }
  
  .grid-container {
    display: flex;
    flex-wrap: nowrap;
    height: 100vh;
    height: -webkit-fill-available;
    max-height: 100vh;
    overflow-x: auto;
    overflow-y: hidden;
  }
  
  .bi {
    vertical-align: -0.125em;
    pointer-events: none;
    fill: currentColor;
  }
  
  .dropdown-toggle {
    outline: 0;
  }
  
  .nav-flush .nav-link {
    border-radius: 0;
  }
  
  .btn-toggle {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.5rem;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.65);
    background-color: transparent;
    border: 0;
  }
  .btn-toggle:hover,
  .btn-toggle:focus {
    color: rgba(0, 0, 0, 0.85);
    color: rgba(255, 255, 255, 0.85);
    background-color: #d2f4ea;
    background-color: var(--campus-transparent);
  }
  
  .btn-toggle::before {
    width: 1.25em;
    line-height: 0;
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%28200,200,200,1%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
    transition: transform 0.35s ease;
    transform-origin: 0.5em 50%;
  }
  
  .btn-toggle[aria-expanded="true"] {
    /* color: rgba(0, 0, 0, 0.85); */
  }
  .btn-toggle[aria-expanded="true"]::before {
    transform: rotate(90deg);
  }
  
  .btn-toggle-nav a {
    display: inline-flex;
    padding: 0.1875rem 0.5rem;
    margin-top: 0.125rem;
    margin-left: 1.25rem;
    text-decoration: none;
  }
  .btn-toggle-nav a:hover,
  .btn-toggle-nav a:focus {
    color: rgba(255, 255, 255, 0.85);
    background-color: #d2f4ea;
    background-color: var(--campus-transparent);
  }
  
  .scrollarea {
    overflow-y: auto;
  }
  
  .fw-semibold {
    font-weight: 600;
  }
  .lh-tight {
    line-height: 1.25;
  }
  
  .bg-campus {
    background-color: var(--campus) !important;
  }
  .bg-light-transparent {
    background-color: hsl(0deg 0% 100% / 60%) !important;
  }
  .bg-white-transparent {
    background-color: rgba(255, 255, 255, 0.85) !important;
  }
  
  .sidebar .nav-link {
    color: var(--bs-light);
  }
  
  .sidebar .nav-link.bg-light-transparent {
    color: var(--campus);
  }
  
  .sidebar .nav-link:hover {
    color: var(--campus);
    background-color: rgba(255, 255, 255, 0.85) !important;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
  }
  
  .shadow-logo {
    filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5));
  }