@charset "UTF-8";
/* CSS Document */

body	{
		font-family: "canada-type-gibson", Arial, sans-serif;
		font-weight: 200;
		font-style: normal;
		font-size: 110%;
		color: #000;
		margin: 0;
}

.mobileNavbar { display: none; }

.red {
	color: #FF0004;
	font-weight: 600;
}

a:link { color: #0a4671; text-decoration: underline; font-weight: 400; }
a:visited { color: #0a4671; text-decoration: underline; }
a:hover { color: #137AC3; text-decoration: none; }
a:active { color: #EB0000; text-decoration: none; }


h1, h2, h3, h4 {
	color: #0a4671;
	font-weight: 600;
	margin-bottom: 0;
	line-height: 1em;
}

h1 { 
	font-size: 2.5em;
	margin-top: 5px;
}

h2 { font-size: 1.7em; }

h3 {font-size: 1.25em;}


h4 { margin-top: 1em; }

.nobr { white-space: nowrap; }

ul { margin-top: 5px; }

#container {
			margin: 0 auto;
			padding: 0;
}

section { padding: 44px 90px; }

.nobr { white-space: nowrap; }

.COElogos { 
	padding: 0 90px 33px 90px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.COElogos img { margin: 0 2vw; }

.COElogo1 { width: 150px;}

.COElogo2 {
	width: 120px;
	position: relative;
	bottom: -5px;
}

.noBotPad { padding-bottom: 0;}

.blueGradient { 
				margin: 0px;
 				background-image: linear-gradient(#fff, #e9f6ff);
}

.yellowBackground {
	background-color: #FFF9E7;
}

.blueBackground {
	background-color: #e9f6ff;
}

.img-fluid {
  			max-width: 100%;
  			height: auto;
}

.smallText { font-size: .75em; }


#navbar	{ 
	margin: 0 auto;
	text-align: center;
	background-color: #0a4671;
	background-image: linear-gradient(#0a4671, #0a0a0a);
	width: 100%;
	height: 14vw;
}


.navitem	{
			display: inline-block;
			width: 9%;
			height: 10vw;
			padding: 1.5vw 1vw;
			background-color: #0a4671;
			background-image: linear-gradient(#0a4671, #0a0a0a);			text-decoration: none;
			text-align: center;
			font-size: 1.4vw;
			vertical-align: middle;
			align-content: center;
	line-height: 1.2em;
			}


.navlist a:link	{ 
				color: #ffffff;
				text-decoration: none;
				}

.navlist a:visited 	{ 
					color: #ffffff;
					text-decoration: none;
					}

.navlist a:hover	{
					color: #ffc60b;
					background-color: #005797;
					background-image: linear-gradient(#0570ba, #0c364c);
					}
				
.navlist a:active 	{ 
					color: #fff;
					background-color: #6e7340;
					}


.navlist img { 
	width: 6vw;
	padding-bottom: .25vw;
}

.item1 { padding-top: 1vw;}
.item2 { padding-top: .5vw;}
.item3 { padding-top: .5vw;}
.item4 { padding-top: .75vw;}
.item5 { padding-top: 0; }
.item6 { padding-top: .75vw;}
.item7 { padding-top: 1.5vw;}
.item8 { padding-top: 0;
		 padding-bottom: .25vw !important;
		 width: 4.5vw !important; }

.newsletterBlurb {
	display: flex;
	align-items: center;
}

.newletterPhoto img { 
	width: 175px;
	margin-right: 1.5vw;
}


footer {
		margin: 0 auto;
		padding: 30px 0;
		text-align: center;
		color: #fff;
		background-color: #0a4671;
		background-image: linear-gradient(#0a4671, #0a0a0a);
		width: 100%;
		align-items: center;
		position: relative;
		border-top: .6vw solid #ffc60b;
}

footer a:link { color: #ffc60b; text-decoration: underline; font-weight: 400; }
footer a:visited { color: #ffc60b; text-decoration: underline; }
footer a:hover { color: #fbe28f; text-decoration: none; }
footer a:active { color: #EB0000; text-decoration: none; }

.footerItems { 
	margin: 0 auto;
	width: 100%; 
	display: flex;
	justify-content: space-evenly;
	align-items: center;
}


/*---------Footer Info styles ---------*/

.footerInfo {
	width: 30%;
	font-size: 1em;
	text-align: center;
}

/*---------Footer Logo styles ---------*/

.footerLogoBox { width: 30%; }

.footerLogoBox img { width: 100px; }


/*---------Footer Button styles ---------*/

.footerButtonBox { 
	width: 30%;
	text-align: center;

}

.footerButton {
	font-size: .8em;
	text-align: center;
	line-height: 1em;
	margin: 0 auto;
	width: 100px;
	background-color: #ffc60b;
	color: #000; 
	border: 3px solid #fff;
	border-radius: 6px;
	padding: 5px 15px 7px 15px;
}

.footerButton a:link { color: #000; text-decoration: none; }
.footerButton a:visited { color: #000; text-decoration: none; }
.footerButton a:hover { color: #EB0000; text-decoration: none; }
.footerButton a:active { color: #fff; text-decoration: none; }

footer .smallText { 
	font-size: .65em;
}



.hero-image-home { 
	display: block;
}

.hero-image { 
	display: block;
	border-top: #ffc60b .6vw solid;
	border-bottom: #ffc60b .6vw solid;
}

.hero-imageMobile { display: none; }

.video-responsive {
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
	margin-top: 20px;
	margin-bottom: 40px;
	box-shadow: 0 7px 9px #b6b0a4;
}

.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
	border: none;
	border-width: 0px;
}

.videoBlurb { width: 100%; }

.author	{
	font-size: .8em;
	font-style: italic;
}


.stats	{
	background-image: url("../images/statBackground.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
	justify-content: space-evenly;
	margin: 0;
	padding: 3vw 0 1vw 0;
	border-top: .6vw solid #ffc60b;
}

.stats img { width: 18%; }

.vision {
	display: flex;
	align-content: space-around; 
	flex-wrap: wrap;
	margin-top: 7vw;
}


.visionBox {
	flex-grow: 1;
	flex-basis: 30%;
	border: #a9cce6 4px solid;
	border-radius: 12px;
	padding: 2.5vw;
	margin: 1.25vw;
	margin-bottom: 5vw;
	background-image: linear-gradient(#fff, #e9f6ff);
}

.visionIconBox {
	width: 100%;
	text-align: center;
	position: relative;
	top: -5vw;
	margin-bottom: 3.5vw;
}

.visionIcon {
	width: 12vw;
	height: auto;
	margin: -8vw auto;
}

.visionBox h3 {
	text-align: center;
}

.teams {
	display: flex;
	align-content: space-around; 
	flex-wrap: wrap;
}

.teamBox {
	flex-grow: 1;
	flex-basis: 30%;
	border: #a9cce6 4px solid;
	border-radius: 12px;
	padding: 2.5vw 2.5vw 1vw 2.5vw;
	margin: 1.25vw;
	background-image: linear-gradient(#fff, #e9f6ff);
}

.teamMembers {
	margin-top: 1vw;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

.teamMember {
	width: 13vw;
	height: 16vw;
	text-align: center;
}

.teamMemberName {
	margin: 0 auto;
	width: 10vw;
	background-color: #0a4671;
	background-image: linear-gradient(#0a4671, #0a0a0a);
	border: #fff 1px solid;
	border-radius: .75vw;
	padding: .75vw;
	color: #fff;
	font-size: 1.5vw;
	font-weight: 400;
	text-align: center;
	line-height: 1.5vw;
	position: relative;
	top: -4.5vw;
	box-shadow: 0 .15vw .3vw 0 rgba(0, 0, 0, 0.2), 0 .15vw .3vw 0 rgba(0, 0, 0, 0.19);
}

.teamMemberName a:link { color: #ffc60b; text-decoration: none; font-weight: 400; }
.teamMemberName a:visited { color: #ffc60b; text-decoration: none; }
.teamMemberName a:hover { color: #fff; text-decoration: none; }
.teamMemberName a:active { color: #EB0000; text-decoration: none; }

.teamLogo {
	width: 200px;
	mix-blend-mode: darken;
	margin: 0 auto;
}

.PCOElogo { 
	width: 150px;
	position: relative;
}

.learningHeroesLogo { 
	width: 125px;
	position: relative;
}


.teamBio { 
	margin-top: 2vw;
	background-color: #e9f6ff;
	border: #a9cce6 4px solid;
	padding: 5vw;
	border-radius: 2vw;
}

.teamPhoto { 
	float: right;
	width: 20vw;
	max-width: 250px;
	height: auto;
	margin-top: 4px;
	margin-left: 35px;
	margin-right: 6px;
	margin-bottom: 35px;
	border: 1px solid #fff;
	border-width: 1.25vw;
	box-shadow: #999 0px 6px 6px;
}

.schoolTransChart {
	width: 100%;
	text-align: center;
}

.schoolTransChart h3 { font-size: 2vw;}


.schoolTransChart img {
	width: 70%;
	margin: 0 auto;
}


.grantee {
	background-color: #fff;
	padding: 0;
	border: #a9cce6 4px solid;
	border-radius: 12px;
	margin-top: 3vw;
}

.granteeInfo {
	background-color: #0a4671;
	color: #fff;
	padding: 5px 30px 10px 30px;
	border-radius: 8px 8px 0 0;
}

.granteeRoundBot { border-radius: 8px; }

.granteeInfo h3 { color: #fff; }

.granteeInfo a:link { color: #ffc60b; text-decoration: underline; font-weight: 400; }
.granteeInfo a:visited { color: #ffc60b; text-decoration: underline; }
.granteeInfo a:hover { color: #fff; text-decoration: none; }
.granteeInfo a:active { color: #eb0000; text-decoration: none; }


.granteeList { padding: 20px 30px 10px 30px; }

.granteeCoLead { color: #a9cce6; }


.tableSched	{
	border: #cccccc medium solid;
	width: 100%;
	border-collapse:collapse;
	margin-top: 2vw;
}

.tableSched tr:nth-of-type(even)	{
  	background-color: #fff;
}

.tableSched tr:nth-of-type(odd)	{
  	background-color: #e9f6ff;
}
		
.tableSched td	{ 
	border: #cccccc thin solid;
	padding: 12px 17px;
}
				
.tableSched th	{ 
	border: #cccccc thin solid;
	padding: 7px 12px;
	background-color: #0a4671;
	font-weight: bold;
	text-align: center;
	color: #fff;
}

.tableSched li  {
    padding-left: -12px;   /* Removes padding */
    margin-left: -12px;    /* Removes margin */
	margin-bottom:10px;
    
  }

.tableSubHeader  {
	background-color: #246fa4 !important;
}

.resTitle a { font-weight: 600; }

.qrCode { 
	width: 72px;
	margin-top: 7px;}

.resourceList li {
	margin-bottom: 12px;
}

.fileSize {
	font-size: .7em;
	color: #666;
}

.comingSoon {
		display: inline-block;
		padding: 7vw 0;
		text-align: center;
		color: #fff;
		background-color: #0a4671;
		background-image: linear-gradient(#0a4671, #0a0a0a);
		width: 100%;
		height: 100%;
		align-items: center;
		font-size: 6vw;
		font-weight: 800;
		line-height: 6vw;
		vertical-align: middle;
}

.comingSoon img {
	width: 22vw;
	margin: 4vw 4vw 40vw 4vw;
}

.comingSoonYellow {
	font-size: .65em;
	color: #ffc60b;
}

.comingSoonFiller {
	height: 1000px;
	background-color: #0a0a0a;
}



.imageVertAlign {
	display: flex;
	align-items: center;
}

.countyMapImage {
	margin-left: 3vw;
	width: 315px;
}


.clockImage {
	margin-left: 3vw;
	width: 161px;
}




.heroArea { display: grid; }

.heroArea img { 
	display: block; } /* to eliminate empty space beneath image */


.videoHolder {
	display: flex;
	flex-wrap: wrap;
}

.videoBox { 
	width: 45%;
	padding: 2vw;
}

.wholeSchoolImage {
	width: 100%;
	max-width: 500px;
  	display: block;
  	margin-left: auto;
  	margin-right: auto;
}




.calendar-section {
	background:url("../images/blueMarbleBackground.jpg")
	no-repeat center center;
    background-size: cover;
}

.calEvents {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
}

.calendar-wrapper {
	display: flex;
	justify-content: center;
	padding: 1vw 0 2vw 0;
	width: 50%;
	margin-left: 5vw;
    }

.calendar-container {
	position: relative;
	width: 100%;
	padding-bottom: 80%;
	height: 0;
	overflow: hidden;
	border: 1px solid #ccc;
	border-radius: 8px;
	background-color: #fff;
	box-shadow: 0 12px 12px rgba(0,0,0,.25);
    }

.calendar-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
    }

.events {
	text-align: left;
	font-weight: 500;
	width: 50%;
}


/* Vital Image Animation Code */
.stack > * {
  grid-area: 1 / 1;
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}


@media screen and (max-width:975px) {	
.videoBox { width: 44%; 
}	
}
	
	
@media screen and (max-width: 750px) {
.calEvents {
	display: flex;
	flex-direction: column; 
}
.calendar-wrapper {
	padding: 1vw 0 2vw 0;
	width: 90%;
	margin-left: 0;
    }
	
	.events { width: 90%; }
}

@media screen and (max-width: 700px) {
	
section { padding: 7vw 9vw; }

.imageVertAlign { flex-direction: column; }
	
.imageVertAlign img { padding-top: 5vw; }

.clockImage {
	margin-left: 0;
	margin-top: 0;
	width: 33vw;
}
	
.stats img { width: 20%; }
	
ol  { padding-left: 4vw; } 
	
.schoolTransChart { margin-top: 7vw;}	
	
.schoolTransChart h3 { font-size: 3.5vw;}

.schoolTransChart img {
	width: 100%;
}
	
.teams { flex-direction: column; }
	
.teamBox {
	flex-grow: 1;
	flex-basis: 30%;
	border: #a9cce6 4px solid;
	border-radius: 12px;
	padding: 4.5vw;
	margin: 1.25vw;
	background-image: linear-gradient(#fff, #e9f6ff);
}
	
.teamBox h4 { margin-bottom: 2vw; }

.teamMember {
	width: 19vw;
	height: 22vw;
}

.teamMemberName {
	width: 12vw;
	padding: 1vw;
	font-size: 2vw;
	line-height: 2.15vw;
	top: -5vw;
}
	
.teamPhoto { 
	width: 25vw;
	margin-left: 25px;
	margin-bottom: 25px;
}
	
.countyMapImage {
	margin-left: 0;
	width: 70vw;
	margin-bottom: 7vw;
}
	
	
.COElogos { 
	padding: 0 90px 10px 90px;
}

.COElogos img { margin: 0 2vw; }

.COElogo1 { width: 150px;}

.COElogo2 {
	mix-blend-mode: darken;
	width: 120px;
	position: relative;
	bottom: -5px;
}
	
.imageVertAlign .COElogos img { padding-top: 1vw; }
	
.videoHolder { flex-direction: column; }

.newsletterBlurb { flex-direction: column; }

	.videoBox { width: 100%; }

.newletterPhoto img { 
	width: 220px;
	margin-right: 0;
}	
}
	





	
@media screen and (max-width: 480px) {

body { font-size: 1.25em; }
	
h1 { font-size: 2em; }
	
h2 { font-size: 1.6em;}

#navbar { display: none; }
	
.mobileNavbar { display: contents; }
	
.mobilNavItem, .accordion	{
				width: 100%;
				height: 4vw;
				padding: 1.75vw 0 4vw 0;
				background-color: #0a4671;
				background-image: linear-gradient(#0a4671, #0a0a0a);		text-decoration: none;
				text-align: center;
				vertical-align: middle;
				font-size: 5vw;
				}
	
.mobilNavItem a:link	{ 
				color: #ffffff;
				text-decoration: none;
				}

.mobilNavItem a:visited 	{ 
				color: #ffffff;
				text-decoration: none;
				}

.mobilNavItem a:hover	{
				color: #ffc60b;
				}
				
.mobilNavItem a:active 	{ 
				color: #fff;
				background-color: #6e7340;
				}
	
.accordion {
	cursor: pointer;
	width: 100%;
	line-height: .5em;
	padding-bottom: 30px;
	border: none;
	outline: none;
	transition: 0.4s;
	font-size: 1.5em;
	color: #ffffff;
}

.active, .accordion:hover {
  background-color: none;
}
	
.menuButton:hover { color: #ffc60b; }

.panel {
  	padding: 0;
	width: 100%;
  	background-color: white;
  	max-height: 0;
  	overflow: hidden;
 	 transition: max-height 0.2s ease-out;
}
	
.hero-image	{ display: none; }

.heroArea { display: none; }
	
.hero-imageMobile	{ 
	display: contents;
	}
	
.hero-imageMobile img {
	border-top: 1.5vw solid #ffc60b;
	border-bottom: 1.5vw solid #ffc60b;
	line-height: 0;
	display: block;
	}
	
section { padding: 7vw; }
	
.footerItems { 
	flex-direction: column;
}
	
.footerInfo {
	width: 80%;
	font-size: .9em;
	margin-top: 20px;
	order: 2;
}

.footerLogoBox { 
	width: 80%;
	margin-top: 20px;
	margin-bottom: 22px;
	order: 3;	
}

.footerLogoBox img { width: 170px; }


.footerButtonBox { 
	width: 80%;
	margin-top: 20px;
	order: 1;
}

.footerButton {
	width: 40%;
	padding: 10px 15px;
}
	
		
.tableSched	{
	width: 80%;
	margin-top: 7vw;
	font-size: 3.25vw;
}
	
.tableSched td	{ padding: 2vw 3vw; }
				
.tableSched th	{ 
	border: #cccccc thin solid;
	padding: 3vw 1vw;
}
	
.tableSched img { width: 20vw; }
	
.clockContainer { text-align: center;}
	
.clockImage { width: 50vw; }

.stats {
	flex-wrap: wrap;
	justify-content: space-evenly;
	padding: 6vw 1vw 3vw 1vw;
	}
	
.stats img { width: 40%; }	
	
.grantee {
	margin-top: 5vw;
}
	
.granteeList ul { padding-left: 22px; }
	
ol  { padding-left: 25px; } 
		
.schoolTransChart h3 { font-size: 7vw; }
	
.vision {
	flex-direction: column;
	margin-top: 7vw;
}

.visionBox {
	flex-grow: 1;
	flex-basis: 30%;
	border: #a9cce6 4px solid;
	border-radius: 12px;
	padding: 5vw;
	margin: 1.25vw;
	margin-bottom: 9vw;
	background-image: linear-gradient(#fff, #e9f6ff);
}

.visionIconBox {
	width: 100%;
	text-align: center;
	position: relative;
	top: -3vw;
	margin-bottom: 5.5vw;
}

.visionIcon {
	width: 25vw;
	height: auto;
	margin: -8vw auto;
}

.visionBox h3 {
	text-align: center;
}

.teamBox {
	padding: 6vw 6vw 2vw 6vw;
	margin: 3.25vw 0 3.25vw 0;
	background-image: linear-gradient(#fff, #e9f6ff);
}
	
.teamBox h4 { margin-bottom: 4vw; }
	
.teamLogo { width: 100%; }

.teamMember {
	width: 50%;
	height: 40vw;
	margin-bottom: 4vw;
}

.teamMemberName {
	width: 60%;
	padding: 1vw 2vw 2vw 2vw;
	font-size: 3.5vw;
	line-height: 4vw;
	top: -12vw;
	border-radius: 1.5vw;
	box-shadow: 0 .60vw 1.2vw 0 rgba(0, 0, 0, 0.2), 0 .60vw 1.2vw 0 rgba(0, 0, 0, 0.19);
}
	
.teamPhoto { 
	float: none;
	width: 73%;
	margin-top: 25px;
	border-width: 3vw;
	box-shadow: #999 0px 6px 6px;
}

.teamBio { margin-top: 7vw; }
	
.teamBio h2 { margin-top: 0; }

.countyMapImage {
	width: 80vw;
	max-width: 400px;
}
	
.imageVertAlign { align-items: stretch; }
	
.imageVertAlign h1 { font-size: 1.75em;
}
}

@media screen and (min-width:1025px) {
	
body	{ font-size: 125%; }	

#navbar	{ 
	height: 150px;
}
	
.navlist img { 
	width: 62px;
	padding-bottom: 5px;
}

.navitem	{
			width: 8%;
			height: 110px;
			padding: 20px;
			font-size: .7em;
			}	
	
.item1 { padding-top: 12px;}
.item2 { padding-top: 8px;}
.item3 { padding-top: 8px;}
.item4 { padding-top: 9px;}
.item5 { padding-top: 0; }
.item6 { padding-top: 8px;}
.item7 { padding-top: 17px;}	

.footerItems { width: 1025px; } 
	
.footerInfo { font-size: .9em; }
	
.teamPhoto { border: 12px solid #fff; }
	
.frameworkChart img { width: 80vh; 
}
}