/* Variables */

:root {
    --bs-dark-rgb: 30, 30, 30;
    --bs-link-color-rgb: 2, 98, 243;
}

/* Body and Sticky Footer */

html {
    position: relative;
    min-height: 100%;
    font-size: 0.95rem;
}

body {
    margin-bottom: 200px;
    font-family: "Open Sans", "Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

@media (max-width: 991px) {
    body {
        margin-bottom: 300px;
    }
}

@media (max-width: 768px) {
    body {
        margin-bottom: 300px;
    }
}

@media (max-width: 575px) {
    body {
        margin-bottom: 420px;
    }
}


@media (max-width: 400px) {
    body {
        margin-bottom: 460px;
    }
}


.footer {
    padding: 1rem 2rem;
    position: absolute;
    bottom: 0;
    background-color: #002e6e;
    width: 100%
}


.footer, footer a {
    color: #ffffff;
}

.footer-small {
    font-size: 0.85rem;
}

/* dev staging live site banner */

#devtestsite {
    /*display: none;*/
    height: 17px;
    font-size: 10px;
    color: #000;
    text-decoration: none;
    text-align: center;
    line-height: 1.5;
    padding: 1px 4px;
    background-color: #000000;
    transition: background-color 100ms;
    transition: color 300ms;
}

#devtestsite.localhost {
    display: block;
    background-color: #423bad;
    color: #fff;
}

#devtestsite.devsite {
    display: block;
    background-color: darkorange;
    color: #fff;
}

#devtestsite.stagingsite {
    display: block;
    background-color: darkred;
    color: #fff;
}

#devtestsite.livesite {
    display: block;
    background-color: #2ab777;
    color: #fff;
}

#devtestsite.localhost:before {
    content: "YOU ARE ON LOCALHOST";
}

#devtestsite.devsite:before {
    content: "YOU ARE ON THE DEV SITE";
}

#devtestsite.stagingsite:before {
    content: "YOU ARE ON THE STAGING SITE";
}

#devtestsite.livesite:before {
    content: "YOU ARE ON THE LIVE SITE";
}

/* Skip to Content */

.skip a:focus {
    position: absolute;
    left: 0px;
    top: 0px;
    background: #e00000;
    outline: 0;
    z-index: 10999;
    height: auto;
    width: auto;
    padding: 7px;
    margin: 3px;
    color: #ffffff;
}

/* clearfix */

.clearfix:after, section:after {
    content: "";
    clear: both;
    display: table;
}


/* logo */

.left-logo {
    position: relative;
    margin-top: -50px;
    z-index: 1;
    border-radius: 0.375rem;
}

/* top nav */

.top-nav a {
    display: inline-block;
    padding: 0.5rem 0.7rem;
    font-size: 1.2rem;
    text-decoration: none;
    color: #FFFFFF;
    font-weight: bold;
}

.top-nav a:hover, .top-nav a:focus {
    opacity: 0.7;
}

.top-nav a.top-nav-home {
    padding: 0rem;
    font-size: 1.7rem;
    padding-top: 0px;
}

.top-nav a.top-nav-home img {
    max-height: 40px;
    margin-right: 0.4rem;
    vertical-align: middle;
    margin-top: -5px;
    border-radius: 0.2rem
}

/* Headings */

h1, 
h2, 
h3, 
h4 {
    color: #26558b;
}


.h1,h1 {
    /*font-size: calc(1.375rem + 1.5vw);*/
    font-size: calc(1.25rem + 1vw);
    border-bottom: 1px solid #bfd2f2;
    margin-bottom: 1rem;
}

@media (min-width: 1200px) {
    .h1,h1 {
        /*font-size:2.5rem;*/
        font-size:2rem;
    }
}

.h2,h2 {
    /*font-size: calc(1.325rem + .9vw);*/
    font-size: calc(1.22rem + .6vw);
}

@media (min-width: 1200px) {
    .h2,h2 {
        /*font-size:2rem;*/
        font-size:1.67rem;
    }
}

.h3,h3 {
    /*font-size: calc(1.3rem + .6vw);*/
    font-size: calc(1.2rem + .4vw);
}

@media (min-width: 1200px) {
    .h3,h3 {
        /*font-size:1.75rem;*/
        font-size:1.5rem;
    }
}

.h4,h4 {
    /*font-size: calc(1.275rem + .3vw);*/
    font-size: calc(1.18rem + .2vw);
}

@media (min-width: 1200px) {
    .h4,h4 {
        /*font-size:1.5rem;*/
        font-size:1.33rem;
    }
}

