html, body{
    height: 100%;
    margin: 0px auto;
}
body{
    font-family: "Segoe UI","Roboto","Droid Sans","Helvetica Neue",Arial,sans-serif;
    font-size: 18px;
    color: rgb(55,55,55);
    line-height: 1.42;
    font-weight: normal;
}
.leaflet-container{
    font-family: "Segoe UI","Roboto","Droid Sans","Helvetica Neue",Arial,sans-serif;
}
.outer-wrapper{
    min-height: 100%;
    display: grid;
    grid-template-rows: auto 1fr auto;
}
.outer-wrapper.about-wrapper{
    grid-template-rows: auto auto 1fr auto;
}

.nav{
    box-sizing: border-box;
    width: 100%;
    padding: 0 30px;
    height: 80px;
    background-color: #fff;
    display: flex; 
    align-items: center;
    justify-content: space-between;

    border-bottom: 1px solid rgb(238,238,238);
    position: sticky;
    top: 0;
    z-index: 2000;
}
.nav-right{
    flex: 0 1 860px;
    max-width: 85%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}
.nav a{
    font-size: 20px;
    text-decoration: none;
    color: #034230;
    font-weight: 600;
    transition: color 0.15s ease;
    line-height: 1.2;
    position: relative;
    height: 100%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.nav a:hover, .nav a:focus{
    color: rgb(74, 142, 123);
}
.nav a.has-drop{
    padding-right: 12px;
}
.nav a.has-drop::after{
    content: "";
    width: 0;
    height: 0;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 7px solid #034230;
    position: absolute;
    top: 48%;
    right: 0;
    pointer-events: none;
    transition: border-top-color 0.15s ease, border-bottom-color 0.15s ease;
}
.nav a[aria-expanded="true"]::after{
    border-top: none;
    border-bottom: 7px solid #034230;
}
.nav a[aria-expanded="false"]:hover::after, .nav a[aria-expanded="false"]:focus::after{
    border-top-color: rgb(74, 142, 123);
}
.nav a[aria-expanded="true"]:hover::after, .nav a[aria-expanded="true"]:focus::after{
    border-bottom-color: rgb(74, 142, 123);
}
.nav-group{
    position: relative;
    height: 100%;
    padding: 0 24px;
}
.nav-drop-group, #mobile-nav{
    display: none;
    position: absolute;
    list-style: none;
    background-color: #fff;
    border: 1px solid rgb(238,238,238);
    border-top: none;
    padding: 10px 10px 4px 15px;
    box-shadow: 0 2px 2px 1px rgba(80,80,80,0.15);
    left: 0;
    top: 62px;
    width: 146px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    width: 100%;
    border-top: 1px solid rgb(74, 142, 123);
}
.nav-drop-group a{
    font-size: 17px;
    font-weight: 500;
    display: block;
    margin: 0 0 12px 0;
}
.nav-drop-group.group-open{
    display: block;
}

.scroll-to-fixer{
    position: absolute;
    pointer-events: none;
    top: -100px;
    outline: none;
}
.relative{
    position: relative;
}

.main{
    box-sizing: border-box;
    margin: 0 auto;
    width: 100%;
    padding: 30px 15px;
    background-color: rgb(238,238,238);
}
.inst-holder, .policy-holder{
    background-color: #fff;
    padding: 30px;
    font-weight: 500;
}
h2.policy-header{
    margin-top: 0;
    font-weight: 500;
    color: #fff;
    font-size: 24px;
    background-color: #214d41;
    padding: 20px;
    margin: 0 -30px;
    border-top-left-radius: 4px;
}
.inst-holder{
    grid-column: 1;
    border-top-right-radius: 4px;
}
.policy-holder{
    grid-column: 2/4;
    border-top-left-radius: 4px;
    padding-top: 0;
}

/*prevent grid blowout*/
.nav, .main, .header-bar, .footer{
    min-width: 0;
}

.filter-holder, .inst-info-holder, .map-holder, .get-started-group{
    position: relative;
}
.get-started-group{
    padding: 30px;
}
.filter-holder{
    position: sticky;
    top: 80px;
    z-index: 1;
}
.map-holder{
    height: calc(100vh - 80px);
    position: sticky;
    top: 80px;
}

.filter-inner-flex{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}
.m-group{
    flex: 1 1 50%;
    margin: 0 20px;
}

h1.filter-title{
    margin-top: 0;
    line-height: 1.2;
}
.mini-map-holder{
    height: 360px;
}

#map, #mini-map{
    width: 100%;
    height: 100%;
    position: relative;
}
#mini-map{
    border-radius: 6px;
    border: 1px solid rgb(227, 227, 227);
}

.footer{
    font-size: 16px;
    box-sizing: border-box;
    background-color: #424242;
    padding: 60px 40px 50px 40px;
    color: rgb(252,252,252);
}
.footer a{
    color: #fff;
}
.footer-right{
    flex: 0 0 220px;
}
.footer-right a{
    font-size: 17px;
    display: block;
    margin: 4px 0;
    text-decoration: none;
    font-size: 17px;
    font-weight: 500;
}
.footer-right a:hover, .footer-right a:focus{
    text-decoration: underline;
}
.footer-right-p{
    margin: 4px 0 8px 0;
}
.footer-left{
    font-size: 17px;
    margin-right: 80px;
}
.footer-left p:first-child{
    margin-top: 4px;
}
.div-line{
    display: block;
    border-top: 2px dotted rgb(252,252,252);
    margin: 14px 0 12px 0;
    width: 120px;
}
.footer-inner{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.footer-bottom, .footer-inner{
    max-width: 1200px;
    margin: 0 auto;
}
.footer-bottom{
    text-align: center;
    margin-top: 80px;
}
.footer a:hover, .footer a:focus{
    color: #b4e1d4;
}
.video-holder{
    width: 820px;
    height: 500px;
    max-width: 100%;
    background-color: rgb(222,222,222);
    border-radius: 8px;
    margin: 40px 0 40px 0;
}

.esri-truncated-attribution {
    vertical-align: -3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    transition: 0s white-space;
    transition-delay: 1s;
    width: 450px;
    max-height: 30px;
    overflow-y: auto;
}
.esri-truncated-attribution:hover {
    white-space: normal;
}

.filter-label.not-button{
    color: #034230;
    font-weight: 600;
    font-size: 24px;
    text-align: center;
}

button.filter-label, button.faq-label{
    border-bottom: 4px solid transparent;
    width: 100%;
    margin-top: 28px;
    margin-bottom: 0;
    font-weight: 500;
    font-size: 24px;
    color: #034230;
    display: block;
    cursor: pointer;
    padding-left: 36px;
    position: relative;
    background-color: transparent;
    text-align: left;
    display: none;
    transition: color 0.15s ease;
}
button.filter-label:hover, button.faq-label:hover{
    color: rgb(74, 142, 123);
}
button.filter-label::before, button.faq-label::before, button.filter-label::after, button.faq-label::after{
    content: "";
    width: 4px;
    height: 20px;
    background-color: #034230;
    position: absolute;
    top: 3px;
    left: 8px;
    pointer-events: none;
    transition: background-color 0.15s ease;
}
button.filter-label::before, button.faq-label::before{
    width: 20px;
    height: 4px;
    top: 11px;
    left: 0;
}
button.filter-label::after{
    top: 6px;
}
button.filter-label::before{
    top: 14px;
}
button.filter-label:hover::before, button.faq-label:hover::before, button.filter-label:hover::after, button.faq-label:hover::after{
   background-color: rgb(74, 142, 123);
}
button.filter-label[aria-expanded='true']::after, button.faq-label[aria-expanded='true']::after{
    display: none;
}
#help-modal button.filter-label, button.faq-label{
    display: block;
}
.group-wrapper button.filter-label{
    margin-top: 0;
}
button.faq-label{
    margin-top: 0;
    font-size: 20px;
}
.about-main .filter-group{
    margin-left: 36px;
}
#help-modal .filter-group{
    margin-left: 38px;
}
.group-wrapper{
    margin-top: 28px;
}
.faq-inner{
    margin: 10px 0;
}
.faq-inner > .help-group{
    margin-left: 12px;
}
.faq-inner .help-def{
    margin-left: 0;
}

