/*Common styles - header, menu, reused throughout*/

/*Responsive headings*/
@media (min-width: 768px) {
    .ff-h1 {
        font-family: 'Fraunces Variable',serif;
        font-size: 64px;
        font-weight: 400;
        color: rgb(255,255,255);
        text-align: center;
    }
    
    .ff-h2 {
        font-family: 'Fraunces Variable',serif;
        font-size: 48px;
        font-weight: 400;
        color: rgb(255,255,255);
        text-align: center;
    }
}

@media (max-width: 767px) {
    .ff-h1 {
        font-family: 'Fraunces Variable',serif;
        font-size: 48px;
        font-weight: 400;
        color: rgb(255,255,255);
        text-align: center;
    }
    
    .ff-h2 {
        font-family: 'Fraunces Variable',serif;
        font-size: 32px;
        font-weight: 400;
        color: rgb(255,255,255);
        text-align: center;
    }
}

.ff-h3 {
    font-family: 'Fraunces Variable',serif;
    font-size: 30px;
    font-weight: 500;
    color: rgb(0,15,70);
    text-align: center;
}

.ff-p {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: rgb(45,45,45);
    margin: 20px;
}

.ff-p-footer {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: white;
    margin: 20px;
}

.ff-p-home1 {
    font-size: 20px;
    text-align: center;
}

.ff-h3-footer {
    font-size: 24px;
}

.ff-ul {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: rgb(45,45,45);
    margin: 20px;
}

.ff-ul-item {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: rgb(45,45,45);
    margin: 20px;
}

.ff-fill-container {
    margin: 0;
    border: 0;
    padding: 0;
}

.banner {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    background-color: rgb(0,60,85);
    color: rgb(255,255,255);
    font-size: 18px;
    height: 50px;
    text-align: left;
    display: flex;
    align-items: center;
}

.header-umelb {
    background-color: rgb(0, 15, 70);
    margin: 0;
    border: 0;
}

.footer-umelb {
    background-color: rgb(0, 15, 70);
    margin: 0;
    border: 0;
    padding-top: 20px;
    padding-bottom: 20px;
}

.footer-aoc {
    background-color: rgb(64, 75, 116);
    margin: 0;
    border: 0;
    padding-top: 20px;
    padding-bottom: 20px;
}

.menu-button {
    background-color: rgb(0,15,70);
    border: 0;
    font-size: 30px;
}

.menu-button:hover {
    background-color: rgb(0,15,70);
    color: rgb(70 200 240);
}

.footer-link {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: white;
    /*margin: 20px;*/
    text-decoration: underline;
}

.footer-link:hover {
    color: white;
    text-decoration: none;
}

/* Style tooltips (global)*/

.tooltip-inner {
    background-color: rgb(45,45,45);
    margin: 10px
}

.bs-tooltip-end .tooltip-arrow {
    --bs-tooltip-bg: rgb(45,45,45);
    border-left-color: rgb(45,45,45);
    margin-left: 10px
}

.bs-tooltip-start .tooltip-arrow {
    --bs-tooltip-bg: rgb(45,45,45);
    border-right-color: rgb(45,45,45);
    margin-right: 10px
}

.tabbed {
    background-color: rgb(0,15,70);
    height: 50px;
    margin-left: 20px;
    border: 0;
    display: flex;
    align-items: center;
}

.tabbed-nav {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    color: rgb(255,255,255);
    font-size: 16px;
    font-weight: 600;
    padding: 13px;
    text-decoration: none;
    transition: all 0.1s;
}

.tabbed-nav.active {
    background-color: rgb(70,200,240);
    color: rgb(0,15,70);
    text-decoration: underline;
}

.tabbed-nav:hover {
    background-color: rgb(209,241,251);
    color: rgb(0,15,70);
    text-decoration: underline;
}

.header-nav.active {
    /*background-color: rgb(70,200,240);*/
    /*color: rgb(0,15,70);*/
    text-decoration: underline;
}

.header-nav:hover {
    /*background-color: rgb(209,241,251);*/
    /*color: rgb(0,15,70);*/
    text-decoration: underline;
}

#offcanvas {
    background-color: rgb(0,15,70);
}

.offcanvas-nav {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    color: rgb(255,255,255);
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.1s;
}

.offcanvas-nav:hover {
    color: rgb(70,200,240);
    text-decoration: underline;
}

.offcanvas-header .btn-close {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(16deg) brightness(100%) contrast(104%);
    opacity: 1.0;
}

.offcanvas-header .btn-close:hover {
    filter: invert(83%) sepia(47%) saturate(3100%) hue-rotate(162deg) brightness(92%) contrast(104%);
}

.offcanvas-info {
    color: rgb(200,200,200);
}

