/*global variables*/
 :root{
     --dbu-navy: #0A1831;
     --dbu-navy-dark: #000c20;
     --dbu-red:#a31d36;
     --dbu-red-rgb:163, 29, 54;
     --dbu-crimson:#791026;
     --dbu-crimson-rgb:121, 16, 38;
     --dbu-colonial-blue:#5c7492;
     --dbu-colonial-blue-rgb: 92, 116, 146;
     --dbu-colonial-blue-dark:#4b6382;
     --dbu-antique-tan: #E4D3B2;
     /*this is not technically dbu gray*/
     --dbu-gray: #E8E8E7;
     --dbu-font:museo-sans;
     --dbu-font-fallback:sans-serif;
     --dbu-font-color: #505656;
    /*bootstrap overrides*/
     --bs-border-radius: 0rem;
     --bs-border-radius-lg: 0rem;
     --bs-font-sans-serif: var(--dbu-font), var(--dbu-font-fallback);
     --bs-link-color: var(--dbu-red);
     --bs-link-hover-color: var(--dbu-crimson);
     --bs-link-color-rgb: var(--dbu-red-rgb);
     --bs-link-hover-color-rgb: var(--dbu-crimson-rgb);
     --bs-heading-color: var(--dbu-navy);
     --bs-body-font-size: 1.1rem;
     --bs-body-color: rgb(80, 86, 86);
     --bs-body-font-weight:300;
}
/*core bootstrap override
 .row{
    big change, I'm not sure if it is the best
     margin-right: 0rem;
     margin-left: 0rem;
}*/
/*bootstrap override*/
 a{
     text-decoration: underline dotted;
     text-decoration-thickness: 1px;
}
 a:hover{
     text-decoration: underline;
     text-decoration-thickness: 1px;
}

ul.list-triangle{
    list-style: none;
}

ul.list-triangle li{
    display:flex;
}

ul.list-triangle li::before{
    display:inline-block;
    content: "\F231";
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: 400 !important;
    font-variant: normal;
    font-size: .6rem;
    text-transform: none;
    align-self: start;
    line-height: 2.5;
    margin-right: 1ch;
    color: var(--dbu-navy);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    
}