.filter-group{
    height: 0;
    overflow-y: hidden;
    transition: height 0.2s ease;
    margin-left: 24px;
}
.group-closed{
    display: none;
}
.group-open{
    height: auto;
}
.filter-group-inner{
    padding: 0 0 30px 0;
}
.get-started-group h2{
    font-weight: 600;
    margin: 6px 0 14px 0;
    color: #034230;
    font-size: 30px;
}

.welcome-message{
    font-size: 20px;
    max-width: 600px;
    margin: 0 auto;
}
.welcome-message.p2{
    margin-top: 18px;
}
.m-intro-text{
    font-size: 19px;
}

.inst-list{
    margin: 0;
    padding: 0;
    list-style: none;
}
.inst-card{
    padding: 20px 30px;
    box-sizing: border-box;
    margin-bottom: 10px;
    font-weight: 500;
    border-bottom: 4px solid rgb(212, 221, 217);
    border-radius: 3px;
    max-width: 1000px;
}
.inst-card:last-child{
    border-bottom: none;
}
.inst-empty{
    box-sizing: border-box;
    font-weight: 600;
    text-align: center;
    font-size: 30px;
    padding: 40px 0 200px 0;
}
@media(min-width: 2200px){
    .inst-empty{
        height: 400px;
    }
}
.inst-title{
    margin-top: 0;
    margin-bottom: 8px;
    position: relative;
    padding-left: 14px;
    padding-right: 20px;
    color: #034230;

    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
button.inst-link{
    color: #1163ac;
    text-decoration: none;
    font-size: 19px;
    cursor: pointer;
    font-family: inherit;
    font-weight: 600;
    display: block;
    margin-left: 14px;
    background-color: transparent;
    text-align: left;
}
.zoom-to-inst{
    margin-left: 14px;
    font-style: italic;
    cursor: pointer;
    font-size: 18px;
}

.inst-info{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
    margin: 10px 0 14px 0;
    margin-left: 14px;
    max-width: 900px;
}
.inst-info p{
    margin: 4px 0;
}
.sys-subnote{
    display: inline-block;
    margin-top: 40px;
}
.mini-header, .help-title{
    font-weight: 700;
    font-size: 18.5px;
}
.inst-info .mini-header, .details-main .policy-details-group .mini-header, .help-title{
    display: block;
}
.help-title{
    margin-top: 30px;
    margin-bottom: 4px;
    font-size: 19px;
}
.help-group:first-child > .help-title, .help-list-item .help-title{
    margin-top: 10px;
}
.help-list-item .help-title{
    display: inline-block;
    font-weight: 600;
    text-decoration: underline;
}
.help-list-item .help-def{
    margin-bottom: 10px;
    margin-left: 0;
    line-height: 1.2;
}
.help-def{
    margin-top: 0;
    font-weight: 500;
    /*margin-left: 10px;*/
}
.help-list{
    margin-top: 0;
    margin-bottom: 40px;
}
.help-def + .help-list{
    margin-top: -10px;
}
.main-inner{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}
.main-left{
    flex: 0 0 620px;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 4px;
    margin-right: 10px;
}
.main-right{
    flex: 1 1 60%;
    background-color: #fff;
    border-radius: 4px;
}

.details-main{
    display: grid;
    grid-template-columns: 480px 1fr 1fr;
    gap: 10px;
    grid-template-rows: minmax(100px, auto);
    padding: 0;
}
.details-main .mini-header{
    display: inline-block;
    margin-right: 4px;
}
button.more-info{
    outline: none;
    border: none;
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    color: inherit;
    background: transparent;
    box-shadow: none;
    padding: 0;
    margin: 0;
    display: inline;
    text-align: left;
}
.more-info{
    cursor: pointer;
    text-decoration-line: underline;
    text-decoration-color: #1163ac;
    text-decoration-style: dotted;
}
.more-info:hover, .more-info:focus{
    color: #1163ac;
}
#info-tooltip{
    position: absolute;
    width: 260px;
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 2000;
}
.tooltip-close{
    position: absolute;
    top: 0;
    right: 2px;
    background-color: transparent;
    outline: none;
    border: none;
    color: #fff;
    font-weight: 500;
    font-family: inherit;
    font-size: 18px;
    cursor: pointer;
    text-align: right;
    padding: 0 6px 0 0;
}
.tooltip-close:hover, .tooltip-close:focus{
}
#info-tooltip.visible{
    opacity: 1;
}
.tooltip-inner{
    border-radius: 5px;
    background-color: #094780;
    border: 1px solid #094780;
    box-shadow: 0 1px 8px rgba(0,0,0,0.4);
    padding: 12px 18px 14px 10px;
    line-height: 1.2;
    font-size: 16px;
    color: rgb(252,252,252);
    font-weight: 500;
}
.tt-mini-h{
    font-weight: 600;
}
.tooltip-tri{
    position: relative;
    width: 40px;
    height: 20px;
    margin: 0 auto;
    overflow: hidden;
    top: -1px;
}
.tooltip-tri.left-adj{
    margin-left: 10px;
}
.tooltip-tri-inner{
    background: #094780;
    width: 17px;
    height: 17px;
    padding: 1px;
    margin: -10px auto 0;
    transform: rotate(45deg);
}
.help-button{
    background-color: #1163ac;
    color: #fff;
    font-weight: 700;
    height: 30px;
    width: 30px;
    border-radius: 50%;
    border: none;
    outline: none;
    font-family: inherit;
    font-size: 18px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.help-button.sticky{
    float: right;
    top: 62px;
    position: sticky;
    z-index: 3;
    margin: 10px 20px 0 auto;
    display:block;
}
.help-button.details-button{
    float: right;
    margin: 0 0 0 16px;
}
.help-button:hover, .help-button:focus{
    background-color: rgb(7, 70, 125);
}
.modal-link, .modal-swap-link{
    background-color: transparent;
    padding: 0;
    margin: 0;
    color: #1163ac;
    font-weight: 600;
    display: inline;
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
}
.modal-link:hover, .modal-link:focus, .modal-swap-link:hover, .modal-swap-link:focus{
    color: #7aafdf;
    text-decoration: underline;
}

.help-bar{
    text-align: right;
    padding: 10px 30px 0 30px;
    position: sticky;
    top: 0;
}
.help-bar .modal-swap-link{
    font-weight: 500;
    font-style: italic;
    position: relative;
}

#inst-name{
    color: #034230;
    font-weight: 700;
    font-size: 28px;
    margin-bottom: 18px;
    margin-top: 0;
    line-height: 1.15;
    border: none;
}