.sub-button {
    background-color: rgb(70,200,240);
    border: 2;
    border-color: white;
    border-radius: 0px;
    color: rgb(0,15,70);
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    font-size: 18px;
    font-weight: 400;
    transition: all 0.2s;
    display: inline-block;
    align-items: flex-start;
}

.sub-button:hover {
    background-color: rgb(209 241 251);
    color: rgb(0,15,70);
    border-color: white;
}

.nav-button {
    align-items: center;
    background-color: rgb(187, 205, 184);
    border-color: rgb(187, 205, 184);
    border-radius: 0px;
    color: rgb(0,15,70);
    display: inline-flex;
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    font-size: 18px;
    font-weight: 600;
    height: 50px;
    text-align: center;
    transition: all 0.2s;
    width: 150px;
    margin-left: 20px;
}

.nav-button:hover {
    background-color: rgb(213 224 211);
    border-color: rgb(213 224 211);
    color: rgb(0,15,70);
}

.nav-button:focus-visible {
    background-color: rgb(187, 205, 184);
    border-color: rgb(187, 205, 184);
    color: rgb(0,15,70);
    box-shadow: 0 0 0 0.25rem rgba(187, 205, 184, .5);
}

.nav-button-wide {
    width: 160px;
}

.nav-button-xwide {
    width: 220px;
}

/*Homepage cards - hover functionality*/
.custom-card {
    text-decoration: none;
    transition: all 0.1s;
    width: 100%;
    max-width: 100%;
    margin: auto;
}

.card-title {
    text-decoration: none;
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: rgb(0,15,70);
    margin: 20px;
}

.custom-card:hover .card-title {
    text-decoration: underline;
}

.image-container {
    display: inline-block;
    border-radius: 50%;
    padding: 10px;
    transition: all 0.1s;
    background-color: rgb(234,239,233);
}

.custom-card:hover .image-container {
    background-color: rgb(213,224,211);
    transform: scale(1.1);
}

.card-link {
    text-decoration: none;
}

.card-link-home {
    text-decoration: none;
    overflow: hidden;
    position: relative;
}

.card-img {
    object-fit: cover;
    height: 16rem;
}

.home-img-s4 {
    align-items: center;
    margin: 0;
    border: 0;
    height: 400px;
    width: 100%;
    height: auto;
    max-width: 100%;
}

/*Filter styles - set appropriate font*/

.filter-label, .other-thing {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif;
    font-size: 18px;
}

.tight-filter {
    margin-bottom: 0;
    margin-left: 0;
}

.acc-bg {
    background-color: rgb(241, 241, 241);
}

.accordion-button:not(.collapsed) {
    background-color: rgb(171, 193, 167);
}

.accordion-button:focus {
    box-shadow: 0 0 0 0.25rem rgba(171, 193, 167, 0.25);
}

/*Summary stat styles*/

.summary-data {
    font-family: 'Fraunces Variable',serif;
    font-size: 64px;
    font-weight: 300;
    color: rgb(0,15,70);
    text-align: center;
}

.summary-caption {
    font-family: 'Fraunces Variable',serif;
    font-size: 24px;
    font-weight: 500;
    color: rgb(45,45,45);
    text-align: center;
}

.summary-card {
    background-color: rgb(241, 241, 241);
    border-color: rgb(255, 255, 255);
    border-bottom-style: solid;
    border-bottom-width: 4px;
    border-bottom-color: rgb(171, 193, 167);
    border-radius: 0;
}

/*Table styles*/

.cell-markdown {
    font-family: 'Source Sans Pro','Gill Sans','Trebuchet MS','Arial',sans-serif !important;
    text-align: right !important;
    vertical-align: middle !important;
}

.dash-cell {
    border-color: rgb(211, 211, 211) !important;
}

.dash-cell.focused {
    background-color: rgba(171, 193, 167, .25) !important;
}

.svg-inline--fa.fa-sort {
    color: rgb(211, 211, 211);
}

.svg-inline--fa.fa-sort:hover {
    color: rgb(171, 193, 167);
}

/*Form styles*/
.form-check-input:checked {
    background-color: rgb(171, 193, 167);
    border-color: rgb(171, 193, 167);
}

.form-check-input:focus {
    border-color: rgb(171, 193, 167);
    box-shadow: 0 0 0 .25rem rgba(171, 193, 167, .25);
}

.Select--multi .Select-value {
    color: rgb(45,45,45) !important;
    background-color: rgb(171, 193, 167) !important;
}

.Select-value-icon:hover {
    color: rgb(213, 224, 211) !important;
}
/*
.Select.is-focused:not(.is-open) {
    border-color: rgb(171, 193, 167) !important;
    box-shadow: 0 0 0 .25rem rgba(171, 193, 167, .25);
}

.Select-control {
    border-color: rgb(204, 204, 204) !important;
}
*/

.alert-fw {
    padding-left: 0;
    padding-right: 0;
}