.h5,h5 {
    /*font-size: 1.25rem;*/
    font-size: 1.167rem;
}

.h6,h6 {
    font-size: 1rem;
}

p {
    margin-top: 0;
    margin-bottom: 1rem
}

@media (min-width: 1200px) {
    .h3, h3 {
        font-size: 1.5rem;
    }
}

#maincontent.green h1, 
#maincontent.green h2, 
#maincontent.green h3, 
#maincontent.green h4 {
    color: #26558b;
    color: #ffffff;
    background-color: #588d2d;
    padding: 0rem 0.5rem 0.2rem;
}


/* Text Styles */

.text-muted {
    color: #777777;
}

.text-smaller {
    font-size: 0.88rem;
}

.text-tiny {
    font-size: 0.8rem;
}

/* Lists */

ul.ul-spaced, .mnucp-event ul {
    list-style: none;
}

ul.ul-spaced li, .mnucp-event ul li {
    position: relative;
}

ul.ul-spaced li {
    margin-bottom: 1rem;
}


    ul.ul-spaced li:before, .mnucp-event ul li:before {
        font-family: "Font Awesome 6 Free";
        content: "\f3c5";
        color: #002e6e;
        font-size: 1em;
        position: absolute;
        left: -1.3em;
        top: 0;
        color: #4b65af;
    }


/* External Links */

a[target="_blank"]:after {
    content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAKBAMAAABPkMOvAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAGFBMVEUAAAAAZv8zmcxmmcz///8AZsyZzP8AAABoIiSuAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAHdElNRQfoBhQPNTDpTLMAAAAAP0lEQVQI12NgAAJGQUEBEM2g7OICYTCqgBmsoYEpEIaLmJsKmOGYkigMZriZiTIxgKUSXRkgDBcoIzQ0lIEBAEPZCC+XKOGxAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDI0LTA2LTIwVDE1OjQ5OjAyKzAwOjAwQq51IgAAACV0RVh0ZGF0ZTptb2RpZnkAMjAyNC0wNi0yMFQxNTo0OTowMiswMDowMDPzzZ4AAAAASUVORK5CYII=);
}

a[target="_blank"].btn:after {
    content: ""
}


/* Buttons */

.btn-primary {
    color: #fff;
    background-color: #897215;
    border-color: #755f04;
}

.btn:hover, .btn-focus {
    background-color: #715b00;
}

.btn.btn-outline-light:hover {
    color: var(--bs-btn-hover-color);
    background-color: var(--bs-btn-hover-bg);
    border-color: var(--bs-btn-hover-border-color);
}


/* Images */

img {
    max-width: 100%;
    height: auto;
}

.nowrap {
    white-space: nowrap;
}

/* Nav Bar */

.navbar-brand img {
    margin: -9px -7px -5px -7px
}

.navbar {
    background-color: #2d72a9;
}


@media (max-width: 1400px) and (min-width: 1200px) {
    #search {
        max-width: 215px;
    }
}


/* Hero Image */

.hero img {
    width: 100%;
}


/* Video Container */

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0
}

    .video-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }


/* Expandable Content or Accordion */

.accordion {
    margin-bottom: 8px;
}

.accordion-button {
    font-weight: bold;
}

    .accordion-button.collapsed {
        color: #000000;
        background-color: #bfd2f2;
    }

    .accordion-button:not(.collapsed) {
        color: #000000;
        background-color: #bfd2f2;
    }

/*
.accordion-button::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-plus' viewBox='0 0 16 16'%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E");
  transition: all 0.5s;
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-dash' viewBox='0 0 16 16'%3E%3Cpath d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8z'/%3E%3C/svg%3E");
}
*/

/* Left Nav and Mobile Nav*/

.left-nav {
    margin-top: 1em;
}

.mobile-nav {
    /*padding: 0.5rem;*/
}

.metrogis-nav ul.nav-submenu {
    list-style-type: none;
    padding-left: 0;
    margin-bottom: 0;
}

.left-nav ul.nav-submenu li {

}

.metrogis-nav .submenu-item {
    color: #000;
    text-decoration: none;
    display: block;
    padding: 0.5em 1em 0.5rem 1.5rem;
}

    .metrogis-nav .submenu-item:hover, .metrogis-nav .submenu-item:focus {
        background-color: #ffffff;
    }

    .metrogis-nav .submenu-item.current{
        background-color: #ffffff;
        position: relative;
    }

        .metrogis-nav .submenu-item.current:before,
        .metrogis-nav .submenu-item:hover:before, 
        .metrogis-nav .submenu-item:focus:before {
            font-family: "Font Awesome 6 Free";
            content: "\f3c5";
            color: #002e6e;
            font-size: 1em;
            position: absolute;
            left: 0.4rem;
            top: 0.5rem;
            color: #4b65af; 
        }