#policy-list{
    padding-left: 0;
    list-style: none;
}

.inst-details{
    margin-bottom: 26px;
    font-weight: 500;
}
.inst-details-att{
    margin-bottom: 40px;
}

.inst-details p,.policy-details-group p{
    margin: 10px 0;
}
.policy-details-group p:first-child{
    margin-top: 0;
}

.inst-group{
    position: sticky;
    top: 30px;
}

.policy-details-card{
    border-bottom: 6px solid #214d41;
    border-top: 4px solid rgb(74, 142, 123);
}
.policy-details-card:last-child{
    border-bottom: none;
}
.policy-details-card:first-child{
    border-top: none;
}
.policy-details-group{
    max-width: 1200px;
}

.opp-span{
    font-weight: 600;
}
#opp-count{
    font-weight: 700;
}

.policy-title, .filter-header{
    color: #034230;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.15;
}
.policy-title{
    font-size: 30px;
    margin: 50px 0 10px 14px;
}
.filter-header{
    margin: 0;
    background-color: #034230;
    padding: 12px 0;
    color: #fff;
    text-align: center;
    position: sticky;
    top: 0;
    z-index: 3;
    box-sizing: border-box;
    min-height: 52px;
}
.filter-header.has-closer{
    padding-right: 20px;
}
.details-subheader{
    color: #034230;
    border-bottom: 2px solid rgb(212, 221, 217);
    text-transform: uppercase;
    font-size: 17px;
    font-weight: 500;
    margin: 0 0 10px 0;
}
.filter-subheader{
    font-weight: 700;
    font-size: 20px;
    margin: 4px 0 8px 9px;
    display: inline-block;
    /*border-bottom: 4px dotted rgb(212, 221, 217);*/
}
.filter-subheader.extra-top{
    margin-top: 22px;
}
.select-label{
    display: block;
    font-style: italic;
    margin-left: 10px;
}

.policy-details-group{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
    gap: 26px;
    margin: 40px 0;
}
#inst-outer-s{
    grid-column: 1/3;
}
.inst-details-stu{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}
.inst-details-stu > div{
    flex: 1 1 50%;
}
.inst-details-stu > div:nth-child(2){
    margin-left: 26px;
}

.policy-details-group, .policy-details-notes{
    margin-left: 14px;
}
.policy-details-notes{
    margin-bottom: 38px;
    padding: 16px;
    border-radius: 4px;
    background-color: rgb(232, 240, 239);
    max-width: 900px;
}
.multi-note, .policy-web-link{
    margin-left: 14px;
    padding-left: 14px;
    position: relative;
    line-height: 1.2;
    font-size: 17px;
}
.policy-details-notes .mini-header{
    margin: 0;
}
.policy-details-notes .notes-inner{
    margin: 10px 0 0 0;
}
.policy-details-notes a{
    margin-left: 8px;
}

button{
    appearance: none;
    border: none;
    box-shadow: none;
    background-color: #fff;
}

.button-group{
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin: 60px auto 20px auto;
}

.learn-more-link{
    font-family: inherit;
    font-size: 20px;
    font-weight: 600;
    color: #1163ac;
    cursor: pointer;
    padding-left: 0;
    margin-left: 14px;
    text-decoration: none;
    display: block;
    line-height: 1.2;
}

.main a, .trio-group a, .help-group a{
    font-weight: 600;
    color: #1163ac;
    text-decoration: none;
}

.learn-more-link, button.inst-link{
    position: relative;
    padding: 0 0 0 14px;
}

.learn-more-link::before, button.inst-link::before, .multi-note::before, .policy-web-link::before, .tips-list li::before{
    content: "";
    display: block;
    height: 8px;
    width: 8px;
    background-color: #1163ac;
    top: 11px;
    left:0;
    border-radius: 50%;
    position: absolute;
}
.multi-note::before, .policy-web-link::before{
    top: 7px;
}
.tips-list li::before{
    top: 12px;
    background-color: rgb(55,55,55);
}

.popup-link{
    color: #1163ac;
    font-size: 17px;
    font-weight: 600;
    display: block;
    text-decoration: none;
    line-height: 1.2;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    background-color: transparent;
    padding: 0;
}
.popup-link.non-filter{
    font-weight: 500;
    margin-top: 6px;
}
.popup-note{
    font-family: inherit;
    font-size: 17px;
    display: block;
    font-weight: 500;
    line-height: 1.2;
}
.policy-web-link{
    margin-top: 8px;
    font-weight: 500;
    margin-bottom: 4px;
}
.link-like-button{
    border: none;
    background-color: transparent;
    box-shadow: none;
    font-size: inherit;
    font-family: inherit;
    padding: 0;
    margin: 0;
    font-weight: 600;
    color: #1163ac;
    cursor: pointer;
    display: inline;
    text-align: left;
}

.learn-more-link:hover, button.inst-link:hover, .popup-link:hover, .popup-link:focus, .main a:hover, .main a:focus, .help-group a:hover, .help-group a:focus, .link-like-button:hover, .link-like-button:focus, .trio-group a:hover, .trio-group a:focus{
    color: #7aafdf;
    text-decoration: underline;
}

.stroke-under{
    paint-order: stroke;
    transition: fill 0.2s ease;
}

.leaflet-popup-content-wrapper{
    border-radius: 6px;
}
.popup-title{
    font-size: 18px;
    font-weight: 700;
    color: #034230;
    margin: 20px 0 6px 0;
    line-height: 1.25;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-right: 10px;
}
.popup-title .fave-button{
    background-size: 24px 24px;
}

/**/

.leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar, .full-extent-button, .zoom-to-button, #zoom-to-county-select, .layers-holder-inner, .layers-button, .zoom-button-holder{
    border: 1px solid rgb(200,200,200);
    box-shadow: 0 1px 1px 1px rgba(0,0,0,0.2);
}
.leaflet-control-zoom{
    margin-bottom: 10px;
}
.leaflet-bar a, .leaflet-bar a:hover{
    color: #373737;
}
.leaflet-bar a.leaflet-disabled{
    color: #bbb;
}
.full-extent-button, .zoom-to-button, .layers-button{
    box-sizing: border-box;
    padding: 0;
    display: block;
    background-color: rgb(252,252,252);
    height: 32px;
    width: 32px;
    margin: 10px 0 0 10px;
    border-radius: 2px;
    cursor: pointer;
    pointer-events: auto;
    background-image: url("/css/images/full_extent_icon.png");
    background-size: 26px 26px;
    background-position: center;
    background-repeat: no-repeat;
}
.full-extent-button, .zoom-to-button{
    clear: both;
}
.full-extent-button:hover, .zoom-to-button:hover, .layers-button:hover{
    background-color: #f4f4f4;
}

/**/


.check-holder{
    position: relative;
    display: block;
    padding: 2px 0 2px 9px;
    font-weight: 500;
    color: inherit;
    pointer-events: auto;
    font-size: 18px;
    cursor: pointer;
}
.checkbox-text{
	margin-left: 28px;
	display: inline-block;
	vertical-align: top;
}
.checkbox-overlay{
	box-sizing: border-box;
	pointer-events: none;
	z-index: 2;
	background: rgb(252,252,252);
}
.checkbox-overlay, .check-holder input{
	position: absolute;
	height: 17px;
	width: 17px;
	border: 1px solid rgb(100,100,100);
	border-radius: 2px;
	top: 7px;
	left: 11px;
}
.check-holder input:checked + .checkbox-overlay{
	background-color: #1163ac;
	border-color: #1163ac;
}
.check-holder input:disabled + .checkbox-overlay{
    border-color: rgb(200,200,200);
}

