/* --- Section Fronts --- */
#id {
   line-height: 1;
   font-weight: 400;
   color: #012350;
   background-color: #44c9f6;
   text-align: center;
   padding: 1em 0;
   position: relative;
   height: auto;
   margin-top: 0;
   z-index: 2;}
   
#id h1 { 
   font-size: 200%;
   letter-spacing: 0px;
   color: #012350;
   margin: 0; 
   text-transform: uppercase;
   width: 100%;
   font-weight: 4700; }




/* --- Meta Styles --- */
.meta time {
   text-transform: uppercase;
   font-weight: 700; }
   
.meta h1 { margin-bottom: .25em; }
.meta h3 { 
   font-weight: 300;
   color: #888;
   margin-bottom: 1em; }


/* --- Body Content Layout --- */
section#body { 
   background: white; 
   width: 100%;
   margin: 2em auto;
   padding: 0;
   text-align: left;
}
   
#content {
   width: 65%;
   float: left; } 
   
   #content.wide {
      width: 100%; }
      
   body.share-your-story #content, body.updates #content { width: 45%; }
   
#options {
   width: 30%;
   float: right; }
   
   #options .promo {
      width: 90%;
      padding: 5%;
      font-size: 90%;
      background: #eee;
      margin-bottom: 1em; }
      
   body.share-your-story #options, body.updates #options { width: 50%; }
      

/* LISTS
------------------------------------ */
ul.folder-list {
   padding: 0;
   margin: 0;
   list-style: none; 
   clear: both; }
   
ul.folder-list.news {
   margin: 0; }

ul.folder-list li { margin: 1em auto; display: block; } 
ul.folder-list li:last-child { border-bottom: 0; }
ul.folder-list li a { 
  -webkit-transition: all .2s ease-in-out;
  -moz-transition:    all .2s ease-in-out;
  -o-transition:      all .2s ease-in-out;
  -ms-transition:     all .2s ease-in-out;
  transition:         all .2s ease-in-out; }  
  
  
ul.folder-list li a span.title { 
   font-size: 150%;
   font-weight: 700;
   line-height: 1;
   margin: 5px 0;
   display: inline-block; }

ul.folder-list.news li a span.title { 
   text-transform: none; }
   
ul.folder-list li a time {
   display: block;
   font-size: 90%;
   text-transform: uppercase;
   color: #000;
   font-weight: 700; }
   
ul.folder-list li a p {
   color: #000;
   font-size: 100%;
   text-transform: none;
   margin: 0;
   -webkit-transition: all .2s ease-in-out;
   -moz-transition:    all .2s ease-in-out;
   -o-transition:      all .2s ease-in-out;
   -ms-transition:     all .2s ease-in-out;
   transition:         all .2s ease-in-out; }
   
      
ul.folder-list li a small {
   display: block;
   text-transform: uppercase;
   color: #000; }
   

article.profile {
   display: block;
   font-size: 120%;
   position: relative;
   width: 100%;
   margin-bottom: 1em;
   padding: 2%; 
   border-bottom: 1px #ccc solid; }
   
article.profile a {
   display: flex;
   align-items: center;
   justify-content: center; }

article.profile figure {
   max-width: 100px;
   height: auto;
}

article.profile figure img {
   width: 100%;
   height: auto;
}

article.profile span.text {  
   position: relative;
   width: 100%;
   margin: 0 0 0 1.5rem;
   }

article.profile span.title {  
   color: #1296da;
   font-size: 180%; }

article.profile span.local-district {  
   display: block;
   margin-bottom: .1em; }

article.profile span.pdf {  
   display: block; 
   font-size: 80%;
   text-transform: uppercase; }
   
   
/* Responsive Video */
.video-container {
  position: relative;
   padding-bottom: 56.25%; /* 16:9 */
   padding-top: 25px;
	height: 0;
}
.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.video-description {
   margin-top: 2em; }

.photos-container {
   border: 5px #02172c solid;
   display: inline-block;
   background: #02172c; }
   
   .photos-container iframe, .flickr-embed, .flickr-embed-photo.show-navigation, .photos-container iframe .flickr-embed .flickr-embed-photo { max-width: 100% !important; }


.expand-container {
   margin-bottom: 3rem;
}

.expand-item {
   margin-bottom: .5rem;
}

.collapsible {
   background-color: #012350;
   color: white;
   cursor: pointer;
   padding: 1rem;
   width: 100%;
   border: none;
   text-align: left;
   outline: none;
   font-size: 120%;
}

.expand-item .active, .collapsible:hover {
   background-color: #44c9f6;
}

.collapsible:after {
   content: '\002B';
   color: white;
   font-weight: bold;
   float: right;
   margin-left: 5px;
}

.expand-item .active:after {
   content: "\2212";
}

.collapsible-container {
   padding: 0;
   width: 100%;
   max-height: 0;
   overflow: hidden;
   transition: max-height 0.5s ease-out;
   background-color: #f1f1f1;
}
.collapsible-content {
   padding: 2rem;
}

.expand-container {
   margin-bottom: 3rem;
}

.expand-item {
   margin-bottom: .5rem;
}

.collapsible {
   background-color: #012350;
   color: white;
   cursor: pointer;
   padding: 1rem;
   width: 100%;
   border: none;
   text-align: left;
   outline: none;
   font-size: 120%;
}

.expand-item .active, .collapsible:hover {
   background-color: #44c9f6;
}

.collapsible:after {
   content: '\002B';
   color: white;
   font-weight: bold;
   float: right;
   margin-left: 5px;
}

.expand-item .active:after {
   content: "\2212";
}

.collapsible-container {
   padding: 0;
   width: 100%;
   max-height: 0;
   overflow: hidden;
   transition: max-height 0.5s ease-out;
   background-color: #f1f1f1;
}
.collapsible-content {
   padding: 2rem;
}

.agenda-grid {
   display: grid;
   grid-template-columns: repeat(1, 1fr);
   grid-gap: 0;
   text-align: left;
}

.agenda-grid h3 {
   margin: 1rem 0 1rem 0; }
   
.agenda-grid ul {
   margin: 0 0 1rem 2rem; }

.profile-intro {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   background: #eee;
   padding: 1.5rem;
   margin: 0 0 2rem 0;
   border: 1px #ccc solid; }
   
.profile-intro-text {
   font-size: 125%;
   line-height: 1.5;
   margin: 1rem 0 4rem 0;}
   
.photo.page.profile {
   width: 40%;
   float: right;
   padding: 1rem;
   background: #eee;
   border: 1px #ccc solid;
   margin: 0 0 2rem 1.5rem; }

.photo.page.profile img {
   width: 100%;
   height: auto; }


@font-face {
  font-family: 'trilogyicons';
  src:  url('https://assets.bytrilogy.com/trilogy-icon-font/Trilogy-Icons.eot');
  src:  url('https://assets.bytrilogy.com/trilogy-icon-font/Trilogy-Icons.eot#iefix') format('embedded-opentype'),
    url('https://assets.bytrilogy.com/trilogy-icon-font/Trilogy-Icons.woff2') format('woff2'),
    url('https://assets.bytrilogy.com/trilogy-icon-font/Trilogy-Icons.ttf') format('truetype'),
    url('https://assets.bytrilogy.com/trilogy-icon-font/Trilogy-Icons.woff') format('woff'),
    url('https://assets.bytrilogy.com/trilogy-icon-font/Trilogy-Icons.svg#Trilogy-Icons') format('svg');
   }
   
.icons {
    font-family: 'trilogyicons';
    content: attr(data-icon);
    speak: none;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }