/* One shared logo-and-name component for public, admin, and staff navbars. */
.sinn-navbar-left{
  display:flex !important;
  align-items:center !important;
  min-width:0 !important;
  max-width:calc(100% - 104px) !important;
  flex:0 1 auto !important;
}

.sinn-index-navbar-brand{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  width:auto !important;
  max-width:215px !important;
  min-width:0 !important;
  flex:0 1 215px !important;
  margin:0 !important;
  overflow:hidden !important;
  color:#123C69 !important;
  font-weight:900 !important;
  letter-spacing:-.5px !important;
  line-height:1 !important;
  text-decoration:none !important;
}

.sinn-index-navbar-brand .header-brand-logo{
  display:block !important;
  width:58px !important;
  height:42px !important;
  min-width:58px !important;
  max-width:58px !important;
  max-height:42px !important;
  flex:0 0 58px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:14px !important;
  object-fit:contain !important;
  background:transparent !important;
  box-shadow:none !important;
}

.sinn-index-navbar-brand .header-brand-text{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  flex:1 1 auto !important;
  width:auto !important;
  min-width:0 !important;
  max-width:145px !important;
  margin:0 !important;
  overflow:hidden !important;
  line-height:1.05 !important;
}

.sinn-index-navbar-brand .header-brand-title{
  display:block !important;
  max-width:100% !important;
  margin:0 !important;
  overflow:hidden !important;
  color:#123C69 !important;
  font-size:17px !important;
  font-weight:900 !important;
  letter-spacing:-.5px !important;
  line-height:1.05 !important;
  white-space:nowrap !important;
  text-overflow:clip !important;
}

.sinn-index-navbar-brand .header-brand-subtitle{
  display:block !important;
  max-width:100% !important;
  margin:0 !important;
  overflow:hidden !important;
  color:rgba(18, 60, 105, .68) !important;
  font-size:10px !important;
  font-weight:800 !important;
  letter-spacing:.55px !important;
  line-height:1.2 !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
  text-overflow:clip !important;
}

.sinn-navbar-left > .toggle-sidebar-btn{
  flex:0 0 42px !important;
  width:42px !important;
  height:42px !important;
  margin-left:8px !important;
}

@media (max-width:991.98px){
  .sinn-index-navbar-brand{
    max-width:214px !important;
    flex-basis:214px !important;
  }

  .sinn-index-navbar-brand .header-brand-logo{
    width:54px !important;
    height:39px !important;
    min-width:54px !important;
    max-width:54px !important;
    max-height:39px !important;
    flex-basis:54px !important;
    border-radius:13px !important;
  }

  .sinn-index-navbar-brand .header-brand-text{
    max-width:150px !important;
  }

  .sinn-index-navbar-brand .header-brand-title{
    font-size:15px !important;
  }

  .sinn-index-navbar-brand .header-brand-subtitle{
    font-size:9px !important;
    letter-spacing:.45px !important;
  }
}

@media (max-width:767.98px){
  .sinn-navbar-left{
    max-width:calc(100% - 84px) !important;
  }

  .sinn-index-navbar-brand{
    gap:8px !important;
    max-width:182px !important;
    flex-basis:182px !important;
  }

  .sinn-index-navbar-brand .header-brand-logo{
    width:50px !important;
    height:38px !important;
    min-width:50px !important;
    max-width:50px !important;
    max-height:38px !important;
    flex-basis:50px !important;
    border-radius:12px !important;
  }

  .sinn-index-navbar-brand .header-brand-text{
    max-width:124px !important;
  }

  .sinn-index-navbar-brand .header-brand-title{
    font-size:15px !important;
  }

  .sinn-index-navbar-brand .header-brand-subtitle{
    font-size:8.5px !important;
    letter-spacing:.35px !important;
  }

  .sinn-navbar-left > .toggle-sidebar-btn{
    flex-basis:38px !important;
    width:38px !important;
    height:38px !important;
    margin-left:4px !important;
  }
}

@media (max-width:575.98px){
  .sinn-navbar-left{
    max-width:calc(100% - 78px) !important;
  }

  .sinn-index-navbar-brand{
    gap:8px !important;
    max-width:168px !important;
    flex-basis:168px !important;
  }

  .sinn-index-navbar-brand .header-brand-logo{
    width:48px !important;
    height:36px !important;
    min-width:48px !important;
    max-width:48px !important;
    max-height:36px !important;
    flex-basis:48px !important;
    border-radius:12px !important;
  }

  .sinn-index-navbar-brand .header-brand-text{
    max-width:112px !important;
  }

  .sinn-index-navbar-brand .header-brand-title{
    font-size:14px !important;
    letter-spacing:-.4px !important;
  }

  .sinn-index-navbar-brand .header-brand-subtitle{
    font-size:8px !important;
    letter-spacing:.3px !important;
  }

  .sinn-navbar-left > .toggle-sidebar-btn{
    flex-basis:34px !important;
    width:34px !important;
    height:34px !important;
    margin-left:3px !important;
  }
}

@media (max-width:359.98px){
  .sinn-navbar-left{
    max-width:calc(100% - 72px) !important;
  }

  .sinn-index-navbar-brand{
    gap:6px !important;
    max-width:124px !important;
    flex-basis:124px !important;
  }

  .sinn-index-navbar-brand .header-brand-logo{
    width:40px !important;
    height:32px !important;
    min-width:40px !important;
    max-width:40px !important;
    max-height:32px !important;
    flex-basis:40px !important;
  }

  .sinn-index-navbar-brand .header-brand-text{
    max-width:78px !important;
  }

  .sinn-index-navbar-brand .header-brand-title{
    font-size:11.5px !important;
  }

  .sinn-index-navbar-brand .header-brand-subtitle{
    font-size:5.8px !important;
    letter-spacing:0 !important;
  }

  .sinn-navbar-left > .toggle-sidebar-btn{
    flex-basis:32px !important;
    width:32px !important;
    height:32px !important;
  }
}