/* cbr_footer.css */
    @media screen and (max-width: 860px) {
        footer {
            padding-left: 0px;
            text-align: center;
        }
        .footerHomeCenter {
            display: none;
        }
        #homeAltFooter {
            display: block;
            color:white;
        }

        .footerHome {
            margin: 0;
            padding-top: 20px;
            padding-bottom: 40px;
        }    

        .footer_nav > form {
            margin: 0 auto;
            padding: 0 1em;
            color:black;
        }

        /* TEST 0417 */
        .footer_nav a, a.link {
            color: white;
            text-decoration: none;
        }     
    }

/* cbr_frontpage.css */
    @media screen and (max-width: 740px) {
        div#missionBlocks {
            flex-direction: column;
        }
        div#missionBlocks h2 a {
            font-size: 1.4rem;
        }
    }
  
    @media screen and (min-width: 360px) and (max-width: 740px) {
        p.splashTagline {
            font-size: 1rem;
        }
    }
  
    @media screen and (min-width: 1px) and (max-width: 360px) {
        p.splashTagline {
            font-size: 0.8rem;
        }
    }

/* cbr_navFull.css */
    @media screen and (min-width: 860px) and (max-width: 960px) {
        .cbr_NavCenterLarge {
            padding: 3px 8px 15px;
            min-width: 860px;
        }

        .cbr_search_box_footer {
            display: block;
        }
        
        #logo_accordion {
            max-width: 280px;
            margin: 0 auto;
            float: right;
        }

        #cbr_nav_menu .dropdown-menu {
            --bs-dropdown-padding-y: 0;
            margin-top: -2px !important;
            height: auto;
            max-height: 750px;
            overflow-y: auto;
            overflow-x: auto;
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }

        .cbr_NavCenterSmall {
            gap: 5px;
            min-width: 375px;
            border: 1px solid var(--cbr-navmenu-dropnborder);
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }

        .cbr_NavRow {
            max-height: 375px;
        }

        #cbr_NavData > .cbr_NavWrapper > .cbr_NavCenterLarge > .cbr_NavCol2 {
            flex: 5;
        }

        #cbr_NavTrends > .cbr_NavWrapper > .cbr_NavCenter{
            max-height: 300px;
        }

        #cbr_NavPublications > .cbr_NavWrapper > .cbr_NavCenterSmall{
            max-height: 350px;
        }

        #cbr_NavAbout > .cbr_NavWrapper > .cbr_NavCenterSmall{
            max-height: 300px;
        }
        /* END 06/26/2023 */

        #cbr_nav_menu div.navsep {
            margin: 0 0.5rem !important;
        }
    } 
    
    @media screen and (min-width: 960px) and (max-width: 1060px) {
        .cbr_NavCenterLarge {
            padding: 3px 8px 15px;
            min-width:960px;
        }

        .cbr_search_box_footer {
            display: block;
        }

        #logo_accordion {
            max-width: 280px;
            margin: 0 auto;
            float: right;
        }

        #cbr_nav_menu .dropdown-menu {
            --bs-dropdown-padding-y: 0;
            margin-top: -2px !important;
            height: auto;
            max-height: 750px;
            overflow-y: auto;
            overflow-x: auto;
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }

        .cbr_NavCenterSmall {
            gap: 5px;
            min-width: 400px;
            border: 1px solid var(--cbr-navmenu-dropnborder);
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }

        .cbr_NavRow {
            gap:15px;
        }

        #cbr_nav_menu div.navsep {
            margin: 0 0.9rem !important;
        }
    }

    @media screen and (min-width: 1060px) and (max-width: 1100px) {
        .cbr_NavCenterLarge {
            padding: 3px 8px 15px;
            min-width:1060px;
        }

        .cbr_search_box_footer {
            display: block;
        }
        
        #logo_accordion {
            max-width: 280px;
            margin: 0 auto;
            float: right;
        }

        #cbr_nav_menu .dropdown-menu {
            --bs-dropdown-padding-y: 0;
            margin-top: -2px !important;
            height: auto;
            max-height: 750px;
            overflow-y: auto;
            overflow-x: auto;
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }

        .cbr_NavCenterSmall {
            gap: 8px;
            min-width: 450px;
            border: 1px solid var(--cbr-navmenu-dropnborder);
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }

        #cbr_nav_menu div.navsep {
            margin: 0 1.1rem !important;
        }
    }

    @media screen and (min-width: 1100px) and (max-width: 1200px) {
        .cbr_NavCenterLarge {
            gap: 10px;
            padding: 5px 10px 20px;
            min-width:1100px;
        }

        .cbr_search_box_footer {
            display: block;
        }

        #logo_accordion {
            max-width: 280px;
            margin: 0 auto;
            float: right;
        }

        #cbr_nav_menu .dropdown-menu {
            --bs-dropdown-padding-y: 0;
            margin-top: -2px !important;
            height: auto;
            max-height: 750px;
            overflow-y: auto;
            overflow-x: auto;
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }

        .cbr_NavCenterSmall {
            gap: 8px;
            min-width: 450px;
            border: 1px solid var(--cbr-navmenu-dropnborder);
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }

        #cbr_nav_menu div.navsep {
            margin: 0 1.2rem !important;
        }
    }

    @media screen and (max-height: 600px),(max-width: 860px) {
        div#cbr_nav_menu,
        .cbr_search_box,
        .cbr_uw_units_box,
        .cbr_logo {
            display: none;
            justify-content: center;
        }
        
        .cbr_search_box_footer {
            display: block;
        }
    
        .cbr_mobileBlock {
            display: block;
            min-height: 30px;
            background-color: var(--cbr-color);
        }

        #logo_accordion {
            max-width: 280px;
            margin: 0 auto;
            float: right;
        }

        .cbr_accordion {
            display: block;
            background-color: transparent;
            cursor: pointer;
            font-size: 15px;
            /* transition: 0.4s; */
            border: none;
        }
      
        .cbr_Panel {
            padding: 0px;
            display: none;
            width: 100%;
            background-color: var(--cbr-color);
            overflow: hidden;
        }
        
        .cbr_PanelSub {
            padding: 5px 0px 5px 0px;
            display: none;
            width: 100%;
            background-color: var(--cbr-bluegray); /* second level, middle mobile nav */
            overflow: hidden;
        }

        .cbr_PanelSub2 {
            /* padding: 0px 0px 5px 0px; */
            display: none;
            width: 100%;
            background-color: white; /*var(--cbr-nav-bg);*/ /* third level, lightest mobile nav */
            overflow: hidden;
        }

        /* hamburger */
        .cbr_icon_nav {
            border: none;
            color: #ffffff;
            margin: 0 0.25em;
            /* padding: 0em 0em 0.5em 1em; */
            font-size: 2rem;
            font-weight: 600;
            float: left;
            display: block;
            background-color: var(--cbr-color);
        }
        /* this isn't doing anything for me */  
        .cbr_icon_nav a:hover {
            color: #ffffff;
            /* background-color: transparent; */
            font-weight: bold;
            font-weight: 600;
            background-color: var(--cbr-hov-color);
            font-size: 1.5em;
        }
        /* end hamburger */

        .cbr_mobile_nav {
            font-size: 0.9rem;
            /* font-weight: 600; */
            color: #ffffff;
            width: 100%;
            float: none;
            display: block;
            text-align: left;
            padding: 10px 0px 10px 30px;
        }

        /* landing page link styling for accordion */    
        a.cbr_acc_landing {
            font-size: 1.0rem;
            font-weight: 600;
            color: var(--cbr-dark);
            padding: 10px 0px 10px 50px;
        }
        
        .active,
        .cbr_accordion:hover {
            color: var(--cbr_darkestgray);
            font-weight: 600;
            background-color: var(--cbr-spec-tools); /* top level, darkest of mobile nav*/
        }
        
        .cbr_mobile_navSub {
            color: var(--cbr_darkestgray);
            font-size: 0.9rem;
            width: 100%;
            float: none;
            display: block;
            text-align: left;
            padding: 10px 0px 10px 70px;
            background-color: var(--cbr-bluegray); /* second level, middle mobile nav */
        }
        
        .cbr_mobile_nav:hover {
            width: 100%;
            color: var(--cbr_darkestgray);
            background-color: var(--cbr-spec-tools); /* top level, darkest of mobile nav*/
            font-weight: bold;
        }

        .cbr_NavWrapper {
            display: none;
        }
    }

    /* media query for height, make it scrollable */
    @media screen and (max-height: 950px) and (min-height: 901px) {
        #cbr_nav_menu .dropdown-menu {
            --bs-dropdown-padding-y: 0;
            margin-top: -2px !important;
            height: auto;
            max-height: 750px;
            overflow-y: auto;
            overflow-x: auto;
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }
    }
    
    @media screen and (max-height: 900px) and (min-height: 801px) {
        #cbr_nav_menu .dropdown-menu {
            --bs-dropdown-padding-y: 0;
            margin-top: -2px !important;
            height: auto;
            max-height: 650px;
            overflow-y: auto;
            overflow-x: auto;
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }
    }

    @media screen and (max-height: 800px) and (min-height: 701px) {
        #cbr_nav_menu .dropdown-menu {
            --bs-dropdown-padding-y: 0;
            margin-top: -2px !important;
            height: auto;
            max-height: 550px;
            overflow-y: auto;
            overflow-x: auto;
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }
    }

    @media screen and (max-height: 700px) and (min-height: 601px) {
        #cbr_nav_menu .dropdown-menu {
            --bs-dropdown-padding-y: 0;
            margin-top: -2px !important;
            height: auto;
            max-height: 450px;
            overflow-y: auto;
            overflow-x: auto;
            box-shadow: 5px 5px 15px var(--cbr-darkgray);
        }
    }

