@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
:root {
    --white: #fff;
    --teal: #283d4a;
    --turquoise: #4E738A;
    --darkgray: #737478;
    --lightgray: #70707019;
    --orange: #AE6042;
    --darkblue: #002856;
    --sand: #B4AD9C;
    --mustard: #f2b826;
    --darksage: #577c69;
    --purple: #807390;
}

a.accordion-title{
    color: var(--turquoise)
}

.margin-medium-top {
    margin-top: 0% !important;
}
.margin-medium-bottom {
    margin-top: 0% !important;
}


.accordion-content {
background-color:#f5f5f5;
}
#masthead #main-nav .dropdown.menu a {
    padding: .7rem 1.4rem;
}

.create h3{
  background-color:#8a816b !important;
}

.empower h3{
  background-color:#ab821b !important;
}

#page-content .breadcrumbs{
 font-family: 'Lato', sans-serif;
  margin-top:1rem;
  font-weight:500;
}

#page-content .breadcrumbs a{

  text-decoration:none;
  color:var(--turquoise);
  border-bottom:var(--turquoise) solid 1.5px;
}

#page-content .breadcrumbs a:hover{
  border-bottom:var(--orange) solid 1.5px;
}

#masthead #main-nav .menu a.selected {
    background: var(--orange);
    color: #fff
}
.top-page-space{
  margin-top:1.5rem;
}

.diversity-equity-and-inclusion h2 {
font-family: 'Lato', sans-serif;
font-weight:800;
font-size:1.8rem;
color:var(--darkblue);

}
.diversity-equity-and-inclusion h3 {
font-family: 'Lato', sans-serif;
font-weight:600;
font-size:1.4rem;
color:var(--darkblue);

}

.diversity-equity-and-inclusion h2.title-top-line {
margin:0 auto;
text-align:center;
width:40%;
line-height:1.3;
border-top:var(--orange) solid 1px;
padding-top:.5rem;
margin-bottom:1rem;
}

.diversity-equity-and-inclusion h1 img{
    width:17vw;
    max-width: 200px;
    min-width: 100px;
}

#masthead #main-nav, #masthead #main-nav .top-bar, #masthead #main-nav .title-bar, #masthead #main-nav .top-bar ul.dropdown {
    background: var(--darkblue);
}

#masthead #main-nav .top-bar ul a:hover, #masthead #main-nav .top-bar .is-active, #masthead #main-nav .top-bar .is-active a, #masthead #main-nav .top-bar .js-dropdown-active, #masthead #main-nav .top-bar ul.accordion-menu {
    background: var(--orange);
    color: #ffffff;
}

section#faces {
    background-color: #EFEDE9;
    padding-top: 3rem;
    padding-bottom: 3rem;
    text-align:center;
}
#news-events-section {
      background-color: #EFEDE9;
}
a:hover.news-story-link h4 {
    border-bottom:var(--orange) solid 1.5px;
}


.videos-photos .cell a:not(.button) {
   text-decoration:none !important; 
}
.videos-photos .cell a h4 {
font-size:1.1rem;
display:inline; 
border-bottom:var(--turquoise) solid 1.5px; 
 line-height:1.5; 
 margin-bottom:10rem;
}
.videos-photos .cell a:hover h4 {
  border-bottom:var(--orange) solid 2px;
}

.videos-photos .cell {
  margin-bottom:1.5rem;
}
a.news-container h4{
 font-size:1.1rem;
 text-decoration:none !important;
 display:inline;
    border-bottom:var(--turquoise) solid 1.5px;
  line-height:1.3;

}
#videos-photos-section h4 a:hover{
    border-bottom:var(--orange) solid 2.5px;
     text-decoration:none;

}

#news-events-section a.button.news-events {
  background-color:#fff;
  border:var(--orange) solid 2px;
  color:var(--turquoise);
  font-weight:600;
  padding:.5rem;
  font-size:.875rem;
  margin-top:3rem;
}
#news-events-section a:hover.button.news-events {
text-decoration:underline;
}



