/*
   Styles for About Us section

          Dark: #4f4a21
         Light: #9e9c70
   20% lighter: #d1cfa3
*/


/* Section banner. */

@media (min-width: 768px) { #colour-banner { background-color: var(--color-about-us-bg); } }


/* Main menu. */

#main-menu li#aboutus { background-color: var(--color-about-us-bg); }
#main-menu li#aboutus a { color: white; }


/* Navigation breadcrumbs and related links. */

#crumbs { background-color: rgb(245, 245, 241); } /* Needs to be opaque for sticky positioning. */
@media (min-width: 768px) { #crumbs { background-color: rgb(158, 156, 112, 0.1); } }
#content .relatedlinks a { background-color: rgb(158, 156, 112, 0.1); }
#content .relatedlinks a:hover { background-color: rgb(158, 156, 112, 0.2); }


/* Side menu. */

.side-menu a.current,
.side-menu .side-submenu.expanded a.current,
.side-menu .side-submenu.expanded .side-submenu.expanded a.current
   { background-color: #4f4a21; color: white; border-right: 5px solid var(--color-about-us-bg); }
.side-menu a.current:hover,
.side-menu .side-submenu.expanded a.current:hover,
.side-menu .side-submenu.expanded .side-submenu.expanded a.current:hover
   { background-color: #4f4a21; }


/* Paragraphs, list items, hyperlinks. */

#content a { color: #4f4a21; }
#content a:hover { background-color: #d1cfa3; }


/* Strategic Plan summary boxes. */

#content a.dropdown.goals
   { border: 1px solid rgba(153,0,0,1); background-color: rgba(153,0,0,0.1); }
#content a.dropdown.goals:hover
   { background-color: rgba(153,0,0,0.2); }

#content div.progress
   { border: 1px solid rgba(255,204,0,1); background-color: rgba(255,204,0,0.1);
     padding: 0.25em 0.5em; }
#content div.progress p
   { font-size: 110%; line-height: 125%; padding: 0.25em 0 0.25em 1em;
     text-indent: -0.5em; margin: 0; }
#content div.progress p.progresstitle
   { font-size: 125%; font-weight: bold; text-indent: 0; padding-left: 0.5em; }
#content div.progress a { background-color: rgba(255,204,0,0.25); }
#content div.progress a:hover { background-color: rgba(255,204,0,0.5); }


/* Timeline. */

#content div.timeline { align-items: center; }
#content div.timeline h3 { text-align: center; }
#content div.timeline h3 span
   { display: inline-block; font-weight: 400; font-size: 150%;
     color: white; background-color: rgb(76,76,76);
     padding: 6px 12px 8px 12px; border: 5px solid white;
     box-shadow: 0 3px 6px #999999; }


/* Some general styles useful for the new Strategic Plan. */

#content .big-down-arrow
   { font-family: 'Source Sans'; text-align: center; transform: rotate(90deg);
     font-size: 750%; font-weight: 800; line-height: 20%; padding: 0; margin: 0.3em 0;
     color: rgba(0,0,0,0.1); }

#content .pointed
{ clip-path: polygon(
   0% 10%, 90% 10%, 90% 0%, 100% 50%, 90% 100%, 90% 90%, 0% 90% ) }