   :root {
	 --WesRed: #d72121;
	 --WesBlack: #000000;
	 --LightGrey: #e9eaea;
	 --DarkGrey: #656A6C;
	 --White: #ffffff;
}

.banner h1 {
    text-align: center;
    font-family: 'ReplicaProBold', sans-serif;
    color: var(--WesBlack);
    text-transform: uppercase;
    margin-left: 0;
    width: 100%;
    bottom: -38px;
}

h2.large {
	 text-transform: uppercase;
	 font-family: 'ReplicaProBold';
	 line-height: .85em;
	 font-size: 200%;
}

.redline {
    border-left: 2px solid #d72121;
    padding-left: 15px;
}


.flexbox {
    display: flex;
    flex-flow: row wrap;
    margin-bottom:40px;
}

.space {
    margin: 50px auto;
}


nav#submenu ul li:nth-child(4) a, nav#submenu ul li:nth-child(5) a, nav#submenu ul li:nth-child(6) a {
    font-size: 1em;
    padding-left:30px;
}


.blackbg {
    background-color: var(--WesBlack);
    padding: 20px;
    margin-top: 8%;
}

.blackbg p {
    color: var(--White);
    max-width: 100%;
    margin: 0 auto;
}



.greybg {
     
	 background-color: var(--LightGrey);
	 padding:20px 10px;
	 
}


.greyDates {
	 font-size: 120%;
	 font-family: 'ReplicaProRegular', sans-serif;
	 color: var(--DarkGrey);
}



a.greybtn {
    text-transform: uppercase;
    font-family: ReplicaProRegular;
    font-size: 1.2rem;
    color: var(--DarkGrey);
    border: 2px solid var(--DarkGrey);
    padding: 12px;
    text-decoration: none;
    
}

a.greybtn:hover {
    color: var(--White);
    border: 2px solid var(--WesBlack);
    background-color: var(--WesBlack);
}





.mission-bg {
    background-color: var(--WesBlack);
}

.mission-bg h2 {
    color: var(--White);
    text-transform: uppercase;
    padding-top: 70px;
    padding-left: 20px;
    font-family: 'ReplicaProBold';
    line-height: .85em;
    margin-bottom: 0;
}


.mission img {
   max-width: 120px;
    margin-top: 0;
    
}

.mission p {
    margin: 30px;
    
}



.goals h2 {
    text-transform: uppercase;
    padding-right: 15px;
    font-family: 'ReplicaProBold';
    line-height: .85em;
    margin-bottom: 0;
    margin-top: 20px;
    text-align: right;
}

.goals p {
    padding: 20px;
}



.goal-list {
    background-color: var(--LightGrey);
    max-width:100%;
}

.goal-list p {
    text-align: center;
    margin: 20px 8%;
}


.goalitem {
   display: flex;
    margin: 30px 20px;
    align-items: center;
}

.goalitem img{
    max-width: 50px;
    margin-top: -2px
}

.goalitem p {
    font-family: ReplicaProRegular;
    text-align: left;
    font-size: 100%;
    margin: 0 0 0 15px;
}

.goalitem a {
    text-decoration: none;
    color: var(--WesBlack);
    display:inherit;
}

.goalitem a:hover {
    text-decoration: underline;
    color: var(--WesRed);
}




.quote {
    padding:0;
    text-align:center;
    font-size: 100%;
}

.goal1-parallax, .goal2-parallax {
    
     background-color: var(--WesBlack);
	 position:relative;
	 width: 100%;
	 min-height: 164px;
	 margin-bottom: 50px;
	 
}


.goal3-parallax {
    
     background-color: var(--WesBlack);
	 position:relative;
	 width: 100%;
	 min-height: 164px;
	 margin-bottom: 50px;
	/* background-position-x: 320px;*/
	 background-attachment: inherit;
	 background-repeat: no-repeat;
	 
}





.goal2-parallax, .goal3-parallax {
     margin-top: 100px;

}



.goal1-parallax h2, .goal2-parallax h2, .goal3-parallax h2{
    color: var(--White);
    font-family: 'ReplicaProBold';
    line-height: .85em;
    text-align: right;
    text-transform: uppercase;
    float: left;
    margin-bottom: 0;
    margin-left: 10%;
    font-size:200%;
}