#news-events-section h3{
  padding-bottom:.4rem;
  margin-bottom:1.2rem;
  border-bottom:var(--orange) solid 3px;

}

.month, .day, .year{
  text-align:center;
  color:var(--darkgray);
  font-weight:600;
}
.day {
    color:var(--darkblue);
  font-weight:900;
  font-size:2.87rem;
  line-height:.8;
}
.news-container {
  align-items: center;
}

.event-title {
  
}
.single-event-container {
    align-items: center;
    display: flex;
  margin-top:1rem;
  margin-bottom:1.25rem;
}
.event-title h4 {
      border-bottom:var(--turquoise) solid 1.5px;
}

.news-container h4 {
  font-size:.875rem;
}
.news-container .date {
  margin-top:.5rem;
  font-size:.85rem;
  color:#000;
}

@media only screen and (min-width: 704px) { /** smal styles **/
.news-container img {
  margin-right:1rem;
  padding-right:.5rem;
}
}
.news-container h4, .event-title h4 {
  display:inline;
  border-bottom:var(--turquoise) solid 1.5px;
  line-height:1.3;
}
#news-events-section .cell a:not(.button) {
  text-decoration:none ;
}

.news-story {
  margin-bottom:1rem;
}
section#faces h3 {
    background-color:var(--darkblue);
    font-size:1.5rem;
    font-weight:1000;
    padding: .25rem 0;
    color:#fff;
    margin-bottom:0;
}
section#faces .cell p{
    font-size:.75rem;
    line-height:1.3;
}
section#faces .foster{
border-bottom:var(--darkblue) solid 3px;
}
section#faces .affirm h3{
background-color:var(--orange);
}
section#faces .affirm{
border-bottom:var(--orange) solid 3px;
}

section#faces .create h3{
background-color:var(--sand);
}
section#faces .create{
border-bottom:var(--sand) solid 3px;
}

section#faces .empower h3{
background-color:var(--mustard);
}
section#faces .empower {
border-bottom:var(--mustard) solid 3px;
}

section#faces .strive h3{
background-color:var(--darksage);
}
section#faces .strive {
border-bottom:var(--darksage) solid 3px;
}

section#faces .faces-container .cell{
    margin-left: .25rem;
        margin-right: .25rem;
        margin-bottom:1rem;
        

}
section#faces .faces-container .cell p{
  display: flex;
  align-items: center;
  justify-content: center;    
  vertical-align: middle;
    height: 7rem;
    margin-top:0;
    margin-bottom:0;
}


#president-quote-section {
      background-color: #EFEDE9;
    text-align:center;
}

.quote-block{
      background-color: #EFEDE9;
  position:relative;
    z-index:1;

}

 .schoolQuote__picture{
   z-index: 2; 
   position:relative; 
}

.schoolQuote__picture img {
    border-radius: 50%;
    box-shadow: 0 0 0 0px #fff, 0 0 0 2px var(--orange);
    max-width: 13rem;
    /* width: 100%; */
    /* display:block; */
}


.quote-symbol {
  position:absolute;
  left:1rem;
  top:1rem;
  
}

.quote-photo {
    position:relative;

}
div.quote-middle-line {
   position:absolute;
  left:-2.5rem;
  top:43%;
}
hr.quote-line {
    height: .5px;
    background-color: var(--orange);
    border: none;
}

#president-quote-section .quote-block p:not(.president-title){
font-size:1rem;
font-weight:350;
line-height:1.8
}
.president-title {
  font-weight:600;
  font-size:.7rem;
}

#president-quote-section .quote-block {
  border:var(--orange) solid 2px;
  padding:5rem;
  padding-top:3rem;
  padding-bottom:3rem;
}