.check-holder.no-data input:checked + .checkbox-overlay{
    background-color: rgb(200,200,200);
}

.check-holder input:checked +.checkbox-overlay::before{
	box-sizing: border-box;
	content: "";
	position: absolute;
	border: 2px solid #fff;
	border-top: none;
	border-left: none;
	left: 5px;
	bottom: 3px;
	width: 5px;
	height: 10px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	pointer-events: none;
}
.check-holder input{
	margin: 0;
	cursor: pointer;
}
.check-holder input:disabled{
    cursor: default;
}
.check-holder input:indeterminate + .checkbox-overlay{
	background-color: #8bac88;
	border-color: #8bac88;
}
.check-holder input:indeterminate + .checkbox-overlay::before{
	box-sizing: border-box;
	content: "";
	position: absolute;
	height: 2px;
	width: 12px;
	background-color: #fff;
	top: 7px;
	left: 2px;
	pointer-events: none;
}

.sort-bar{
    height: 74px;
    background-color: #fff;
    display: flex;
    justify-content: flex-start;
}
.sort-bar, .filter-info-bar-inner, .fave-bar-inner{
    max-width: 1000px;
    box-sizing: border-box;
    padding: 0 30px 10px 30px;
}

.results-count-group{
    background-color: #214d41;
    color: #fff;
    padding: 16px 14px;
    margin: 0;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
}
.results-count-inner{
    max-width: 1000px;
    text-align: center;
    padding: 0 30px;
    box-sizing: border-box;
    position: relative;
}
#results-found-count{
    font-weight: 600;
}

.filter-info-bar, #fave-bar{
    height: 0;
    overflow-y: hidden;
    transition: height 0.2s ease;
    background-color: #fff;
}

.filter-info-bar-inner, .fave-bar-inner{
    padding-top: 10px;
}
.fave-bar-inner{
    border: 2px dashed #f4a800;
    max-width: none;
}
.filter-info-bar span, #fave-bar span{
    font-style: italic;
}
#all-filters-list, #favorites-list{
    flex-wrap: wrap;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding-left: 0;
    list-style: none;
    margin: 4px 0 10px 10px;
}
#all-filters-list li, #favorites-list li{
    margin: 0 10px 10px 0;
}
.filter-rm-button, .favorite-rm-button{
    font-size: 16px;
    font-family: inherit;
    color: inherit;
    font-weight: 500;
    background-color: rgb(232,232,232);
    border-radius: 4px;
    padding: 6px 20px 6px 8px;
    outline: none;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease;
    position: relative;
}
.filter-rm-button:hover, .filter-rm-button:focus{
    background-color: rgb(200,200,200);
}
.favorite-rm-button{
    padding-right: 8px;
    background-color: #ffd77d;
}
.favorite-rm-button:hover, .favorite-rm-button:focus{
    background-color: #f4a800;
}
.filter-x-icon{
    font-style: normal;
    pointer-events: none;
    position: absolute;
    top: 0;
    right: 4px;
    line-height: 1;
}
.sort-group{
    font-weight: 600;
    margin-right: 30px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
#sort-drops{
    color: rgb(55,55,55);
}
.sort-group:last-child{
    margin-right: 0;
}
.search-bar, .form-input, #contact-message{
    width: 300px;
    height: 36px;
    padding: 6px 12px;
    font-size: 16px;
    color: inherit;
    font-family: inherit;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    margin-left: 10px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;

}
.search-bar:focus, .form-input:focus, #contact-message:focus{
    border-color:#034230;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(110,170,153,0.6);
    outline: none;
}
.search-bar{
    width: 260px;
    margin: 6px 0;
    max-width: 100%;
    font-size: 15px;
    padding: 4px 8px;
}

.search-bar-outer{
    pointer-events: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    background-color: rgba(255,255,255,0.9);
    border-radius: 2px;
    border: 1px solid rgb(200,200,200);
    box-shadow: 0 1px 1px 1px rgba(0,0,0,0.2);
    margin: 10px 0 0 10px;
    padding: 10px 10px 15px 10px;
    width: 284px;
    box-sizing: border-box;
    position: relative;
}

.search-bar-outer > label{
    font-family: inherit;
    font-size: 15.5px;
    font-weight: 600;
}
#search-results-list{
    pointer-events: auto;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    list-style: none;
    max-height: 200px;
    width: 100%;
    overflow-y: scroll;
    background-color: #fff;
}
#search-results-list li:nth-child(odd){
    background-color: rgb(240,240,240);
}
#search-results-list button{
    font-family: inherit;
    color: inherit;
    font-size: 16px;
    cursor: pointer;
    padding: 6px 6px;
    text-align: left;
    line-height: 1.1;
    background-color: transparent;
    width: 100%;
}
#search-results-list button:hover, #search-results-list button:focus{
    color: #1163ac;
}
.close-control{
    position: absolute;
    right: 2px;
    top: 2px;
    border: none;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    background-color: #fff;
    font-family: inherit;
    color: rgb(100,100,100);
    cursor: pointer;
    font-size: 18px;
    height: 20px;
    width: 20px;
    line-height: 1;
    font-weight: 700;
}
.close-control:hover, .close-control:focus{
    color: #1163ac;
}
.open-control{
    box-sizing: border;
    pointer-events: auto;
    background-color: rgb(252,252,252);
    border-radius: 2px;
    border: 1px solid rgb(200,200,200);
    box-shadow: 0 1px 1px 1px rgba(0,0,0,0.2);
    margin: 10px 0 0 10px;
    width: 32px;
    height: 32px;
    cursor: pointer;
}
.open-control:hover, .open-control:focus{
    background-color: #f4f4f4;
}
#open-search-box{
    background-image: url("/css/images/search_icon.png");
    background-size: 26px 26px;
    background-position: center;
    background-repeat: no-repeat;
}

.mobile-legend{
    display: none;
    background-color: #fff;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    margin-bottom: 20px;
    border-top: 2px solid rgb(212, 221, 217);
}

.legend-outer{
    background-color: rgba(255,255,255,0.9);
    border-radius: 2px;
    border: 1px solid rgb(200,200,200);
    box-shadow: 0 1px 1px 1px rgba(0,0,0,0.2);
    margin: 10px 10px 0 0px;
    pointer-events: auto;
    width: 260px;
}
.legend-outer.sub-legend{
    height: 0;
    overflow-y: hidden;
    transition: height 0.2s ease;
    border-color: transparent;
    box-shadow: none;
}
.legend-outer.sub-legend.group-open{
    border-color: rgb(200,200,200);
    box-shadow: 0 1px 1px 1px rgba(0,0,0,0.2);
}
.legend-inner{
    padding: 14px 20px;
}
.legend-group h3, .mobile-legend h3{
    margin: 0 0 2px 0;
    font-size: 18px;
}
.legend-row{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 16px;
}
.legend-square{
    height: 14px;
    width: 14px;
    border-radius: 2px;
    margin-right: 7px;
    margin-top: 1px;
}
.legend-dot{
    height: 10px;
    width: 10px;
    border-radius: 50%;
    margin-right: 7px;
    margin-top: 2px;
    flex: 0 0 10px;
}
.legend-r{
    font-weight: 600;
    font-size: 18px;
    margin-top: 16px;
}