/* cbr_subsplash.css */
     @media screen and (max-width: 900px) and (min-width: 751px) {
        .subSplash {
            max-height: 160px;
            width: 100%;
        }
    
        h1.splashTitle {
            font-size: 4.25rem;
            line-height: 5rem;
        }
     }
     @media screen and (max-width: 750px) and (min-width: 651px) {
        .subSplash {
            max-height: 160px;
            width: 100%;
        }
    
        h1.splashTitle {
            font-size: 3.75rem;
            line-height: 5rem;
        }
    }
   @media screen and (max-width: 650px) and (min-width: 501px) {
        .subSplash {
            max-height: 160px;
            width: 100%;
        }
    
        h1.splashTitle {
            font-size: 2.75rem;
            line-height: 5rem;
        }
    }
   @media screen and (max-width: 500px) and (min-width: 1px) {
        .subSplash {
            max-height: 160px;
            width: 100%;
        }
    
        h1.splashTitle {
            font-size: 1.75rem;
            line-height: 5rem;
        }
    }

/* styles_CBR.css */
    @media screen and (max-width: 780px) {
        .cbr_research_box_img {
            order: 2;
        }
    
        .cbr_research_box_text {
            order: 1;
        }
        .cbr_researcher_tags {
            order: 3;
        }    
        .cbr_illu_1,
        .cbr_illu_2 {
            margin-top: 0px;
        }

        main#basicPageCbr {
            flex-wrap: wrap;
        }
       /* changed from "item-list" (all results) to just the snippet */
        p.search-snippet { 
            display: none;
        }     
 
        .cbr_jump_link a {
            display: block;
        }
    }

    @media screen and (max-width: 950px) {
        .cbr_people_img {
            border: 1px solid var(--cbr--expand--border);
            max-width: 180px;
            border-radius: 5px;
        }
    }

    /* Bio and Staff pages media queries */
    @media screen and (max-width: 450px) {
        .cbr_center {
            text-align: center;
        }
  
        .expand_box_3 {
            text-align: center;
        }
    
        /* constrant page width General Audience pages */
        .page_width_center {
            display: block;
            max-width: 440px important!;
            width: unset;
        }
        
		h1 {
		  font-size: 1.4rem;
		  font-weight: 700;
		}

		h2 {
		  font-size: 1.2rem;
		  font-weight: 600;
		}

		h3,
		#search-page h2 {
		  font-size: 1.1rem;
		  font-weight: 600;
		}        
        
    }
  
    @media screen and (max-width: 400px) {
        .about_box {
            min-width: 250px;
        }
        .page_width_center {
            display: block;
            max-width: 390px important!;
            width: unset;
        }
    }


/* narrow screens */   
    @media screen and (min-width: 240px) and (max-width: 360px) {

        p.splashTagline {
            font-size: 10px;
        }

        div#specToolsCenter {
            gap: 0;
        }

        div#specToolsRow {
            padding: 0 10px;
        }

        .specTools {
            max-width: 150px;
            margin: 10px 0;
        }

    }

 
    @media screen and (min-width: 1px) and (max-width: 240px) {

        p.splashTagline {
            font-size: 10px;
        }

        div#specToolsCenter {
            gap: 0;
        }

        div#specToolsRow {
            padding: 0 2px;
        }

        .specTools {
            min-width: 100%;
        }

        div#missionBlocks h2 a {
            padding: 0;
        }

    }