.goal1-parallax h2, .goal2-parallax h2, .goal3-parallax h2 {
    padding-top: 29px;
}


.featuredstory img{
    width: 100vw;
    padding:0 20px;
}

.featurecaption {
    padding:10px 20px;
    
}

.goal-stories {
    margin-top: 5%;
    
}

.goal-stories a {
    text-decoration: none;
    color: var(--WesBlack);
}


.goal-stories a:hover {
    color: var(--WesRed);
}

.goal-stories a:hover h2, .goal-stories a:hover h3 {
    color: var(--WesRed);
    text-decoration: underline;
}

.goal-stories a:hover img {
    opacity: 0.7;
}


.addStories {
    padding: 10px;
    max-width: 380px;
}

.objectives {
    margin-top: 5%;
}


@media only screen and (min-width: 40em) { 

.banner h1 {
        color: var(--White);
    }
    
    
 .goal1-parallax, .goal2-parallax, .goal3-parallax {
     background-attachment:fixed;
    /* background-position-x: -60px;
     background-position-y: 150px;*/
	 background-repeat: no-repeat;
 }   
 
 

    
.goal1-parallax{
    background-image: url("/strategicplan/images/icons/01_enhance-education.svg");
}

.goal2-parallax {
    background-image: url("/strategicplan/images/icons/02_build-reputation.svg");
}


.goal3-parallax {
    background-image: url("/strategicplan/images/icons/03_increase-access.svg");
}
    
}    



@media only screen and (min-width: 50em) { 

.banner h1 {
        color: var(--White);
        font-size: 300%;
    }
    
h2.large {
	
	 font-size: 400%;
}
    

.blackbg {
    padding: 40px;

}    

.blackbg p {
    max-width: 50%;
}

.greybg {

	 padding:40px;
	 
}
    

.mission-bg h2 {
    padding-left: 50px;
    font-size: 400%;
}    


.mission img {
    max-width: 150px;
    
}

    
.quote {
    padding:40px;
}    
    
    
.goal1-parallax, .goal2-parallax, .goal3-parallax {
	 min-height: 247px;
	 
}   

/* .goal1-parallax, .goal2-parallax, .goal3-parallax {
   background-position-x: -30px;
 } */
 
 
 



.goal1-parallax h2, .goal2-parallax h2, .goal3-parallax h2{
    
    font-size:300%;
}



.goal1-parallax h2, .goal2-parallax h2, .goal3-parallax h2 {
    padding-top: 43px;
}

.flexbox .goals {
    max-width: 50%;
}

.goals h2 {
    font-size: 300%;
} 


.goal-list {
    max-width:50%;
}


    
}    





@media only screen and (min-width: 64em) {

.space {
    margin: 100px auto;
}



.mission img, .mission p {
    flex: 1;
}  

.mission img {
    margin-top: -47px;
    
}

.flexbox .goals {
    max-width: 100%;
}


.goals h2 {
    font-size: 400%;
    padding-right: 30px;
}    

     
.goals, .goal-list {
    flex: 2;
}
  
.goals p {
    max-width: 500px;
    float: right;
    padding: 30px 30px 30px 0;
}

  
.goal-list p {
    max-width: 70%;
  
}  


.goalitem {
    margin: 30px 8%;
    
}


.goal1-parallax, .goal2-parallax, .goal3-parallax {
    
	 min-height: 330px;
	 
}  


  
.goal1-parallax h2, .goal2-parallax h2, .goal3-parallax h2 {
  
    font-size: 400%; 
    margin-left:5%;
}





.goal1-parallax h2, .goal2-parallax h2, .goal3-parallax h2 {
    padding-top: 58px;

}






.featuredstory {
    flex:1;
    background-color:var(--LightGrey);
    padding: 20px 0;
}     


.featurecaption {
    flex:1.25;
    margin:0 80px;
}     

.featuredstory img{
   margin-left:60px;
   width: 100%;
 
}


     
}


@media only screen and (min-width: 80em) {

.goal1-parallax, .goal2-parallax, .goal3-parallax {
    
	 min-height: 411px;
	 
}  
 
 
 .goal1-parallax h2, .goal2-parallax h2, .goal3-parallax h2 {
    font-size: 500%;
    margin-left:10%;
}

.goal1-parallax h2, .goal2-parallax h2, .goal3-parallax h2 {
    padding-top: 70px;

}

}