.legend-r .legend-square{
    background-color: #58a68f;
}
.legend-1 .legend-dot{
    background-color: #006dce;
}
.legend-2 .legend-dot{
    background-color: rgb(160,160,160);
}
.legend-f .legend-dot{
    background-color: #f4a800;
    transition: background-color 0.2s ease;
}
.legend-3 .legend-dot{
    background-color: rgb(160,160,160);
    height: 6px;
    width: 6px;
    margin: 3px 9px 0 2px;
    flex: 0 0 6px;
}
.legend-f{
    cursor: pointer;
    color: inherit;
    font-family: inherit;
    transition: color 0.2s ease;
    text-align: left;
    border-radius: 4px;
    margin: 0 0 6px 0;
    line-height: 1.1;
    padding: 4px 6px;
    background-color: transparent;
}
.legend-f:hover, .legend-f:focus{
    color: #1163ac;
}
.legend-f:hover .legend-dot, .legend-f:focus .legend-dot{
    background-color: #ffd77d;
}
.legend-outer .button-group, #fave-bar .button-group{
    margin: 24px auto 0 auto;
    justify-content: space-between;
}
#fave-bar .button-group{
    margin-top: 10px;
}
.legend-note{
    font-size: 16px;
    font-style: italic;
    margin: -2px 0 14px 0;
}

.form-input, #contact-message{
    width: 100%;
    margin-left: 0;
}
#contact-message{
    height: auto;
}

.input-group{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}

.select-wrapper{
    display: inline-block;
    margin-left: 10px;
    position: relative;
}
.select-wrapper-wrapper{
    margin: 10px 0 16px 0;
}
.select-label + .select-wrapper-wrapper{
    margin-top: 4px;
}

.select-wrapper::after{
    content: "";
    width: 0; 
    height: 0; 
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 7px solid rgb(65, 64, 66);

    position: absolute;
    top: 45%;
    right: 6px;

    pointer-events: none;
}

.select-wrapper select, #save-link{
    width: 252px;
    appearance: none;
    color: inherit;
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: none;
    height: 36px;
    padding: 6px 12px;
    font-size: 16px;
    border-radius: 4px;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.select-wrapper.small select{
    width: auto;
    padding-right: 20px;
}

#save-link{
    width: 100%;
    flex: 1 1 100%;
}

#state-filter-select, #tl-filter-dist, #tl-filter-select, #save-link{
    border: 2px solid #1163ac;
    height: 40px;
    padding: 8px 14px;
    font-size: 17px;
    cursor: pointer;
}

.select-wrapper select::-ms-expand{
    display: none;
}

.select-wrapper select:focus, #save-link:focus{
    border-color:rgb(7, 70, 125);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(122, 175, 223, 0.6);
}

button.show-more-button, .message-button, a.download-data-link, #reset-filters-button, #show-colleges-button, .legend-button.save-button, .legend-button.clear-button, #f-modal-open, #close-details-modal, #copy-link{
    font-family: inherit;
    font-weight: 600;
    font-size: 18px;
    padding: 20px 60px;
    margin: 10px auto;
    cursor: pointer;
    display: block;
    border: 1px solid #034230;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    border-radius: 4px;
    color: #034230;
    background-color: #fff;
    transition: box-shadow 0.2s ease, background-color 0.2s ease;
}

button.show-more-button:hover, button.show-more-button:focus, .message-button:hover, .message-button:focus, a.download-data-link:hover, .download-data-link:focus, #reset-filters-button:hover,  #reset-filters-button:focus, .legend-button.save-button:hover, .legend-button.save-button:focus, .legend-button.clear-button:hover, .legend-button.clear-button:focus{
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(110,170,153,0.6);
}
#reset-filters-button, .legend-button.clear-button{
    border-color: rgb(157, 157, 157);
    color: rgb(55, 55, 55);
}
#reset-filters-button:hover,  #reset-filters-button:focus, .legend-button.clear-button:hover, .legend-button.clear-button:focus{
    background-color:rgba(255,255,255,0.7);
}
#reset-filters-button, #show-colleges-button{
    padding: 12px;
    display: inline-block;
    margin: 30px 15px;
}
.message-button{
    font-size: 22px;
    margin-top: 40px;
}
.message-button, a.download-data-link, #show-colleges-button, #f-modal-open, .legend-button.save-button, #copy-link{
    color: #fff;
    background-color: #1163ac;
    border-color: transparent;
}
#f-modal-open{
    font-size: 22px;
    padding: 18px 52px;
    margin-top: 50px;
}
#copy-link{
    font-size: 18px;
    margin: 0;
    margin-left: 26px;
    padding: 0;
    height: 40px;
    flex: 0 0 120px;
}
#close-details-modal{
    height: 36px;
    box-sizing: border-box;
    margin: 5px 0 5px 20px;
    position: relative;
    padding: 6px 10px 6px 24px;
    flex: 0 0 36px;
    background-color: transparent;
    box-shadow: none;
    color: rgb(55,55,55);
    border: none;
}
#show-colleges-button{
    font-size: 20px;
}
#f-modal-open, #show-colleges-button, #copy-link{
    background-color: #1163ac;
}
#show-colleges-button{
    box-shadow: inset 0 1px 1px rgba(255,255,255,0.075);
}
#f-modal-open:hover, #f-modal-open:focus, #show-colleges-button:hover, #show-colleges-button:focus, #copy-link:hover, #copy-link:focus{
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(122, 175, 223, 0.6);
    background-color: rgb(7, 70, 125);
}
#close-details-modal::before{
    content: "";
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-right: 12px solid rgb(55,55,55);
    position: absolute;
    top: 12px;
    left: 8px;
    pointer-events: none;
    transition: border-top-color 0.15s ease, border-bottom-color 0.15s ease;
}
#close-details-modal:hover, #close-details-modal:focus{
    color: #1163ac;
}
#close-details-modal:hover::before, #close-details-modal:focus::before{
    border-right-color: #1163ac;
}

.filter-button-group{
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 100%;
    background-color: rgb(238,238,238);
    position: sticky;
    bottom: 0;
    z-index: 2;
}
a.download-data-link{
    text-decoration: none;
    padding: 18px 30px;
    font-size: 22px;
    text-align: center;
    width: 260px;
}
.legend-button.save-button,.legend-button.clear-button{
    padding: 5px 10px 7px 10px;
    font-size: 16px;
    font-weight: 500;
    margin: 0;
}
.dd-span-1, .dd-span-2{
    display: block;
}
.dd-span-1{
    margin-bottom: 4px;
}
.dd-span-2{
    font-weight: 500;
    font-size: 18px;
}

.message-button:hover, .message-button:focus, a.download-data-link:hover, a.download-data-link:focus, .legend-button.save-button:hover, .legend-button.save-button:focus{
    background-color: #034230;
}
a.download-data-link:hover, a.download-data-link:focus{
    color: #fff;
    text-decoration: none;
}

.small-text, .large-text{
    pointer-events: none;
}

.small-text{
    display: none;
}