.mobile-nav .submenu-item.current:before {
    position: absolute;
    left: 0.5rem;
    top: 0.9rem;
    color: #4b65af;
}

.mobile-nav .accordion {
    margin-bottom: 0;
}

.metrogis-nav .accordion-body {
    background-color: #efefef;
}

.metrogis-nav .accordion-button {
    padding: 1em 1em;
}

.mobile-nav .accordion-item
.mobile-nav .accordion-button,
.mobile-nav .accordion-item:first-of-type,
.mobile-nav .accordion-item:last-of-type,
.mobile-nav .accordion-item:first-of-type>.accordion-header .accordion-button,
.mobile-nav .accordion-item:last-of-type>.accordion-header .accordion-button
{
    border-radius: 0!important;
}

.mobile-nav .submenu-item {
    padding: 1rem 1rem 1rem 1.8rem;
}

.metrogis-nav .accordion-button.collapsed {
    background-color: #bfd2f2;
}

.metrogis-nav .accordion-button:not(.collapsed) {
    background-color: #bfd2f2;
}

.metrogis-nav .current.accordion-button.collapsed {
    background-color: #7bb2de;
    /*color: #ffffff;*/
}

.metrogis-nav .current.accordion-button:not(.collapsed) {
    background-color: #7bb2de;
    /*color: #ffffff;*/
}


.metrogis-nav .accordion-body {
    padding: 0;
}

.mobile-search {
    background-color: #2d72a9;
    padding: 0.5rem;
}

/* Block backgrounds */

.block-bg {
    padding: 1rem 0;
    margin-bottom: 1rem;
}

    .block-bg > .container > p:last-child {
        margin-bottom: 0;
    }

.block-bg-blue {
    background-color: #d2e8ff;
}

.block-bg-gray {
    background-color: #e7e7e7;
}


/* Card blocks */

.card-footer {
    background-color: var(--bs-body-bg);
    border-top: none;
    margin-bottom: 0.6rem;
}

/* Search Results */

.search-results {
    overflow: hidden;
}

.search_result {
    margin-bottom: 1rem;
}

.search-result-link {
    font-weight: bold;
}

.search-result-summary {
    font-size: 0.9rem;
    padding: 0.5rem 3rem;
}

/* Event Calendar */

.mnucp-event {
    padding: 1rem 1rem 1rem 1rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    margin-bottom: 1rem;
    background-color: #efefef;
}

.event-date {
    font-weight: bold;
}

.event-time {
}

.mnucp-event ul {
    margin-top: 1rem;
    margin-bottom: 0;
}

.mnucp-event h3 {
    font-size: 1.2em;
}

/* Affiliations */

.affilation-name {
    font-weight: bold;
}

/* Awards */

.award-organization {
    font-weight: bold;
    font-style: italic;
}

/* Publications */

.publication-name {
    font-weight: bold;
    font-size: 1.2rem;
}

.publication-abstract {
    margin: 1rem 2rem;
    padding-left: 1rem;
    border-left: 1px solid #aaa;
}

/* Testimonials */

.testimonial {
    margin-left: 2rem;
}

    .testimonial blockquote {
        font-size: 1.1em;
        width: 80%;
        margin: 30px auto;
        font-style: italic;
        color: #555555;
        padding: 1.2em 30px 1.2em 75px;
        border-left: 5px solid #002e6e;
        line-height: 1.6;
        position: relative;
        background: #EDEDED;
    }

        .testimonial blockquote::before {
            font-family: Arial;
            content: "\201C";
            color: #002e6e;
            font-size: 5em;
            position: absolute;
            left: 10px;
            top: -10px;
        }

        .testimonial blockquote::after {
            content: '';
        }

        .testimonial blockquote .testimonial-name {
            display: block;
            color: #333333;
            font-style: normal;
            font-weight: bold;
            font-size: 1rem;
            margin-top: 1rem;
        }

        .testimonial blockquote .testimonial-organization {
            display: block;
            font-style: normal;
            font-size: 1rem;
        }

/* Content and Image Block */

/* Content cleanup */
/*
a[href^=http] {
    background-color: yellow;
}
a[href^=mailto] {
    background-color: yellow;
}
a[href$='.pdf'] {
    background-color: yellow;
}

a[target="_blank"] {
    background-color: lightgreen;
}

u, u a {
    background-color: orange!important;
}
*/