#mission, #president-quote-section, #vision, #by-the-numbers-section,#news-events-section, #videos-photos-section  {
      padding-top: 3rem;
    padding-bottom: 3rem;
}

#by-the-numbers-section h3{
  color:var(--orange);
  font-weight:900;
  font-size:3rem;
  padding-bottom:0;
  margin-bottom:0;
}

#by-the-numbers-section p{
font-size:.725rem;
margin-bottom:0;
}

.by-the-numbers-cell-container{
    padding:1rem;
}

.by-the-numbers .cell {
  background-color:#EFEDE9;

  border-radius:.25rem;

}
.by-the-numbers .cell .grid-x{
 display: flex;
  align-items: center;
  }

.by-the-numbers.grid-margin-x>.cell {
    margin-left: .375rem;
    margin-right: .375rem;
   margin-bottom:.7rem;
}

.by-the-numbers.grid-margin-x {
  
}
.by-the-numbers-icon-container {
height:130px;
width:130px;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
  border:.47rem solid #fff;
    text-align:center;

}
.by-the-numbers-icon-container i.fas {
  color:#fff;
  font-size:4rem;
padding-top:25%;
}

.by-the-numbers-icon-container.blue{
      background-color:var(--turquoise);
}

.by-the-numbers-icon-container.green{
      background-color:var(--darksage);

}

.by-the-numbers-icon-container.purple{
      background-color:var(--purple);

}

@media only screen and (max-width: 703px) { /** smal styles **/

.diversity-equity-and-inclusion h2.title-top-line {
  margin:0 auto;text-align:center;width:100%;line-height:1.3;
  border-top:var(--orange) solid 1px;padding-top:.5rem;margin-bottom:1rem;
  }

.by-the-numbers-icon-container {
  margin:0 auto;
}
#by-the-numbers-section h3{
  font-size:7.5vw;
  text-align:center;
}
#by-the-numbers-section p{
  text-align:center;

}
#by-the-numbers-section img {
  display:block;
  margin:0 auto;
}
#by-the-numbers-section .small-order-1 {
  padding-bottom:0;
  margin-bottom:0;
}

#by-the-numbers-section .small-order-2 {
  padding-bottom:0;
  margin-bottom:0;
}

}

.tt{ /** Trash this at the end *//
      width: calc(100% - 1.875rem);

}

.diversity-champions .cell h4{
  color:var(--turquoise);
  margin-top:.5rem;
  font-weight:650;
  margin-bottom:0;
}
.diversity-champions .cell {
  margin-bottom:1rem;
}

.diversity-champions .cell p {
  font-size:.875rem;
}
@media only screen and (max-width: 1023px) { 
.menu a {
  color:#fff;
}
.menu a:hover {
text-decoration:underline;}
}

@media only screen and (max-width: 640px) { /** smal styles **/

.schoolQuote__picture img {
  position:relative;
   text-align:center;
     margin-top:2rem; 
}
.quote-middle-line{
  left:auto !important;
  right:37% !important;
  top:1rem!important;
   transform: rotate(90deg);
   z-index:0 !important;
} 
#president-quote-section .quote-block {
    border: var(--orange) solid 2px;
    padding: 3.5rem;
    padding-top: 3rem;
    padding-bottom: 1.5rem;
}
}

.contact-list div.profile_picture {
  background-position:top center !important;
  background-size:cover !important;
   max-width:15rem;
  max-height:15rem;
  height:100%;
  width:100%;

}

.council-single div.profile_picture {
  background-position:top center !important;
  background-size:cover !important;
   max-width:15rem;
  max-height:15rem;
  height:100%;
  width:100%;
  margin-right:1rem;
  float:left;
}

@media only screen and (max-width: 640px) { /** smal styles **/
.council-single div.profile_picture {
float:none !important;
  margin-right:1rem;

}
}
.contact-list .cell {
  margin-bottom:2rem;
}

.profile_picture img{
  opacity:0;
}