/*start components*/
/*fixes buttons having text decoration becuase of a:hover = text-decoration: underline*/
 .btn:hover{
     text-decoration: none;
}
/*bootstrap override*/
 .btn-primary {
     --bs-btn-color: #fff;
     --bs-btn-bg: var(--dbu-red);
     --bs-btn-border-color: var(--dbu-red);
     --bs-btn-hover-color: #fff;
     --bs-btn-hover-bg: var(--dbu-crimson);
     --bs-btn-hover-border-color: var(--dbu-crimson);
     --bs-btn-focus-shadow-rgb: var(--dbu-red-rgb);
     --bs-btn-active-color: #fff;
     --bs-btn-active-bg: var(--dbu-crimson);
     --bs-btn-active-border-color: var(--dbu-crimson);
     --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
     --bs-btn-disabled-color: #fff;
     --bs-btn-disabled-bg: #0d6efd;
     --bs-btn-disabled-border-color: #0d6efd;
}
/*bootstrap override*/
 .btn-outline-primary {
     --bs-btn-color: var(--dbu-red);
     --bs-btn-border-color: var(--dbu-red);
     --bs-btn-hover-color: #fff;
     --bs-btn-hover-bg: var(--dbu-red);
     --bs-btn-hover-border-color: var(--dbu-red);
     --bs-btn-focus-shadow-rgb: 13, 110, 253;
     --bs-btn-active-color: #fff;
     --bs-btn-active-bg: var(--dbu-crimson);
     --bs-btn-active-border-color: var(--dbu-crimson);
     --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
     --bs-btn-disabled-color: #0d6efd;
     --bs-btn-disabled-bg: transparent;
     --bs-btn-disabled-border-color: #0d6efd;
     --bs-gradient: none;
}
/*bootstrap override*/
 .btn-secondary {
     --bs-btn-color: #fff;
     --bs-btn-bg: var(--dbu-navy);
     --bs-btn-border-color: var(--dbu-navy);
     --bs-btn-hover-color: #fff;
     --bs-btn-hover-bg: var(--dbu-navy-dark);
     --bs-btn-hover-border-color: var(--dbu-navy-dark);
     --bs-btn-focus-shadow-rgb: var(--dbu-navy-rgb);
     --bs-btn-active-color: #fff;
     --bs-btn-active-bg: var(--dbu-navy-dark);
     --bs-btn-active-border-color: var(--dbu-navy-dark);
     --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
     --bs-btn-disabled-color: #fff;
     --bs-btn-disabled-bg: #6c757d;
     --bs-btn-disabled-border-color: #6c757d;
}
/*bootstrap override*/
 .btn-outline-secondary {
     --bs-btn-color: var(--dbu-navy);
     --bs-btn-border-color: var(--dbu-navy);
     --bs-btn-hover-color: #fff;
     --bs-btn-hover-bg: var(--dbu-navy);
     --bs-btn-hover-border-color: var(--dbu-navy);
     --bs-btn-focus-shadow-rgb: var(--dbu-navy-rgb);
     --bs-btn-active-color: #fff;
     --bs-btn-active-bg: var(--dbu-navy-dark);
     --bs-btn-active-border-color: var(--dbu-navy-dark);
     --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
     --bs-btn-disabled-color: #6c757d;
     --bs-btn-disabled-bg: transparent;
     --bs-btn-disabled-border-color: #6c757d;
     --bs-gradient: none;
}
/*bootstrap extension*/
 .btn-tertiary{
     --bs-btn-color: #fff;
     --bs-btn-bg: var(--dbu-colonial-blue);
     --bs-btn-border-color: var(--dbu-colonial-blue);
     --bs-btn-hover-color: #fff;
     --bs-btn-hover-bg: var(--dbu-colonial-blue-dark);
     --bs-btn-hover-border-color: var(--dbu-colonial-blue-dark);
     --bs-btn-focus-shadow-rgb: var(--dbu-colonial-blue);
     --bs-btn-active-color: #fff;
     --bs-btn-active-bg: var(--dbu-colonial-blue-dark);
     --bs-btn-active-border-color: var(--dbu-colonial-blue-dark);
     --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
     --bs-btn-disabled-color: #fff;
     --bs-btn-disabled-bg: #6c757d;
     --bs-btn-disabled-border-color: #6c757d;
}
/*bootstrap extension*/
 .btn-outline-tertiary {
     --bs-btn-color: var(--dbu-colonial-blue);
     --bs-btn-border-color: var(--dbu-colonial-blue);
     --bs-btn-hover-color: #fff;
     --bs-btn-hover-bg: var(--dbu-colonial-blue);
     --bs-btn-hover-border-color: var(--dbu-colonial-blue-rgb);
     --bs-btn-focus-shadow-rgb: 108, 117, 125;
     --bs-btn-active-color: #fff;
     --bs-btn-active-bg: var(--dbu-colonial-blue-dark);
     --bs-btn-active-border-color: var(--dbu-colonial-blue-dark);
     --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
     --bs-btn-disabled-color: #6c757d;
     --bs-btn-disabled-bg: transparent;
     --bs-btn-disabled-border-color: #6c757d;
     --bs-gradient: none;
}
/*bootstrap override*/
 .carousel-control-next, .carousel-control-prev{
     opacity:1;
}
    .carousel-control-background{
        background-color: rgba(0,0,0,0.5);
         width: 3rem;
         height: 3rem;
         border-radius: 50%;
         display:flex;
         justify-content: center;
         align-items: center;
    }
    button:focus .carousel-control-background{
        border:1px solid white;
    }
.accordion-button:focus{
  z-index: 2;
}
.accordion-button:hover{
    z-index:1;
} 
 .accordion-button-navy:focus{
     --bs-accordion-btn-focus-box-shadow:0 0 0 0.25rem rgba(0, 23, 39, 1.0);
}
 .accordion-button-navy:not(.collapsed){
     --bs-accordion-active-bg: #0A1831;
     --bs-accordion-active-color: #FFF;
}
 .accordion-button-navy:not(.collapsed)::after{
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/*bootstrap override*/
.form-select:focus {
  border-color: var(--bs-border-color);
  outline: 0;
  box-shadow: 0 0 0 .25rem var(--dbu-navy);
} 
 .dbu-dropdown{
     display:flex;
     align-items:center;
}
 .dbu-dropdown::after{
     flex-shrink: 0;
     width: 1.25rem;
     height: 1.25rem;
     margin-left: .25em;
     content: "";
     background-image: var(--dbu-dropdown-icon);
     background-repeat: no-repeat;
     background-size: 1.25rem;
     transition: transform 0.2s ease-in-out;
}
 .dbu-dropdown:not(.collapsed)::after{
     --bs-accordion-btn-icon-transform: rotate(-180deg);
     transform: var(--bs-accordion-btn-icon-transform);
}
 .dbu-dropdown-small::after{
     width:.75rem;
     height:.75rem;
     background-size:.75rem;
}
 .direction-rtl.accordion-button:after{
     margin-left:0em;
     margin-right:auto;
}
 .navbar-white{
     background-color: #fff;
     --bs-navbar-color: var(--dbu-navy);
     --bs-nav-link-color: var(--bs-navbar-color);
     --bs-nav-link-hover-color: var(--bs-nav-link-color);
     --dbu-dropdown-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230A1831'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
 .navbar-navy{
     background-color: var(--dbu-navy);
     --bs-navbar-color: #fff;
     --bs-nav-link-color: #fff;
     --bs-nav-link-hover-color: var(--bs-nav-link-color);
     --dbu-dropdown-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
@media(max-width: 991.98px){
    #mainNav .nav-item:not(.nav-item:last-child) .nav-link{
     border-bottom: 1px solid var(--bs-border-color);
    }
}
 @media (min-width: 992px) {
     .nav-item{
         border-bottom: 3px solid transparent;
     }
    /*Give nav items 3px border when clicked or focused, but only lg screens*/
     .nav-item:has(.nav-link:hover), .nav-item:has(.nav-link:focus), .nav-item:has(.nav-link.active){
         border-bottom: 3px solid var(--bs-navbar-color);
    }
}
 
 .nav-link-small{
     --bs-nav-link-font-size:.775em;
     --bs-nav-link-font-weight:300;
}
 .nav-collapse-border{
     border-top:1px solid var(--dbu-navy);
     border-bottom:1px solid var(--dbu-navy);
}
 .btn-fs-small{
     --bs-btn-font-size:.775em;
}

/*bootstrap override*/
.list-group{
    --bs-list-group-active-color: #fff;
  --bs-list-group-active-bg: var(--dbu-navy);
  --bs-list-group-active-border-color: var(--dbu-navy);
}

.banner-background-img{
    background-image: var(--banner-background-img);
    background-size:cover;
    background-repeat: no-repeat;
    background-position: center center;
}
/*Random Effects*/
.link-social-icon{
    --social-icon-background-color: var(--dbu-navy);
    background-color: var(--social-icon-background-color);
}
.link-social-icon:hover:has(.bi-facebook){
    --social-icon-background-color:#3b5998;
}
.link-social-icon:hover:has(.bi-twitter-x){
    --social-icon-background-color:#00acee;
}
.link-social-icon:hover:has(.bi-instagram){
    --social-icon-background-color:#3f729b;
}
.link-social-icon:hover:has(.bi-youtube){
    --social-icon-background-color:#c4302b;
}
.link-social-icon:hover:has(.bi-linkedin){
    --social-icon-background-color:#0e76a8;
}
/* Sidebar */
.accordion.accordion-flush.accordion-sidebar,
.accordion.accordion-flush:last-child.accordion-sidebar {border-bottom:solid 5px #0a1831;}
.accordion.accordion-flush .sidebar-item .accordion.accordion-flush {border-bottom:none;}

.sidebar-item-padding-1 {
    padding-left:.5rem;
}
.sidebar-item-padding-2{
    padding-left:1.5rem;
}
.sidebar-item-padding-3{
    padding-left:2.5rem;
}
.sidebar-item-padding-4{
    padding-left:3.5rem;
}
.sidebar-item-padding-5{
    padding-left:4.5rem;
}
.sidebar-item-padding-6{
    padding-left:5.5rem;
}
.sidebar-item-padding-7{
    padding-left:6.5rem;
}
.sidebar-item-padding-8{
    padding-left:7.5rem;
}
.sidebar-item-padding-9{
    padding-left:4.5rem;
}

.sidebar-item-active{
    border-left: solid 3px #535d6e;
    background: #eef1f4;
}
.accordion-button:not(.collapsed).sidebar-accordion-button {
  color: var(--dbu-navy);
  background-color: unset;
  box-shadow: none;
}
.nav-link:focus-visible, .accordion-button.sidebar-accordion-button:focus{
     box-shadow: 0 0 0 .25rem var(--bs-navbar-color);
}

.sidebar-item-active a {font-weight:600;}

.negative-margin-left-3px{
    margin-left:-3px;
}

div.accordion > div.sidebar-item:first-child {border-top:1px solid #eee;}

div.accordion > div.sidebar-item, .sidebar-item > .accordion-header:has(.accordion-button:not(.collapsed)){
    border-bottom: 1px solid #eee;
}
div.accordion > div.sidebar-item p.accordion-header.active a {font-weight:600;}
div.accordion-body > div.accordion > div.sidebar-item:last-child{border-bottom:none;}

.fs-1rem{
    font-size: 1rem;
}
.fs-1-1rem{
    font-size: 1.1rem;
}


.sidebar-item > a:hover > i, .sidebar-item > p > a:hover > i{
    opacity:1;
}
.sidebar-item > a > i, .sidebar-item > p > a > i{
    opacity:0;
    font-size:1rem;
}


.sidebar-item > p > i, .sidebar-item > p > a:hover ~ .accordion-button{
    display:none;
    font-size: 1rem;
}
.sidebar-item > p > a:hover + i{
    display:flex;
    align-items: center;
}
/*end components*/
/*start utilities and random stuff*/
 .title-cbhh-banner{
     font-weight: 700 !important;
     font-size: 1.375rem !important;
}
small{
    font-size:.875rem;
}

.fs-1-5rem{
    font-size: 1.5rem!important;
}

.fs-1-75rem{
    font-size: 1.75rem!important;
}

.fs-2-25rem{
    font-size:2.25rem!important;
}

.fs-3rem{
    font-size:3rem!important;
}

.fs-4rem{
    font-size:4rem!important;
}

 .subtitle-cbhh-banner{
     font-weight: 700 !important;
     font-size: 0.7 rem !important;
}
 .bg-dbu-navy{
     background-color: var(--dbu-navy)!important;
}
 .bg-dbu-red{
     background-color:var(--dbu-red)!important;
}
 .bg-dbu-colonial-blue{
     background-color:var(--dbu-colonial-blue)!important;
}
.bg-dbu-gray{
    background-color:var(--dbu-gray);
}
 .bg-dbu-antique-tan{
     background-color:var(--dbu-antique-tan)!important;
}
 .border-navy{
     --bs-border-color: var(--dbu-navy);
}
 .minw-100{
     min-width:100%;
}
.text-navy{
    color: var(--dbu-navy);
}
.text-opacity-100{
    opacity: 1!important;
}
 .text-shadow-black{
     text-shadow: 1px 1px 2px black;
}
 .bi-fw-800:before{
     font-weight: 800!important;
}
 .bottom-10{
     bottom:10%;
}
 .bottom-25{
     bottom:25%;
}
 .maxw-900px{
     max-width:900px!important;
}
 .maxw-1000px{
     max-width:1000px!important;
}
 .hover-mt-n2:hover, .hover-my-n2:hover{
     margin-top:-.5rem;
}
 .hover-mb-n2:hover, .hover-my-n2:hover{
     margin-bottom:-.5rem;
}
 .hover-me-n2:hover, .hover-mx-n2:hover{
     margin-right:-.5rem;
}
 .hover-ms-n2:hover, .hover-mx-n2:hover{
     margin-left:-.5rem;
}
 .hover-grow{
     transition: all .2s ease-in-out;
}
 .hover-grow:hover{
     transform: scale(1.025);
}
.white-space-wrap{
    white-space: wrap!important;
}
.z-4{
    z-index: 4!important;
}
.align-self-start{
    align-self:start!important;
}
 @media (min-width: 576px) {
     .bottom-sm-10{
         bottom:10%;
    }
     .bottom-sm-25{
         bottom:25%;
    }
    .subtitle-cbhh-banner {
        font-size: 0.953rem !important; 
    }
}
 @media (min-width: 768px) {
     .bottom-md-10{
         bottom: 10%;
    }
     .bottom-md-25{
         bottom: 25%;
    }
    .title-cbhh-banner {
     font-size: 2.5rem !important;
    }
   .subtitle-cbhh-banner {
        font-size: 1.2rem !important; 
    }
    
}
 @media (min-width: 992px) {
     .bottom-lg-10{
         bottom:10%;
    }
     .bottom-lg-25{
         bottom:25%;
    }
     .position-lg-absolute{
         position:absolute!important;
    }
     .bg-lg-dbu-navy{
         background-color: var(--dbu-navy)!important;
    }
    .fw-lg-bold{
        font-weight:700!important;
    }
    .fw-lg-medium{
        font-weight:500!important;
    }
     .navbar-lg-navy{
         background-color: var(--dbu-navy);
         --bs-navbar-color: #fff;
         --bs-nav-link-color: #fff;
         --bs-nav-link-hover-color: var(--bs-nav-link-color);
         --dbu-dropdown-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    }
    .title-cbhh-banner{
     font-size: 3rem !important;
    }
    .subtitle-cbhh-banner{
     font-size: 1.438rem !important;
    }
    
    /*[id] {
      scroll-margin-top: 115px;
    }*/
    .sticky-lg-sidenav{
        position: sticky;
        top: 1.5em;
        align-self: start;
    }
    .text-lg-uppercase{
        text-transform: uppercase!important;
    }

}

 @media (min-width: 1200px) {
     .bottom-xl-10{
         bottom:10%;
    }
     .bottom-xl-25{
         bottom:25%;
    }
}
 @media (min-width: 1400px) {
     .bottom-xxl-10{
         bottom:10%;
    }
     .bottom-xxl-25{
         bottom:25%;
    }
}


 .animation {
  animation-timeline: view();

  animation-name: appear;
  animation-fill-mode: both;
  animation-duration: 1ms; /* Firefox requires this to apply the animation */
}

.img-zoom{
    animation-name:imgZoom;
    animation-duration: 25s;
    animation-fill-mode: forwards;
    overflow: hidden;
}

@keyframes appear {
  0% {
    opacity:0;
    transform: translateY(3.5rem);
  }

  15% {
    
    transform: translateY(0rem));
  }
  
  20%{
      opacity:1;
  }
}

@keyframes imgZoom{
    from{
        transform: scale(1);
    }
    
    to{
       transform: scale(1.25); 
    }
}


/*end utilities*/