.about-main, .download-main{
    display: block;
    background-color: #fff;
    padding: 0 15px 80px 15px;
}
.about-main.has-trio{
    padding-bottom: 0;
}
.about-group{
    width: 1200px;
    max-width: 100%;
    /*
    border-radius: 4px;
    background-color: #fff;
    padding: 0 30px 40px 30px; 
    */
    margin: 0 auto;
    box-sizing: border-box;
}
.about-group.has-nav{
    max-width: calc(100% - 310px);
    padding-top: 0;
}
.about-inner{
    width: 980px;
    max-width: 100%;
    margin: 20px auto;
    background-color: #fff;
    padding: 30px 30px;
    border-top: 10px solid rgb(232, 240, 239);
    box-sizing: border-box;
}
.about-inner:first-child{
    margin-top: 50px;
}
.about-inner.no-border{
    border-top: none;
}

h2.menu-header{
    margin: 10px 0 10px 0;
    font-size: 20px;
    font-weight: 600;
}
.about-nav-outer{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}
.left-nav{
    width: 300px;
    flex: 0 0 300px;
    box-sizing: border-box;
    position: sticky;
    left: 0;
    top: 30px;
    height: calc(100vh - 30px);
    overflow-y: auto;
    scrollbar-width: thin;
    padding: 30px 0;
    border-right: 1px solid rgb(222,222,222);
}
.left-nav-inner{
    padding: 20px;
    border-radius: 4px;
}
.nav-list{
    padding-left: 0;
    list-style: none;
}
.nav-list a{
    font-weight: 500;
    display: block;
    line-height: 1.2;
    margin: 20px 0;
    color: #034230;
    transition: color 0.15s ease;
}
.nav-list a:hover, .nav-list a:focus{
    color: rgb(74, 142, 123);
}

.header, .subheader{
    line-height: 1.1;
}
.header-bar{
    box-sizing: border-box;
    padding: 0 30px;
    height: 260px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #214d41;
    background: linear-gradient(234deg, #214d41, #214d41 80%, rgb(74, 142, 123) 80%);
    color: #f0f7f4;
}
.header{
    margin-top: 0;
}
.header-bar .header, .header-bar .subheader{
    font-weight: 300;
    font-size: 40px;
    margin: 10px 0 0 0;
    width: 980px;
    max-width: 100%;
}
.subheader{
    margin-top: 60px;
    font-weight: 600;
}
.trio-group h2.subheader{
    margin-top: 0px;
}
.about-inner h2.subheader{
    margin-top: 20px;
}
.about-inner.no-border h2.subheader{
    margin-top: 0;
}
.header + .subheader{
    margin-top: 0;
}
.subheader.text-like{
    font-weight: 500;
}
.header-bar .subheader{
    font-weight: 600;

}
.tips-list{
    padding-left: 10px;
    list-style: none;
}
.tips-list li{
    font-size: 20px;
    margin: 8px 0 18px 0;
    padding-left: 20px;
    position: relative;
}
.tips-list a{
    display: inline-block;
}
.tips-list span{
    display: block;
    font-weight: 500;
}

.about-group p{
    max-width: 900px;
}
.about-inner ol{
    max-width: 800px;
}
.about-inner p, .about-inner ol{
    font-size: 19px;
}
.emphatic{
    font-weight: 600;
    font-style: italic;
}
.about-inner p.before-ol{
    margin-bottom: 4px;
}
.about-inner ol{
    margin-top: 0;
}
.about-inner ol > li{
    margin: 10px 0;
}
p.about-statement{
    margin: 0;
    font-size: 20px;
}
.h3-group p{
    margin: 0 0 36px 0;
}
h2 + h3.subheader{
    margin-top: 0;
}

.form-holder{
    margin: 0 auto 30px auto;
    padding: 30px;
    box-sizing: border-box;
    max-width: 840px;
}

.form-items > label{
    display: block;
    font-weight: 600;
    color: #034230;
    font-size: 22px;
    margin: 26px 0 4px 0;
}

.emphasize{
    font-weight: 600;
    font-size: 1.05em;
}

.l-span{
    margin-bottom: 12px;
    display: block;
}
.trio-group{
    background-color: #fff;
    padding: 50px 30px;
    width: 100%;
    box-sizing: border-box;
    border-top: 44px solid rgb(238,238,238);
}
.trio-group-inner{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: 0 auto;
    width: 100%;
    max-width: 1400px;
}
.bg-group{
    flex: 1 1 33%;
    margin: 0 16px;
    position: relative;
}
.funder-logo{
    width: 100%;
    display: block;
    margin: 40px auto 12px auto;
    max-width: 280px;
}
.nav-mobile{
    position: relative;
    display: none;
    height: 100%;
}
#menu-burger{
    display: none;
    height: 100%;
    width: 80px;
    cursor: pointer;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    padding: 14px 18px;
}
#menu-burger span{
    pointer-events: none;
    display: block;
    background-color: #034230;
    height: 4px;
    width: 100%;
    border-radius: 4px;
    transition: background-color 0.2s ease, transform 0.3s ease;
}
#menu-burger:hover span, #menu-burger:focus span{
    background-color: rgb(74, 142, 123);
}
#menu-burger[aria-expanded="true"] span.s-1{
    transform: translate(0px, 8px) rotate(45deg);
}
#menu-burger[aria-expanded="true"] span.s-2{
    display: none;
}
#menu-burger[aria-expanded="true"] span.s-3{
    transform: translate(0px, -11px) rotate(-45deg);
}
#mobile-nav{
    display: none;
    box-sizing: border-box;
    top: 62px;
    left: auto;
    right: 0;
    width: 340px;
    padding: 10px 20px;
}
#mobile-nav a{
    display: block;
    padding: 17px 0;
    font-size: 22px;
}
.mobile-nav-subgroup{
    list-style: none;
    padding: 10px 0 14px 22px;
}
#mobile-nav a.has-list{
    padding-bottom: 0;
}
#mobile-nav .mobile-nav-subgroup a{
    padding: 7px 0;
    font-size: 19px;
}
.pubs-list{
    list-style: none;
    padding-left: 0;
    position: relative;
    margin: 40px auto 20px auto;
}
.article-li{
    box-sizing: border-box;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.article-date, .article-text{
    position: relative;
    min-height: 80px;
    box-sizing: border-box;

}
.article-text{
    padding: 22px 4px 8px 16px;
    flex: 1 1 100px;
}
.article-date{
    flex: 0 0 80px;
    text-align: center;
    font-weight: 600;
    display: inline-flex;
    justify-content: center;
    flex-direction: column;
}
.article-date::after{
    content: "";
    position: absolute;
    display: block;
    right: 0;
    top: 25%;
    width: 2px;
    height: 50%;
    background-color: rgb(212, 221, 217);
}
.date-date{
    display: block;
    font-size: 1.1em;
}
.article-name{
    margin: 0;
    font-size: 1.15em;
}
.article-auth, .article-desc, .article-rm{
    margin: 0;
}
.article-auth{
    font-weight: 500;
    margin: 4px 0 10px 0;
}
.article-desc{

}
a.article-rm{
    font-weight: 500;
}
#scroll-to-top{
    position: fixed;
    z-index: 2000;
    bottom: 60px;
    left: 580px;
    border-radius: 20px;
    padding: 0;
    background-color: rgba(255,255,255,1);
    height: 40px;
    width: 40px;
    font-size: 20px;
    font-weight: 600;
    color: #424242;
    border: 1px solid rgba(80,80,80,0.3);
    cursor: pointer;
}
#scroll-to-top:hover, #scroll-to-top:focus{
    border-color: rgb(74, 142, 123);
}
#scroll-to-top::before{
    content: "";
    width: 0;
    height: 0;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    border-bottom: 16px solid #6c6c6c;
    position: absolute;
    top: 10px;
    left: 10px;
    border-radius: 3px;
    pointer-events: none;
}
#scroll-to-top::after{
    content: "";
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 8px solid #fff;
    position: absolute;
    top: 18px;
    left: 15px;
    pointer-events: none;
}
#scroll-to-top:hover::before, #scroll-to-top:focus::before{
    border-bottom-color: rgb(74, 142, 123);
}
#map{
    border-radius: 4px;
}

