@charset "UTF-8";

.hanging-indentation {
            padding-left: 3em;
            text-indent: -3em;
        }

 /* =========================================
PURE CSS ACTIVE STATE MATCHING 
========================================= */
        
        /* Highlights the nav item when the body ID matches the nav ID */
        #home-page #nav-home > a,
        #multimedia-page #nav-multimedia > a,
        #about-page #nav-about > a,
        #management-page #nav-management > a,
        #protect-page #nav-protect > a,
        #science-page #nav-science > a,
        #heritage-page #nav-heritage > a,
        #visit-page #nav-visit > a,
        #involved-page #nav-involved > a,
        #education-page #nav-education > a {
            border-left: 3px solid #00467f;
            font-weight: bold;
            background-color: #e5f3f6;
        }

        /* Keeps the dropdown open when the body ID matches the nav ID */
        #about-page #nav-about > ul,
        #management-page #nav-management > ul,
        #protect-page #nav-protect > ul,
        #science-page #nav-science > ul,
        #heritage-page #nav-heritage > ul,
        #visit-page #nav-visit > ul,
        #involved-page #nav-involved >ul,
        #education-page #nav-education > ul {
            display: block;
        }

        /* Rotates the arrow down when the body ID matches the nav ID */
        #management-page #nav-management > a::after,
        #about-page #nav-about > a::after,
        #protect-page #nav-protect > a::after,
        #science-page #nav-science > a::after,
        #heritage-page #nav-heritage > a::after,
        #visit-page #nav-visit > a::after,
        #involved-page #nav-involved > a::after,
        #education-page #nav-education > a::after {
            transform: rotate(45deg);
        }

     /* =========================================
BORDER RADIUS FOR PICTURE HIGHLIGHTS & WELLS 
========================================= */
.picture-highlight, .well {
    border-radius: 1rem;
    overflow: hidden;
}

     /* =========================================
GRID LAYOUT ADD ALIGN
========================================= */

.grid-col-2, .grid-col-3, .grid-col-4 {
    align-items: start;
}