#loading-message, #map-init-message{
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(232,232,232, 0.85);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    font-size: 36px;
    font-weight: 600;
    padding: 60px 30px;
    box-sizing: border-box;
    opacity: 0;
    pointer-events: none;
    z-index: 2;
    transition: opacity 0.2s ease;
}
#map-init-message{
    align-items: center;
    padding: 30px 30px 60px 30px;
}
#loading-message.visible, #map-init-message.visible{
    pointer-events: auto;
    opacity: 1;
}
.footer-logo{
    width: 300px;
}
.nav-logo{
    width: 180px;
}
.nav-logo-small{
    display: none;
}

.leaflet-popup-content-wrapper, .leaflet-popup-tip{
    box-shadow: 0 3px 5px rgba(0,0,0,0.4);
}
.leaflet-bar{
    border-radius: 2px;
}

/* modals */

.modal-open, html.modal-open{
    overflow: hidden;
}

.modal-mask{
    opacity: 1;
    position: fixed;
    z-index: 5001;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(200,200,200,0.9);
    transition: opacity .3s ease;
}
.modal-mask.out, .modal-holder.out{
    opacity: 0;
    pointer-events: none;
}
.modal-holder{
    opacity: 1;
    pointer-events: none;
    position: fixed;
    z-index: 5002;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    transition: opacity .3s ease;
}
.modal-holder.slide-modal{
    left: 0;
    transition: left 0.3s ease;
    overflow-y: hidden;
}
.modal-holder.slide-modal.out{
    opacity: 1;
    left: 100vw;
}
.modal{
    width: 760px;
    max-width: 96%;
    background: #fff;
    position: relative;
    z-index: 5002;
    margin: 50px auto 0 auto;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 10px 36px 40px 36px;
    overflow-y: auto;
    box-shadow: 1px 1px 1px 2px rgba(180,180,180,.9);
    pointer-events: auto;
}
.slide-modal .modal{
    padding: 0;
    width: calc(100% - 24px);
    max-width: 100%;
    height: calc(100% - 24px);
    margin: 12px 0 12px auto;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.modal.filter-inner{
    width: 920px;
    padding: 0;
}
.modal.help-inner, .modal.link-inner{
    padding: 0;
}
.modal.details-help-inner{
    margin-top: 10px;
}
.modal-inner-padding{
    padding: 10px 36px 40px 36px;
}

.modal-close{
    font-weight: 700;
    position: absolute;
    top: 0;
    right: 10px;
    cursor: pointer;
    border: none;
    background: transparent;
    color: #fff;
    font-size: 28px;
    font-family: inherit;
    padding: 0;
    transition: color 0.2s ease;
}

.modal-close:hover, .modal-close:focus{
    color: #b4e1d4;
    outline: none;
}
.modal-head-p{
    margin-top: 36px;
    margin-bottom: 8px;
}
.modal-text-p{
    margin-top: 0;
}

.switch-holder{
    display: none;
    align-items: center;
    justify-content: space-around;
    height: 48px;
}
.switch-button{
    height: 100%;
    flex: 1 1 100%;
    border: none;
    padding: 0;
    margin: 0;
    background-color: rgb(242,242,242);
    font-size: 17px;
    font-family: inherit;
    color: inherit;
    transition: 0.2s ease background-color;
    cursor: pointer;
    font-weight: 500;
}
.switch-button:hover, .switch-button:focus{
    background-color: rgba(74, 142, 123, 0.4);
}
.switch-button.chosen, .switch-button.chosen:hover, .switch-button.chosen:focus{
    background-color: rgb(41, 130, 105);
    font-weight: 600;
    color: #fff;
}

.modal.details-inner{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    background-color: rgb(238,238,238);
}
.iframe-holder{
    flex: 1 1 100%;
    width: 100%;
    position: relative;
    overflow-y: hidden;
}
#iframe-loading{
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: rgb(238,238,238);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 36px;
    font-weight: 600;
    padding: 30px 30px 60px 30px;
    box-sizing: border-box;
    opacity: 0;
    pointer-events: none;
    z-index: 2;
    transition: opacity 0.2s ease;
}
#iframe-loading.visible{
    pointer-events: auto;
    opacity: 1;
}
#details-iframe{
    width: 100%;
    height: 100%;
    box-sizing:border-box;
    border: none;
    background-color: transparent;
}
.fave-button{
    background-color: transparent;
    box-sizing: border-box;
    padding: 0;
    display: block;
    height: 32px;
    width: 32px;
    border-radius: 2px;

    flex: 0 0 32px;
    margin-left: 10px;
    
    cursor: pointer;
    pointer-events: auto;
    background-image: url("/css/images/heart.png");
    background-size: 30px 30px;
    background-position: center;
    background-repeat: no-repeat;

    opacity: 1;

}
.fave-button:hover{
    background-image: url("/css/images/heart_c-1.png");
    opacity: 0.5;
}
@media(min-width: 769px){
    .fave-button:focus{
        background-image: url("/css/images/heart_c-1.png");
        opacity: 0.5;
    }
}
.fave-button.chosen{
    background-image: url("/css/images/heart_c-1.png");
    opacity: 1;
    transition: opacity 0.2s ease;
}

.hidden{
    display: none;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.sr-only-focusable:active, .sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
  white-space: normal;
}


@media(max-width: 1400px){
    .inst-details-req{
        margin-left: 0;
    }
    .main-left{
        flex-basis: 560px;
    }
    #scroll-to-top{
        left: 528px;
    }
    .inst-card{
        padding: 20px 20px;
    }
}

@media(max-width: 1200px){
    .inst-details-stu{
        display: block;
    }
    .inst-details-stu > div:nth-child(2){
        margin-left: 0;
    }
    .nav a{
        font-size: 18px;
    }
    .nav{
        padding: 0 20px;
    }
    .main-left{
        flex-basis: 492px;
    }
    #scroll-to-top{
        left: 460px;
    }
}

@media(max-width: 1100px){
    .legend-outer{
        width: auto;
    }
    .legend-inner{
        padding: 10px 12px;
    }
    .legend-group h3, .mobile-legend h3{
        font-size: 14px;
    }
    .legend-row{
        font-size: 13px;
    }
    .legend-square{
        margin-top: 0;
    }
    .legend-dot{
        margin-top: 0;
    }
    .legend-r{
        font-size: 14px;
    }

    .main.details-main{
        grid-template-columns: 400px 1fr 1fr;
    }
    .main-inner{
        display: block;
    }
    .get-started-group h2{
        text-align: center;
    }
    #scroll-to-top{
        left: auto;
        right: 30px;
        bottom: 40px;
    }
    .main-left{
        margin-right: 0;
    }
    .map-holder{
        height: 400px;
        width: 100%;
    }
    .nav-right{
        display: none;
    }
    .nav-mobile{
        display: block;
    }
    #menu-burger{
        display: flex;
    }
    #mobile-nav.group-open{
        display: block;
        max-height: calc(100vh - 80px);
        overflow-y: auto;
    }
    .switch-holder{
        display: flex;
    }
    .show-map .inst-info-holder, .show-map .sort-group{
        display: none;
    }
    .filter-holder, .map-holder{
        position: relative;
        top: auto;
    }
    .show-list .map-holder, .show-list .mobile-legend{
        display: none;
    }
    .main-right{
        border-top-right-radius: 0;
        border-top-left-radius: 0;
    }
    #map{
        border-radius: 0;
    }
    .results-count-group{
        min-height: 84px;
    }
}

@media(max-width: 940px){
    .outer-wrapper{
        display: block;
    }
    .main.details-main{
        display: block;
    }
    .inst-holder, .policy-holder, h2.policy-header{
        border-radius: 0;
    }
    .inst-group{
        position: relative;
        top: auto;
    }
    .help-button.details-button{
        position: fixed;
        top: 20px;
        right: 20px;
        z-index: 500;
    }
    .policy-details-group{
        display: block;
    }
    .inst-details-outer{
        margin-top: 30px;
    }
    .nav a{
        font-size: 19px;
    }
    .header-bar{
        text-align: center;
    }
    .button-group{
        display: block;
        text-align: center;
        margin-top: 50px;
    }
    #fave-bar .button-group{
        display: flex;
    }
    a.download-data-link{
        margin: 22px auto;
        display: block;
        text-align: center;
    }
}

@media(max-width: 756px){
    .about-inner:first-child{
        margin-top: 10px;
    }
    .modal-inner-padding{
        padding: 10px 20px 40px 20px;
    }
    .slide-modal .modal{
        width: 100%;
    }
    #close-details-modal{
        height: 44px;
        flex: 0 0 44px;
    }
    #close-details-modal::before{
        top: 16px;
    }
    .header-bar .subheader{
        font-size: 30px;
        line-height: 1;
        margin-top: 10px;
    }
    .sort-group{
        margin-left: 30px;
    }
    .sort-group > span{
        display: block;
        margin-right: 3px;
    }
    button.filter-label{
        display: block;
    }
    .filter-group-inner{
        padding: 10px 0 30px 0;
    }
    .filter-inner-flex{
        display: block;
    }
    .filter-label.not-button{
        display: none;
    }
    .filter-button-group{
        margin-top: 30px;
    }
    .main-inner{
        display: block;
    }
    .legend-outer{
        display: none;
    }
    .mobile-legend{
        display: block;
    }
    .mobile-legend .legend-group{
        padding-left: 4px;
        margin-bottom: 10px;
    }
    .mobile-legend .legend-row{
        margin: 1px 0;
    }
    #mobile-nav{
        width: 100vw;
        right: -15px; /*.nav padding*/
    }
    .policy-details-group, .policy-details-notes, .policy-web-link, .multi-note, .policy-title{
        margin-left: 0;
    }
    .inst-holder{
        padding: 20px;
    }
    .nav{
        padding: 0 15px;
    }
    .nav a{
        margin: 0;
        font-size: 18px;
    }
    .small-text{
        display: block;
    }
    .large-text{
        display: none;
    }
    .form-holder{
        margin: 30px 0 20px 0;
        padding: 0;
        padding-top: 20px;
    }
    .inst-info-holder{
        padding-right: 0;
        padding-left: 0;
    }
    .inst-card{
        padding: 20px 10px;
        font-size: 17px;
    }
    .inst-card .mini-header{
        font-size: 17.5px;
    }
    .inst-card button.inst-link{
        font-size: 18px;
    }
    .inst-card button.inst-link::before{
        top: 9px;
    }
    .sort-bar{
        display: block;
        height: auto;
        padding: 5px 15px 10px 15px;
        border-radius: 8px;
        margin: 0 15px;
        background-color: rgb(232,232,232);
    }
    .results-count-inner{
        padding: 10px 15px;
        display: block;
    }
    .inst-info{
        display: block;
    }
    .leaflet-popup-content{
        max-width: 220px;
    }
    .inst-info p{
        margin: 10px 0;
    }
    .footer-inner{
        display: block;
    }
    .footer-left{
        margin: 10px auto 40px auto;
    }
    .footer-right{
        margin: 40px auto 60px auto;
    }
    .footer{
        padding-right: 30px;
        padding-left: 30px;
    }
    .about-inner{
        padding-right: 15px;
        padding-left: 15px;
    }
    .trio-group-inner{
        display: block;
    }
    .trio-group h2.subheader{
        margin-top: 60px;
    }
    .bg-group{
        margin: 10px 0;
    }
    .filter-info-bar{
        margin-top: 16px;
    }
    #scroll-to-top{
        right: 30px;
        bottom: 30px;
    }
    .search-bar-outer, #open-search-box{
        position: absolute;
        top: 0px;
        left: 44px;
    }
    .search-bar-outer{
        width: 240px;
    }
    #search-results-list{
        max-height: 160px;
    }
}

@media(max-width: 500px){
    .modal{
        margin-top: 5px;
    }
    .filter-header{
        font-size: 20px;
    }
    .about-inner ol, .help-list{
        padding-left: 20px;
    }
    .tips-list{
        padding-left: 0;
    }
    .results-count-group{
        min-height: 97px;
    }
    .sort-group{
        display: block;
    }
    .sort-group > span{
        margin-right: 0;
        margin-bottom: 3px;
    }
    .results-found-group{
        flex: 0 1 186px;
    }
    .show-map .sort-group{
        display: none;
    }
    .nav{
        height: 62px;
    }
    #mobile-nav.group-open{
        max-height: calc(100vh - 62px);
    }
    .nav-logo{
        width: 150px;
    }
    #menu-burger{
        padding: 10px 22px;
    }
    #menu-burger[aria-expanded="true"] span.s-1{
        transform: translate(0px, 4px) rotate(45deg);
    }
    #mobile-nav{
        top: 44px;
    }
    .select-wrapper-wrapper{
        margin-left: 10px;
    }
    .policy-holder{
        padding: 30px 20px;
    }
    h2.policy-header{
        margin: 0 -20px;
    }
    .mini-header, .details-main .mini-header{
        display: block;
    }
    .get-started-group{
        padding: 30px 15px;
    }
    .main.details-main{
        padding: 0;
    }
    .main{
        padding: 30px 10px;
    }
    .inst-list{
        margin-top: 30px;
    }
    .select-wrapper{
        width: 90%;
    }
    .select-wrapper.small{
        width: auto;
    }
    .select-wrapper select{
        width: 100%;
    }
    .search-bar{
        width: 100%;
    }
    .search-bar, .select-wrapper{
        margin-left: 0;
    }
    .article-li{
        display: block;
    }
    .article-date{
        height: 80px;
        width: auto;
    }
    .article-date::after{
        left: 25%;
        right: auto;
        top: auto;
        width: 50%;
        height: 2px;
        bottom: 3px;
    }
    .article-text{
        padding-top: 2px;
        padding-left: 0;
    }
    #scroll-to-top{
        right: 20px;
        bottom: 20px;
    }
}

@media(max-width: 360px){
    .footer{
        padding-right: 15px;
        padding-left: 15px;
    }
    .nav a{
        font-size: 17px;
    }
    #scroll-to-top{
        right: 15px;
        bottom: 15px;
    }
}