@import url('https://fonts.googleapis.com/css?family=Muli:200,300,400,400i,500,600,700');
@import url('https://fonts.googleapis.com/css?family=Noto+Serif:300,400,600,700');
@import url('https://fonts.googleapis.com/css?family=Poppins:200,300,400,400i,600,700'); /*Print Lesson button*/

body {font-family:'muli';}

* { margin: 0; padding: 0; }

* {
  overflow-wrap: break-word;  word-wrap: break-word;
  -ms-word-break: break-all;  word-break: break-all;  word-break: break-word;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
}

/******************************************Global Setting**********************************************/
label.sr-only {display:none;}
span.sr-only {display:none;}

a#skiptocontent {
    position: absolute;
    left: 0;
    top: -95px;
    transition: all .2s;
    background-color: #0c63ae;
    color: #fff;
    padding: 10px 15px 14px 15px;
    font-size: 16px;
}
a#skiptocontent:focus {
    top: 0;
    z-index: 2000;
}
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}
.display-flex { /*vertically centered*/
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
.centerV1 {display:flex; align-items:center;}/*vertically centered*/
/*http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/*/
.centerV2 {position:relative; top:50%; transform:translateY(-50%);}
.centerH {display:flex; justify-content:center;}/*horizontally centered*/

a:link, a:visited {color:#004aa5; transition: 0.4s all; text-decoration:none;}
a:hover, a:active, a:focus {color:#419aff;}
footer a:link, footer a:visited {color:#FFF;}

#scroll {
    position:fixed; cursor:pointer;
    right:10px; bottom:10px;
    width:50px; height:50px;
    background-color:#BABABA; opacity:0.5;
    text-indent:-9999px; display:none;
    -webkit-border-radius:12px; -moz-border-radius:12px; border-radius:12px
}
#scroll span {
    position:absolute;
    top:50%; left:50%; height:0; width:0;
    margin-left:-8px; margin-top:-12px;
    border:8px solid transparent;
    border-bottom-color:#FFF; transition:all 0.5s;
}
#scroll:hover {
    background-color:#71a300;
    opacity:1;filter:"alpha(opacity=100)"; -ms-filter:"alpha(opacity=100)";
}

img {display:block; margin:0px; max-width:100%; height:auto;}
	a img {border:none;}

.clear {clear:both;}


/*iframe responsive - used in outreach for vimeo movie*/
#rightwrap1 {float:right; width:60%; margin:0 0 15px -30px;}
/*iframe responsive - used in teacher, soil*/
#rightwrap2 {float:right; width:60%; margin:0 0 15px 10px;}

.video-container {position: relative; height: 0; overflow: hidden;}
.video-container-16x9 {padding-bottom: 56.25%;} /* 16x9 Aspect Ratio */
.video-container-4x3 {padding-bottom:95%;} /* 4x3 Aspect Ratio */
.video-container iframe {
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}


/*******************************************Header************************************************/
header {display:block; background-color:#FFF; height:130px;}
.topwrapper {max-width:1100px; margin:0 auto; position:relative;}

h1.logo {margin:0.5rem; margin-left:1rem; max-width:390px;}

/*Matrix icon links*/
nav.sign_log {position:absolute; top:0.1rem; right:0.5rem}
nav.sign_log ul {padding:0; margin:0;}
nav.sign_log ul li {list-style-type:none; display:inline-block; font-size:1.1rem;}
nav.sign_log a {color:#002a50; font-weight:400; transition:0.4s all; padding:0.3rem; display:inline-block;}
nav.sign_log a:hover {color:#419aff; text-decoration:none;}
nav.sign_log ul {margin-right:0.5rem;}
nav.sign_log a.fa-icon::before {padding-right:5px;}
.fa-icon::before {font-family: FontAwesome;}

/********************************************Main Nav********************************************/
a.navhighlight {background-color:#709cc2;}

nav.main {height:75px; background-color:#002a50; position:relative; box-shadow: 0px 2px 3px #000; z-index:9999;}
#mainnav ul, #mainnav li {list-style:none; padding:0; margin:auto 0; display:inline; height:auto;}
#mainnav ul li {float:left; position:relative; background-color:#002a50; transition:all 0.3s; width:19.9%; margin:0 !important; padding:0 !important;}
#mainnav ul li a {
	text-decoration:none; color:#FFF; font-family:'Muli'; font-size:1.23rem; padding:7px 0 4px 0;
	display:block; text-align:center; white-space:nowrap; transition: background .3s ease-in-out;
}
#mainnav ul li a:hover {opacity:0.8;}
#mainnav ul li:hover {background-color:#709cc2;}
#mainnav ul li div {text-align:center; color:#FFF; font-size:2.2rem; line-height:0; margin-top:3px; margin-bottom:2px;}

#mainnav ul ul{ /*2nd level*/
	font-family:'Muli';
	text-align:left; width:auto; position:absolute; 
	top:-99999px; left:0;
	opacity:0; transition: opacity .5s ease-in-out;
	z-index:497;
	box-shadow:none; margin:0;
	background-color:#709cc2;
}
#mainnav ul li ul li {background-color:#709cc2; opacity:0.9; width:100%;}
#mainnav ul li ul li a {color:#FFF; font-size:0.95rem; margin:0; padding:5px; text-align:left; background:none; line-height:21px !important; text-transform:none;}
#mainnav ul li ul li a:hover {background-color:#002a50; color:#FFF; opacity:1;}
#mainnav ul ul ul { 
	position:absolute; 
	top:-99999px; left:100%; 
	opacity:0; transition:opacity .5s ease-in-out;
}
#mainnav ul li:hover>ul{ opacity: 1; position:absolute; top:100%; left:0; }
#mainnav ul ul li:hover>ul{ position:absolute; top:0; left:100%; opacity: 1; z-index:497;} /*3rd level*/
#mainnav ul li ul li ul li a {color:#FFF; font-size:0.9rem; margin:0; padding:4px; text-align:left; background:none;}

#mobilemenu {display:none;}

/*****************************************************Footer******************************************************/
footer {
width:100%; color:#FFF; vertical-align:top; 
-webkit-flex:1; -ms-flex:1; flex:1;
}
.footrow {max-width:1000px; margin:10px auto;}
.footrow ul li {display:inline-block;}
.footrow ul {list-style:none;}

#footer-top {background-color:#FFF;}
#footer-top .footrow:nth-child(1) {text-align:center; font-size:1.4rem; display:block;}
#footer-top .footrow:nth-child(1) li {width:27px; height:27px; padding:12px; text-align:center; line-height:1.6rem; margin:0 10px 10px 10px; transition:0.3s all; border-radius:100%; border:solid 2px #002b50;}
#footer-top .footrow:nth-child(1) i {color:#002b50;}
#footer-top .footrow:nth-child(1) li a {transition:0.3s all; color:#002b50;}
#footer-top .footrow:nth-child(1) li a:hover {transform: scale(1.05);}
#footer-top .footrow:nth-child(1) li:hover {transform: scale(1.05);}

#footer-bottom {background-color:#002b50; padding:15px 5px;}
#footer-bottom .footrow:nth-child(1) organization {margin:5px 0; color:#FFF; font:1.5em/1.4 "Lucida Sans Unicode", "Lucida Grande", sans-serif; text-transform:uppercase;}
#footer-bottom .footrow:nth-child(2) {text-align:center; border-bottom:solid 1px #FFF; height:28px;}
#footer-bottom .footrow:nth-child(2) a {text-decoration:none; font-size:1.0rem; line-height:1.5rem; font-weight:300; padding:10px; text-transform:uppercase; font-family:'Muli', sans-serif;}
#footer-bottom .footrow:nth-child(2) a:hover {color:#00baff;}
#footer-bottom .footrow:nth-child(2) li::after {content:" ⋅"; font-size:1.3rem; color:#FFF;}
#footer-bottom .footrow:nth-child(2) li:last-child::after {display:none;}
#footer-bottom .footrow:nth-child(3) {text-align:right;}
#footer-bottom .footrow:nth-child(3) address {color:#FFF; font:1.0em/1.2 'Muli', sans-serif; margin:2px 8px 15px 0;}

/**********************List Links**************************/
.subpage ul.listlink {margin:0 0.5rem 1.5rem 3.1rem;}
/*.subpage ul.listlink.br {margin-bottom:0 !important;}*/
.subpage ul.listlink li {list-style-type:none; margin:0; line-height:1.48rem; padding:2px 0;}
.subpage ul.listlink li a {padding:10px 0; position:relative;}
.subpage ul.listlink li a::before {
  content:"\f0da"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:10px;
  transition:all .2s;
}
.subpage ul.listlink li a:hover::before {left:-10px; color:#419aff;}
.subpage ul.listlink li span {margin-left:1.5rem; display:block;}

.subpage ul.listlink li a.largefont {font-size:1.35rem; line-height:1.65rem;}
.subpage ul.listlink li a.largefont::before {font-size:1.4rem; top:12px;}

.subpage ul.listlink li.nolink {list-style-type:none; margin-left:0; line-height:1.48rem; padding:4px 0; position:relative;}
.subpage ul.listlink li.nolink::before {
  content:"\f0da"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:4px;
}
.subpage ul.listlink li.nosublink {list-style-type:none; margin-left:0; line-height:1.48rem; padding:4px 0; position:relative;}
.subpage ul.listlink li.nosublink::before {
  content:"\f105"; font-size:1.0rem;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:4px;
  transition:all .2s;
}

/*sublevel*/
.subpage ul.listlink li ul {margin:0.1rem 0 0 1rem;}
.subpage ul.listlink li ul li {padding:1px 0;}
.subpage ul.listlink li ul li a::before {content:"\f105"; font-size:1.0rem;}
.subpage ul.listlink li ul li.nolink {list-style-type:none; margin-left:0; line-height:1.48rem; padding:1px 0; position:relative;}
.subpage ul.listlink li ul li.nolink::before {
  content:"\f105"; font-size:1.0rem;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:0;
}

/*no bullet on links*/
.subpage ul.listlink li a.nobullet {padding:0; position:static;}
.subpage ul.listlink li a.nobullet::before {content:none;}


/***********************************Anchor Links*************************************/
/*anchor links at the top*/
.anchorlinks ul {list-style:none; margin-left:20px; text-align:center;}
.anchorlinks ul li {display:inline-block;}
.anchorlinks ul li a {
  padding: 5px 20px;
  display: block;
  position: relative;
  text-decoration: none;
}
.anchorlinks ul li a::before {
  content:"\f13a"; font-size:1.3rem; color:#002a50;
  font-family:FontAwesome;
  position:absolute;
  left:0;
  transition:all .2s;
  top:7px;
}
.anchorlinks ul li a:hover::before {top:9px; color:#419aff;}

/***********************************Go Back link***************************************/
.goback {margin:-2rem 1rem 0 1rem; position:relative; clear:both; float:right;}
.goback a {padding:3px 25px; position:relative; font-size:1.23rem; line-height:1.4rem;}
.goback a::before {
  content:"\f04a"; font-size:1.23rem;
  font-family:FontAwesome;
  position:absolute;
  left:-3px; top:5px;
  transition:all .2s;
}
.goback a:hover::before {left:-7px; color:#419aff;}

/*********************************Button & Field***************************************/
.buttonwrap {display:inline-grid; grid-gap:2px; margin:2rem;}
.buttonwrap > div {display:flex; justify-content:center; align-items:center;}
.button {
  font-size:1.0rem; line-height:1.0rem; text-align:center; color:#FFF;
  border-radius:4px; display:block;
  border:none; background-color:#002a50;
  padding:6px 20px;
  transition: all 0.5s;
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); cubic-bezier(.25,.8,.25,1);
  
}
.buttonwrap > div.deadline {margin:0 auto; font-weight:300; font-size:1.15rem; text-align:center; color:#CB0003;}
.button:hover {background-color:#419aff;}
.button a {color:#FFF !important; }
.button span {cursor: pointer;
  display:block;
  position: relative;
  transition: 0.5s;}
.button span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}
.button:hover span {padding-right:15px;}
.button:hover span:after {opacity: 1; right:-10px;}

.field {border-radius:3px; border:solid 2px #c8c8c8; height:27px; transition:0.3s all; font-size:1.0rem;}
.field:hover {background-color:aliceblue;}

.button400 {width:400px;}

/**************************************************HOMEPAGE******************************************************/
.homewrapper {max-width:1100px; margin:0 auto;}

.homecol {-webkit-flex: 1; -ms-flex: 1; flex: 1;
  position:relative; background-color:#FFF;
  border:1px solid rgba(0,0,0,.2); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  border-bottom-right-radius:3px; border-bottom-left-radius:3px;
  transition:all 0.3s;
}

#home-columns .homecol:nth-child(1),
#home-columns .homecol:nth-child(2) {margin-right:20px;}

.homecol .featured-pic {height:220px; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;}
.homecol .featured-pic:hover {opacity:0.8;}

.homecol img {transition:all 0.3s;}
.homecol img:hover {opacity:0.8;}

#home-columns .homecol:nth-child(1) .featured-pic {background-image: url(../images/home/feature.jpg);}

.topbar {
top:6px; left:50%; background-color:#3c7925;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
position:absolute;
text-align:center;
width:100.2%; height:15px; 
}
.homecol h2 {text-align:center; font-weight:500; font-size:1.7rem; line-height:1.9rem; font-family:'Noto Serif';
  height:25px; margin:2.5rem 0.2rem 2rem 0.2rem; color:#002a50; transition:all 0.3s;
  align-items:center; justify-content:center; display:flex; flex-direction: row; flex-wrap: wrap;}
.homecol h2:hover {color:#419aff;}

section#home-columns {margin-top:calc(5vh + 5px);}

section.section {margin:5vh 0;}

.link-box {margin:1.5rem;}
.link-box ul {list-style:none;}
.link-box ul li a {padding:5px 10px 5px 15px; display:block; position:relative; font-size:1.1rem;}
.link-box ul li a::before {
  content:"\f0da"; font-family:FontAwesome; font-size:1.3rem; line-height:1.4rem;
  position:absolute;
  top:5px; left:2px;
  transition:all .3s;
}
.link-box ul li a:hover::before {left:6px; color:#419aff;}

.matrixBwrap {display: inline-grid; grid-gap:2px;}
.matrixBwrap > div {display:flex; justify-content:center; align-items:center;}
.matrixgrid {display:grid; grid-template-columns:220px 115px; margin:0 0 1.3rem 0.53rem;}
.matrixF {width:220px;}
.matrixB {width:115px;}

/*odometer*/
#impactnumbers {width:100%; background-color:#002a50; vertical-align:top; -webkit-flex:1; -ms-flex:1; flex:1; font-family:'proxima-nova', sans-serif;}
#impactnumbers .impactspace {padding:3rem 1.5rem 0 1.5rem;}
#impactnumbers .impact_statement {font-size:1.7rem; line-height:1.9rem; margin:0 auto; font-weight:300; text-align:center; color:#FFF; margin:0 auto; text-transform:uppercase;}

.impactwrap {max-width:1100px; margin:0 auto; padding-bottom:1rem; text-align:center;}
.impactgrid {display:grid; grid-template-columns:repeat(3, 1fr); grid-gap:1rem; margin:2rem 0;}
.impactgrid > div {pading:0 1rem; text-align:center; font-size:1.4rem; color:#FFF; text-transform:uppercase;}
.impactgrid > div.odometer {font-size:4.6rem;}

/*Mailing List*/
#mailist {background: url(../images/default/bg_mailist.jpg) no-repeat center center fixed; background-size:cover;}
#mailist > div {padding:3rem 0;}
#mailist h3 {font-family:'Noto Serif' !important; font-size:2.2rem; line-height:2.4rem; font-weight:400; color:#002a52; text-align:center; margin:0 2rem 2rem 2rem;}
.ctct-inline-form {width:50%; text-align:left;}

#slideshow {z-index:0; background:#FFF;}

/**************************************************Landing Pages******************************************************/
.landingcol {-webkit-flex:1; -ms-flex:1; flex:1; position:relative; border-right:1px solid rgba(0,0,0,.2); border-left:1px solid rgba(0,0,0,.2); border-bottom:1px solid rgba(0,0,0,.2);
border-bottom-left-radius:3px; border-bottom-right-radius:3px;}

#landing-columns1 .landingcol:nth-child(1),
#landing-columns1 .landingcol:nth-child(2) {margin-right:calc(1vh + 10px);}
#landing-columns2 .landingcol:nth-child(1),
#landing-columns2 .landingcol:nth-child(2) {margin-right:calc(1vh + 10px);}
#landing-columns3 .landingcol:nth-child(1),
#landing-columns3 .landingcol:nth-child(2) {margin-right:calc(1vh + 10px);}
#landing-columns4 .landingcol:nth-child(1),
#landing-columns4 .landingcol:nth-child(2) {margin-right:calc(1vh + 10px);}

#landing-twocolumns1 .landingcol:nth-child(1) {margin-right:calc(1vh + 10px);}
#landing-twocolumns2 .landingcol:nth-child(1) {margin-right:calc(1vh + 10px);}
#landing-twocolumns3 .landingcol:nth-child(1) {margin-right:calc(1vh + 10px);}

.landingcol h3 {
  text-align:center; font-family:'Noto Serif'; color:#002a52; transition:all 0.3s;
  font-size:1.6rem !important; line-height:1.8rem !important; font-weight:500; height:80px; margin:1rem !important;
  align-items:center; justify-content:center; display:flex; flex-direction:row; flex-wrap:wrap;  
}
.landingcol h3:hover { color:#419aff;}
.landingcol a:hover {text-decoration:none;}

.landingbox {margin:1.5rem;}

.topbar {
top:0; left:50%; background-color:#002a52;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
position:absolute;
text-align:center;
width:100.6%; height:12px; 
}

section#landing-columns1,
section#landing-columns2,
section#landing-columns3,
section#landing-columns4,
section#landing-twocolumns1,
section#landing-twocolumns2,
section#landing-twocolumns3 {margin:calc(3vh + 10px) calc(1vh + 10px);}

/************Two Cols*************/
/*about*/
.about_impact {font-family:'Noto Serif'; font-size:1.45rem; line-height:1.55rem; font-weight:400; text-align:center; margin:0 0.5rem 0.5rem 0.5rem;}
.aboutgrid {display:grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); margin-bottom:1.5rem;}
.aboutgrid > div {padding:1rem 0.2rem 1rem 0.2rem; text-align:center; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); background-color:#002a52; color:#FFF; font-size:1.1rem; line-height:1.2rem;}
.aboutgrid > div i {font-size:4.5rem; margin-bottom:0.8rem;}

.landingcol h3.about_head {font-size:2.3rem !important; line-height:2.5rem !important; font-weight:500; height:90px; margin:1rem 1rem 0.2rem 1rem !important;}
.landingcol ul.about1 {margin:0 1rem 1.5rem 2.5rem;}
.landingcol ul.about1 li {list-style-type:none; margin:0; font-size:1.2rem; line-height:1.55rem; padding:10px 5px 10px 35px; position:relative;}
.landingcol ul.about1 li.news::before {
  content:"\f1ea"; font-size:2.1rem; color:#002a52;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:16px;
}
.landingcol ul.about1 li.cart::before {
  content:"\f07a"; font-size:2.3rem; color:#002a52;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:15px;
}

.about_ut {font-family:'Noto Serif'; font-size:1.55rem; line-height:1.75rem; font-weight:400; text-align:center; margin:1rem 1rem 0 1rem;}
.landingcol ul.about2 {margin:0 1rem 1.5rem 4rem;}
.landingcol ul.about2 li {list-style-type:none; margin:0; font-size:1.2rem; line-height:1.55rem; padding:0 5px 10px 35px; position:relative;}
.landingcol ul.about2 li.auth::before {
  content:"\f51c"; font-size:2.8rem; color:#007d36;
  font-family:FontAwesome;
  position:absolute;
  left:-33px; top:20px;
}
.landingcol ul.about2 li.exp::before {
  content:"\f610"; font-size:3rem; color:#c21c22;
  font-family:FontAwesome;
  position:absolute;
  left:-33px; top:20px;
}
.landingcol ul.about2 li.access::before {
  content:"\f15c"; font-size:2.9rem; color:#8a7e6c;
  font-family:FontAwesome;
  position:absolute;
  left:-25px; top:20px;
}

/*Garden Center*/
.landingcol .garden-pic {height:250px; background-position: center; background-size: cover; background-repeat: no-repeat;}
.garden-pic:hover {opacity:0.8; transition: all 0.4s;}
#landing-columns1 .landingcol:nth-child(1) .garden-pic {background-image: url(../images/garden/funding.jpg);}
#landing-columns1 .landingcol:nth-child(2) .garden-pic {background-image: url(../images/garden/recruiting.jpg);}
#landing-columns1 .landingcol:nth-child(3) .garden-pic {background-image: url(../images/garden/summer.jpg);}
#landing-columns2 .landingcol:nth-child(1) .garden-pic {background-image: url(../images/garden/connections.jpg);}
#landing-columns2 .landingcol:nth-child(2) .garden-pic {background-image: url(../images/garden/resources.jpg);}
#landing-columns2 .landingcol:nth-child(3) .garden-pic {background-image: url(../images/garden/theme.jpg);}
#landing-columns3 .landingcol:nth-child(1) .garden-pic {background-image: url(../images/garden/basics.jpg);}
#landing-columns3 .landingcol:nth-child(2) .garden-pic {background-image: url(../images/garden/safety.jpg);}
#landing-columns3 .landingcol:nth-child(3) .garden-pic {background-image: url(../images/garden/indoor.jpg);}
#landing-columns4 .landingcol:nth-child(1) .garden-pic {background-image: url(../images/garden/outdoor.jpg);}
#landing-columns4 .landingcol:nth-child(2) .garden-pic {background-image: url(../images/garden/childrens.jpg);}
#landing-columns4 .landingcol:nth-child(3) .garden-pic {background-image: url(../images/garden/art.jpg);}

/*Hatching Center*/
.landingcol .hatching-pic {height:250px; background-position: center; background-size: cover; background-repeat: no-repeat;}
.hatching-pic:hover {opacity:0.8; transition: all 0.4s;}
#landing-columns1 .landingcol:nth-child(1) .hatching-pic {background-image: url(../images/hatching/sourcing.jpg);}
#landing-columns1 .landingcol:nth-child(2) .hatching-pic {background-image: url(../images/hatching/incubators.jpg);}
#landing-columns1 .landingcol:nth-child(3) .hatching-pic {background-image: url(../images/hatching/sanitation.jpg);}
#landing-columns2 .landingcol:nth-child(1) .hatching-pic {background-image: url(../images/hatching/candling.jpg);}
#landing-columns2 .landingcol:nth-child(2) .hatching-pic {background-image: url(../images/hatching/problems.jpg);}
#landing-columns2 .landingcol:nth-child(3) .hatching-pic {background-image: url(../images/hatching/brooding.jpg);}
#landing-columns3 .landingcol:nth-child(1) .hatching-pic {background-image: url(../images/hatching/health.jpg);}
#landing-columns3 .landingcol:nth-child(2) .hatching-pic {background-image: url(../images/hatching/finding.jpg);}
#landing-columns3 .landingcol:nth-child(3) .hatching-pic {background-image: url(../images/hatching/resources.jpg);}
#landing-twocolumns1 .landingcol:nth-child(1) .hatching-pic {background-image: url(../images/hatching/size.jpg);}
#landing-twocolumns1 .landingcol:nth-child(2) .hatching-pic {background-image: url(../images/hatching/buying.jpg);}

/*Utah Lessons*/
.landingcol .utlessons-pic {height:245px; background-position: center; background-size: cover; background-repeat: no-repeat;}
.utlessons-pic:hover {opacity:0.8; transition: all 0.4s;}
#landing-columns1 .landingcol:nth-child(1) .utlessons-pic {background-image: url(../images/lessons/index/studies.jpg);}
#landing-columns1 .landingcol:nth-child(2) .utlessons-pic {background-image: url(../images/lessons/index/history.jpg);}
#landing-columns1 .landingcol:nth-child(3) .utlessons-pic {background-image: url(../images/lessons/index/agmap.jpg);}
.utlessons {margin:1rem 0.3rem;}
.utlessons ul {list-style:none;}
.utlessons ul li {padding:6px 0;}
.utlessons ul li a {padding:3px 0; position:relative; font-size:1.2rem; line-height:1.4rem;}
.utlessons ul li a::before {
  content:"\f15c"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:-1.5rem; top:5px;
  transition:all .2s;
}
.utlessons ul li a:hover::before {color:#419aff;}
.utlessons ul li ul {margin-left:0.5rem;}
.utlessons ul li ul li {padding:0; line-height:0 !important;}
.utlessons ul li ul li a {padding:0; position:relative; font-size:1.05rem; line-height:1.05rem;}
.utlessons ul li ul li a::before {content:"\f105";
  left:-0.8rem; top:2px;
  transition:all .2s;}
.utlessons ul li ul li a:hover::before {left:-0.5rem;}

/*Student Center*/
.landingcol .student-pic {height:225px; background-position: center; background-size: cover; background-repeat: no-repeat;}
.student-pic:hover {opacity:0.8; transition: all 0.4s;}
#landing-columns1 .landingcol:nth-child(1) .student-pic {background-image: url(../images/student/index/ag.jpg);}
#landing-columns1 .landingcol:nth-child(2) .student-pic {background-image: url(../images/student/index/games.jpg);}
#landing-columns1 .landingcol:nth-child(3) .student-pic {background-image: url(../images/student/index/student.jpg);}
#landing-twocolumns1 .landingcol:nth-child(1) .student-pic {background-image: url(../images/student/index/state.jpg); height:300px;}
#landing-twocolumns1 .landingcol:nth-child(2) .student-pic {background-image: url(../images/student/index/county.jpg); height:300px;}

/*Workshop*/
.landingcol .workshops-pic {height:225px; background-position: center; background-size: cover; background-repeat: no-repeat;}
.workshops-pic:hover {opacity:0.8; transition: all 0.4s;}
#landing-columns1 .landingcol:nth-child(1) .workshops-pic {background-image: url(../images/workshops/index/elementary.jpg);}
#landing-columns1 .landingcol:nth-child(2) .workshops-pic {background-image: url(../images/workshops/index/secondary.jpg);}
#landing-columns1 .landingcol:nth-child(3) .workshops-pic {background-image: url(../images/workshops/index/flp.jpg);}

/**************************************************Sub Page 3 Cols******************************************************/
.subcol {-webkit-flex:1; -ms-flex:1; flex:1; position:relative; border-right:1px solid rgba(0,0,0,.2); border-left:1px solid rgba(0,0,0,.2); border-bottom:1px solid rgba(0,0,0,.2);
border-bottom-left-radius:3px; border-bottom-right-radius:3px;}

#sub-columns1 .subcol:nth-child(1),
#sub-columns1 .subcol:nth-child(2) {margin-right:calc(1vh + 10px);}
#sub-columns2 .subcol:nth-child(1),
#sub-columns2 .subcol:nth-child(2) {margin-right:calc(1vh + 10px);}
#sub-columns3 .subcol:nth-child(1),
#sub-columns3 .subcol:nth-child(2) {margin-right:calc(1vh + 10px);}
#sub-columns4 .subcol:nth-child(1),
#sub-columns4 .subcol:nth-child(2) {margin-right:calc(1vh + 10px);}
#sub-twocolumns1 .subcol:nth-child(1) {margin-right:calc(1vh + 10px);}

.subcol h3 {
  text-align:center; font-family:'Noto Serif'; transition:all 0.3s;
  font-size:1.5rem !important; line-height:1.6rem !important; font-weight:500;
  height:50px; margin:1rem !important;
  align-items:center; justify-content:center; display:flex;
  flex-direction:row; flex-wrap:wrap;  
}
.subcol h3:hover {color:#419aff !important;}

.subcol h4 {
  text-align:center; font-family:'Noto Serif'; transition:all 0.3s;
  font-size:1.5rem !important; font-weight:500; color:#002a52;
  height:50px; margin:1rem !important;
  align-items:center; justify-content:center; display:flex;
  flex-direction:row; flex-wrap:wrap;  
}
.subcol h4:hover {color:#419aff !important;}
.subcol a:hover {text-decoration:none;}

.subcol:nth-child(1) .harvestbar {background-color:#6b5daa;}
.subcol:nth-child(2) .harvestbar {background-color:#f09a1f;}
.subcol:nth-child(3) .harvestbar {background-color:#8bb841;}

.topbar {
top:0; left:50%; background-color:#002a52;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
position:absolute;
text-align:center;
width:100.6%; height:12px; 
}

.subcolbox {margin:1.5rem;}

.subcol img {transition:all 0.3s; margin:0 auto; text-align:center;}
.subcol img:hover {opacity:0.8;}

.subcol ul {margin:1rem 1rem 1.5rem 2.2rem !important;}
.subcol ul li {list-style-type:none; margin:0; line-height:1.48rem; padding:2px 0;}
.subcol ul li a {padding:10px 0; position:relative;}
.subcol ul li a::before {
  content:"\f0da"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:11px;
  transition:all .2s;
}
.subcol ul li a:hover::before {left:-10px; color:#419aff;}
.subcol ul li.nolink {list-style-type:none; margin-left:0; line-height:1.48rem; padding:4px 0; position:relative;}
.subcol ul li.nolink::before {
  content:"\f0da"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:4px;
  transition:all .2s;
}

section#sub-columns1,
section#sub-columns2,
section#sub-columns3,
section#sub-columns4,
section#sub-twocolumns1 {margin:calc(2vh + 10px) calc(1vh + 10px);}

/*outreach/harvest*/
.subcol .harvest-pic {height:180px; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;}
.subcol .harvest-pic:hover {opacity:0.8;}
#sub-columns1 .subcol:nth-child(1) .harvest-pic {background-image:url(../images/outreach/harvest/farmfork.jpg);}
#sub-columns1 .subcol:nth-child(2) .harvest-pic {background-image:url(../images/outreach/harvest/crop.jpg);}
#sub-columns1 .subcol:nth-child(3) .harvest-pic {background-image:url(../images/outreach/harvest/resources.jpg);}
#sub-columns2 .subcol:nth-child(1) .harvest-pic {background-image:url(../images/outreach/harvest/taste.jpg);}
#sub-columns2 .subcol:nth-child(2) .harvest-pic {background-image:url(../images/outreach/harvest/recipes.jpg);}
#sub-columns2 .subcol:nth-child(3) .harvest-pic {background-image:url(../images/outreach/harvest/garden.jpg);}

/*courses/test*/
.subcol h5.course {
  text-align:center; font-family:'Noto Serif'; color:#002a52; transition:all 0.3s;
  font-size:1.9rem; line-height:2.1rem; font-weight:500;
  height:40px; margin:1.5rem 0.5rem !important;
  align-items:center; justify-content:center; display:flex;
  flex-direction:row; flex-wrap:wrap;  
}
.subcol .flp {font-size:1.3rem; text-align:center; margin:0 1rem 0.5rem 1rem;}
.subcol .pf {font-style:italic; text-align:center;}

/*lessons/cc*/
.blackbg {background-color:#000;}
.subcol h4.cc {
  text-align:center; font-family:'Noto Serif'; color:#FAD58D; transition:all 0.3s;
  font-size:1.3rem; line-height:1.5rem; font-weight:400;
  height:70px; margin:1.5rem 0.5rem !important;
  align-items:center; justify-content:center; display:flex;
  flex-direction:row; flex-wrap:wrap;  
}
.subcol .cc_desc {color:#FFF; margin:1.5rem 1rem; font-size:0.9rem !important; line-height:1.3rem !important; font-weight:300 !important;}

/*teacher/nie*/
.subcol h4.nie {height:70px;}
.subcol img.nie {margin-top:0.4rem;}

/**************************************************Sub Page 4 Cols******************************************************/
.sub4col {-webkit-flex:1; -ms-flex:1; flex:1; position:relative; border-right:1px solid rgba(0,0,0,.2); border-left:1px solid rgba(0,0,0,.2); border-bottom:1px solid rgba(0,0,0,.2);
border-bottom-left-radius:3px; border-bottom-right-radius:3px;}

#sub4-columns1 .sub4col:nth-child(1),
#sub4-columns1 .sub4col:nth-child(2),
#sub4-columns1 .sub4col:nth-child(3) {margin-right:calc(1vh + 10px);}
#sub4-columns2 .sub4col:nth-child(1),
#sub4-columns2 .sub4col:nth-child(2),
#sub4-columns2 .sub4col:nth-child(3) {margin-right:calc(1vh + 10px);}
#sub4-columns3 .sub4col:nth-child(1),
#sub4-columns3 .sub4col:nth-child(2),
#sub4-columns3 .sub4col:nth-child(3) {margin-right:calc(1vh + 10px);}
#sub4-twocolumns1 .sub4col:nth-child(1) {margin-right:calc(1vh + 10px);}

.sub4col h4 {
  text-align:center; font-family:'Noto Serif'; transition:all 0.3s;
  font-size:1.5rem !important; font-weight:500;
  height:50px; margin:1rem !important;
  align-items:center; justify-content:center; display:flex;
  flex-direction:row; flex-wrap:wrap;  
}
.sub4col h4:hover {color:#419aff !important;}

.sub4col img {transition:all 0.3s; margin:0 auto; text-align:center;}
.sub4col img:hover {opacity:0.8;}

.sub4col ul {margin:1rem 1rem 1.5rem 2.4rem !important;}
.sub4col ul.twocols {margin:1.5rem auto !important; text-align:center;}
.sub4col ul li {list-style-type:none; margin:0; line-height:1.48rem; padding:2px 0;}
.sub4col ul li a {padding:10px 0; position:relative;}
.sub4col ul li a::before {
  content:"\f0da"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:11px;
  transition:all .2s;
}
.sub4col ul li a:hover::before {left:-10px; color:#419aff;}

/**************************************************SUBPAGE******************************************************/
.subpage {max-width:1100px; background-color:#FFF; margin:calc(6vh + 5px) auto; font-size:1.1rem; line-height:1.55rem; font-weight:400;}
.subpage hr {height:1px; margin-bottom:4rem; border:0; background-image: linear-gradient(to right, #FFF, #002a52, #FFF);}
.subpage hr.aboveh3 {margin-bottom:0;}

.subpage h2 {font-family:'Noto Serif'; font-size:3.5rem; line-height:3.5rem; font-weight:400; color:#002a52; letter-spacing:0.05rem; text-shadow:1px 1px 1px #959595; text-align:center; /*border-bottom: 2px solid #002a52;*/}

.subpage h3 {font-family:'Noto Serif'; font-size:2.3rem; line-height:2.5rem; font-weight:400; margin:1.5rem 1rem 0.5rem 0.1rem; color:#002a52;}
.subpage h3.underhr {text-align:center; margin:0.17rem auto 3rem auto;}

.subpage h4 {font-family:'Noto Serif'; font-size:1.8rem; line-height:1.95rem; font-weight:400; margin:0.7rem 1rem 0.5rem 0.8rem;}
.subpage h5 {font-family:'Noto Serif'; font-size:1.5rem; line-height:1.7rem; font-weight:400; margin:0.7rem 1rem 0.5rem 1.5rem;}
.subpage h6 {font-size:1.3rem; line-height:1.5rem; font-weight:400; margin:0.7rem 1rem 0.5rem 1.5rem;}
.subpage h3.smallh3 {font-size:2.0rem; line-height:2.2rem; margin:1.2rem 1rem 0.3rem 0.5rem;}
.subpage h4.smallh4 {font-size:1.6rem; line-height:1.8rem; font-weight:300; margin:0.7rem 1rem 0.5rem 1.0rem;}

.subpage p {margin:0 1rem 1.5rem 1.8rem;}
.subpage p.br {margin:0 1rem 0.2rem 1.8rem;}
.subpage p.largep {font-size:1.3rem; line-height:1.8rem;}

.center {margin:15px 0; text-align:center;}

.subpage ul, .subpage ol {margin:0 1rem 1.5rem 3rem;}
.subpage ul ul, .subpage ol ul, .subpage ul ol  {margin:0 1rem 0 1.2rem;}

.subpage .contactinfo {font-size:1.3rem; line-height:1.7rem; margin:0.7rem 0.5rem 1.5rem 2rem;}

/*****about/staff Grid*****/
.staffgrid {display:grid; grid-gap:1rem; grid-template-columns:200px auto;}
.staffgrid > div {padding:1rem;}
.staffgrid .staff_title {font-family:'Noto Serif'; font-size:1.8rem; line-height:2.0rem; font-weight:400; margin-bottom:0.5rem;}
.staffgrid .staff_name {font-family:'Noto Serif'; font-size:1.6rem; line-height:1.7rem; font-weight:400; margin-bottom:0.4rem;}
.staffgrid .staff_contact {font-size:1.3rem; line-height:1.5rem;}
.staffgrid .staff_desc {}

/*****2 Grids - cca *****/
.res2grid {display:grid; grid-template-columns:repeat(2, minmax(1px, 100%)); grid-gap:1.5rem; margin:0 1rem;}
.res2grid > div {
  margin:5px auto; padding:1rem;
  background-color:#FAFAFA; border-top:48px solid #002a52;
  border-bottom-right-radius:7px; border-bottom-left-radius:7px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
.res2grid > div h4 {margin:-57px 0 18px 0; color:#FFF; text-align:center; font-size:1.55rem;}
.res2grid .grade {font-size:1.5rem; margin:1.4rem 0 0.5rem 0;}
.res2grid .media {font-size:1.3rem; margin:0.2rem 0 0.5rem 0;}
.res2grid .product_desc {}
.res2grid img {margin:0.5rem 0.5rem 1rem 1rem; float:right; width:200px; box-shadow: 3px 3px 4px #777;}
.res2grid > div ul {list-style-type:none; margin:0.5rem 0 1rem 0.8rem;}
.res2grid > div ul li {padding:3px 0;}
.res2grid > div ul li a {padding:0 5px 0 15px; font-size:1.25rem; display:block; position:relative;}
.res2grid > div ul li a::before {
  content:"\f0da"; font-size:1.25rem;
  font-family:FontAwesome;
  position:absolute;
  left:3px; top:0;
  transition:all .3s;
}
.res2grid > div ul li a:hover::before {left:8px;}
/*sublevel*/
.res2grid > div ul li ul {margin-bottom:0 !important;}
.res2grid > div ul li ul li a::before {content:"\f105"; font-size:1.0rem;}

/*****Inter-Ag-tion Grid*****/
.agtiongrid {display:grid; grid-template-columns:390px auto; grid-gap:1rem;}
.agtiongrid > div {padding:0.5rem;}
.agtiongrid > div.bookmark {margin-top:2rem;}
.agtiongrid > div > div.sub_question {margin:0 1rem 0.3rem 0.6rem;}
.agtiongrid .question {font-size:1.4rem; line-height:1.6rem; font-family:'Noto Serif'; font-style:italic; margin-bottom:0.5rem;}
.agtiongrid ol {margin-bottom:0.5rem;}

.icon_website {margin:0 1.5rem 2.5rem 2.5rem;}
.icon_website a {padding:3px 0; position:relative;}
.icon_website a::before {
	  content:"\f108"; font-size:1.2rem;
	  font-family:FontAwesome;
	  position:absolute;
	  left:-1.75rem; top:4px;
	  transition:all .2s;
	}
.icon_website a:hover::before {color:#419aff;}

.icon_movie {margin:0 1.5rem 2.5rem 2.5rem;}
.icon_movie a {padding:3px 0; position:relative;}
.icon_movie a::before {
	  content:"\f431"; font-size:1.4rem;
	  font-family:FontAwesome;
	  position:absolute;
	  left:-1.7rem; top:3px;
	  transition:all .2s;
	}
.icon_movie a:hover::before {color:#419aff;}

.icon_ppt {margin:0 1.5rem 2.5rem 2.5rem;}
.icon_ppt a {padding:3px 0; position:relative;}
.icon_ppt a::before {
	  content:"\f1c4"; font-size:1.4rem;
	  font-family:FontAwesome;
	  position:absolute;
	  left:-1.7rem; top:3px;
	  transition:all .2s;
	}
.icon_ppt a:hover::before {color:#419aff;}

.icon_map {}
.icon_map ul {list-style:none; margin:0 1.5rem 2.5rem 2.5rem;}
.icon_map ul li {padding:2px 0;}
.icon_map ul li a {padding:4px 0; position:relative;}
.icon_map ul li a::before {
	  content:"\f3c5"; font-size:1.4rem;
	  font-family:FontAwesome;
	  position:absolute;
	  left:-1.7rem; top:4px;
	  transition:all .2s;
	}
.icon_map ul li a:hover::before {color:#419aff;}


/*****Garden & Hatching Center Nav Grid*****/
.centergrid {display:grid; grid-template-columns:300px auto;}
.centergrid > div {padding-left:4px;}
.centergrid > div.navside {padding:0;}
.centernav {border:solid 1px #cecece; padding:13px;}
.centernav ul {list-style-type:none; margin:0;}
.centernav ul li {padding:6px 0; line-height:1.3rem;}
.centernav ul li a {padding:4px 0 1px 22px; display:block; position:relative;}
.centernav ul li a::before {font-family:FontAwesome; position:absolute; transition:all .2s;}
.centernav ul.garden li a::before {content:"\f06c"; left:0; top:4px;}
.centernav ul.hatching li a::before {content:"\f7fb"; left:2px; top:4px;}
.centernav ul li a.navhome::before {content:"\f015"; font-size:1.4rem; left:-2px; top:3px;}

/*Garden Center*/
.center_std {font-size:1.4rem; margin:0.5rem 1rem 0.5rem 2.5rem;}
.center_desc {margin:0.5rem 1rem 2rem 2.5rem;}
.center_desc2 {margin:0.5rem 1rem 0.2rem 1.5rem;}
.center_lesson {font-size:1.4rem; margin:0 1rem;}
.center_lesson ul {list-style:none;}
.center_lesson ul li {padding:6px 0;}
.center_lesson ul li a {padding:3px 0; position:relative; font-size:1.3rem; line-height:1.5rem;}
.center_lesson ul li a::before {
  content:"\f15c"; font-size:1.27rem;
  font-family:FontAwesome;
  position:absolute;
  left:-1.5rem; top:5px;
  transition:all .2s;
}
.center_lesson ul li a:hover::before {color:#419aff;}

/*Hatching Center*/
.center_question {font-size:1.4rem; margin:0.5rem 1rem 0.3rem 1.5rem; font-style:italic;}


/*****LESSONS*****/
/*Standards & Objectives*/
#lesson_standards hr {height:1px; margin:2.5rem auto; border:0; background-image: linear-gradient(to right, #FFF, #002a52, #FFF);}
#lesson_standards .core {font-size:1.8rem; line-height:2rem; font-weight:600; margin:2rem 1rem 0.5rem 1rem;}
#lesson_standards .subject {font-size:1.45rem; line-height:1.6rem; font-weight:600; margin:0.6rem 1rem 0 1.5rem;}
#lesson_standards .standard {font-size:1.45rem; font-weight:500; margin:0.5rem 1rem 0 2.5rem; font-style:italic;}
#lesson_standards .objective {font-size:1.3rem; margin:0 1rem 0 3rem;}
#lesson_standards .std_desc {margin-left:2.5rem; margin-bottom:0;}

#lesson_standards ul {list-style:none; margin-left:3rem; margin-bottom:0;}
#lesson_standards ul li {background:none;}
#lesson_standards ul li ol {margin-left:1.8rem;}
#lesson_standards ul li ol li {list-style-type:lower-alpha; padding-left:0;}
 
#feedback {background-color:#002a50; max-width:94%; margin:2rem auto; border-radius:0.5rem;}
#feedback ul {list-style:none;}
#feedback ul li {padding:1rem 0.5rem 1rem 5rem; position:relative; font-size:1.3rem; line-height:1.7rem; color:#FFF;}
#feedback ul li::before {
  content:"\f086"; font-size:5rem; color:#FFF;
  font-family:FontAwesome;
  position:absolute;
  left:-1.5rem; top:27px;
  transition:all .2s;
}
#feedback a {color:#a3feff; text-decoration:underline; transition:all 0.3s;}
#feedback a:hover {color:#FFF;}

/*Horse & Ride*/
.table3head {font-size:1.45rem; line-height:1.7rem; max-width:100%; padding:0.2rem; background-color:#002b50; color:#FFF; text-align:center; margin-top:1rem;}
.table3grid {display:grid; grid-template-columns: repeat(3, minmax(1px, 100%)); margin-bottom:2rem;}
.table3grid > div {padding:0.2rem; border-left:1px #777 solid; border-bottom:1px #777 solid;}
.table3grid > div.last {border-right:1px #777 solid;}
.table3grid > div ol {margin-top:1.2rem;}

/*outreach/farmfield*/
.farmfieldhead {font-size:1.45rem; line-height:1.7rem; max-width:100%; padding:0.2rem; background-color:#002b50; color:#FFF; text-align:center; margin-top:1rem;}
.farmfieldgrid {display:grid; grid-template-columns:150px 320px 120px 290px 110px 110px; margin-bottom:2rem;}
.farmfieldgrid > div {font-size:1rem; line-height:1.15rem; padding:0.5rem 0.1rem; border-left:1px #777 solid; border-bottom:1px #777 solid; text-align:center; display:flex; align-items:center; justify-content:center;}
.farmfieldgrid > div.head {font-size:1.2rem; line-height:1.45rem;}
.farmfieldgrid > div.last {border-right:1px #777 solid;}
.farmfieldgrid > div:nth-child(6) {border-right:1px #777 solid;}

/*****outreach/stations*****/
.stationshead {font-size:1.45rem; line-height:1.7rem; max-width:100%; padding:0.2rem; background-color:#002b50; color:#FFF; text-align:center; margin-top:1rem;}
.stationsgrid {display:grid; grid-template-columns:80px auto auto; margin-bottom:2rem;}
.stationsgrid > div {font-size:1rem; line-height:1.15rem; padding:0.5rem 0.2rem; border-left:1px #777 solid; border-bottom:1px #777 solid;}
.stationsgrid > div.head {font-size:1.2rem; line-height:1.45rem; font-weight:600; text-align:center; color:#002b50;}
.stationsgrid > div.last {border-right:1px #777 solid;}
.stationsgrid > div:nth-child(3) {border-right:1px #777 solid;}

/*****outreach/volunteer*****/
.volunteerhead {font-size:1.45rem; line-height:1.7rem; max-width:100%; padding:0.2rem; background-color:#002b50; color:#FFF; text-align:center; margin-top:1rem;}
.volunteergrid {display:grid;grid-template-columns:340px 80px auto; margin-bottom:2rem;}
.volunteergrid > div {font-size:1.1rem; line-height:1.35rem; padding:0.5rem 0.3rem; border-left:1px #777 solid; border-bottom:1px #777 solid;}
.volunteergrid > div.head {border-top:1px #777 solid; font-size:1.3rem; line-height:1.5rem; font-weight:600; color:#002b50; text-align:center; display:flex; align-items:center; justify-content:center;}
.volunteergrid > div.actions {border-right:1px #777 solid; padding:0;}
.volunteergrid > div.actions a {padding-left:0.3rem;}
.volunteergrid > div:nth-child(3) {border-right:1px #777 solid;}
.volunteergrid > div ul {list-style:none; margin:0;}
.volunteergrid > div ul li {padding:0.5rem 0; border-bottom:1px solid #777;}
.volunteergrid > div ul li.last {border:none;}

/*****teacher/award Grid*****/
.awardhead {font-family:'Noto Serif'; font-size:1.6rem; line-height:1.8rem; max-width:100%; padding:0.2rem; background-color:#002b50; color:#FFF; text-align:center; margin-top:1rem;}
.awardgrid {display:grid; grid-template-columns:170px auto;}
.awardgrid > div {padding:0.6rem 0 0 0;}
.awardgrid > div.photo {padding:1rem 0 0 1rem;}
.awardgrid .winner {font-family:'Noto Serif'; font-size:1.8rem; line-height:1.9rem; font-weight:400; margin-bottom:0.5rem;}
.awardgrid .school {font-family:'Noto Serif'; font-size:1.4rem; line-height:1.6rem; font-weight:400; margin-bottom:0.4rem;}
.awardgrid .winner_desc {font-size:1.3rem; line-height:1.5rem;}
.awardgrid ul {list-style:none; margin:0.5rem 1rem 1.5rem 3rem;}
.awardgrid ul li {padding:2px 0;}
.awardgrid ul li a {padding:4px 0; position:relative; font-size:1.35rem;}
.awardgrid ul li a::before {position:absolute; font-family:FontAwesome; content:"\f51c"; font-size:1.6rem; left:-38px; top:7px; transition:all 0.3s;}
.awardgrid ul li a:hover::before {color:#419aff;}

.award .school {font-family:'Noto Serif'; font-size:1.48rem; line-height:1.7rem; font-weight:400; margin-left:1.5rem;}
.award .grade {font-family:'Noto Serif'; font-size:1.3rem; line-height:1.5rem; font-weight:400; margin-left:1.5rem; margin-bottom:0.7rem;}

/*workshops schedule table*/
.schedulegrid {display:grid; grid-template-columns:100px auto; margin-bottom:2rem; border-top:1px #777 solid; border-right:1px #777 solid;}
.schedulegrid > div {padding:0.5rem 0.1rem; border-left:1px #777 solid; border-bottom:1px #777 solid;}
.schedulegrid > div.time {text-align:center; font-size:1.0rem;}
.schedulegrid > div > div {margin-left:1.5rem;}
.schedulegrid h5 {font-family:'Noto Serif'; font-size:1.5rem; line-height:1.7rem; font-weight:400; margin:0 0.2rem 0.2rem 0.3rem;}
.schedulegrid h6 {font-family:'Noto Serif'; font-size:1.3rem; line-height:1.5rem; font-weight:400; margin:0 0.2rem 0.2rem 0.8rem;}
.schedulegrid h7 {font-size:1.3rem; line-height:1.5rem; font-weight:400; margin:0 0.2rem 0.2rem 0.8rem;}
.schedulegrid ul.bullet {list-style:square; margin-left:2.65rem; margin-bottom:0;}
.schedulegrid ul.bullet ul {list-style:disc;}
.schedulegrid ul {list-style-type:none; margin:0 1rem 0 2.5rem;}
.schedulegrid ul li {margin:0; line-height:1.48rem; padding:2px 0;}
.schedulegrid ul li a {padding:10px 0; position:relative;}
.schedulegrid ul li a::before {
  content:"\f0da"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:11px;
  transition:all .2s;
}
.schedulegrid ul li a:hover::before {left:-10px; color:#419aff;}
/*sublevel*/
.schedulegrid ul li ul {margin:0.1rem 0 0 1rem;}
.schedulegrid ul li ul li {padding:1px 0;}
.schedulegrid ul li ul li a::before {content:"\f105"; font-size:1.0rem; left:-12px;}

.schedulegrid ul li.nolink {list-style-type:none; margin-left:0; line-height:1.48rem; padding:4px 0; position:relative;}
.schedulegrid ul li.nolink::before {
  content:"\f0da"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:-14px; top:4px;
}
.schedulegrid ul li ul.subnolink {margin-left:0.65rem;}
.schedulegrid ul li ul.subnolink li {padding:1px 0 1px 5px; position:relative;}
.schedulegrid ul li ul.subnolink li::before {font-family:FontAwesome; content:"\f105"; font-size:1.0rem; left:-7px; position:absolute;}

/*When more games come in student/games, move this to landing*/
#gamecols {margin:0 auto; padding-top:10px; padding-bottom:10px; width:100%;}
#gamecols ul {margin:0 0 15px 0; text-align:center; list-style:none;}
#gamecols ul li {margin:5px; width:45%; text-align:center;
	text-align:left; border-top:12px solid #002b50;
	display: inline-block;
	background:none;
	padding:12px;
	vertical-align: top;
	background-color:#FAFAFA;
	border-bottom-right-radius: 5px; border-bottom-left-radius: 5px;
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
#gamecols ul li h3 {text-align:center;}
#gamecols ul li div {margin:1rem;}
#gamecols ul li a {color:#000;}
#gamecols ul li a:hover {color:#419aff;}
#gamecols li img {text-align: center; margin: 0 auto; transition:all 0.3s;}
#gamecols li img:hover {opacity:0.8;}


/********************************************Image Styles*************************************************/
.dropshadow {box-shadow: 3px 3px 4px #777;}
.glowshadow {box-shadow: 0px 0px 2px 3px #e4e4e4; margin-bottom:20px;}
.width400 {width:400px;}
.width300 {width:300px;}
.width200 {width:200px;}

.marginright {margin:0.5rem 1rem 1rem 1rem;}
.marginleft {margin:0.5rem 1rem 1rem 1rem;}

.floatright {float:right;}
.floatleft {float:left;}
.centerimg {margin:25px auto; text-align:center;}

.glowshadow {box-shadow: 0px 0px 2px 4px #dedede; margin:0 auto; justify-content:center; display:flex;}
/* Changes & Challenges lessons*/
.blackborder {box-shadow: 0px 0px 2px 4px #dedede; border:#000 25px solid;}

.photodesc_right {float:right; margin:0.5rem 1rem 1rem 1rem; font-size:0.9rem; line-height:1.0rem; text-align:center; color:#898989; width:350px;}
.photodesc_right img {margin:0.6rem auto;box-shadow: 3px 3px 4px #777;}
.photodesc_right > div {margin:0.2rem 1rem 1rem 1rem;}

/************************************************Matrix Styles***********************************************/
.matrix-subpage {max-width:1100px; background-color:#FFF; min-height:600px; margin:calc(6vh + 5px) auto; font-size:1.1rem; line-height:1.55rem; font-weight:400;}

.matrix-subpage h2 {font-family:'Noto Serif'; font-size:2.9rem; line-height:3.1rem; font-weight:400; color:#002a52; letter-spacing:0.05rem; text-shadow:1px 1px 1px #959595; text-align:center;}
.matrix-subpage hr {height:1px; border:0; background-image: linear-gradient(to right, #FFF, #002a52, #FFF); margin-bottom:0;}
.matrix-subpage hr.spacehr {margin-bottom:3rem;}

h3.matrixh3 {font-family:'Noto Serif'; font-size:2.3rem; line-height:2.1rem; font-weight:400; color:#002a52; margin:1rem 0.5rem;}
h3.matrixh3.center {text-align:center; margin:0.3rem 1rem 3rem 1rem;}
h4.matrixh4 {font-family:'Noto Serif'; font-size:1.9rem; line-height:2.1rem; margin:0 0.5rem 0 0.9rem; font-weight:400;}
h5.matrixh5 {font-size:1.5rem; line-height:1.6rem; margin:0 0.5rem 0 0.2rem; font-weight:400;}
p.matrix {margin:0 1.0rem 2rem 1.0rem;}

.searchhead {text-align:left; font-size:1.5rem; line-height:1.6rem; margin-left:0.7rem; margin-bottom:0;}
.errorcode  {margin:20px 0px 0px 10px; color: #cc1515; font-weight:500; background-color:#ffcccc; text-align:center; padding:6px 0px;}
.successcode  {margin:20px 0px 0px 10px; background-color:#a7e3bc; padding:6px 0px;}

ul.lessonlinks {margin:0 0.5rem 1.5rem 1.5rem;}
ul.lessonlinks li {list-style-type:none; margin:0; padding:2px 0 2px 15px;}
ul.lessonlinks li a {padding:2px 15px; position:relative; display:block; font-size:1.2rem;}
ul.lessonlinks li a::before {
  content:"\f15c"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:-6px; top:0;
  transition:all 0.3s;
}
ul.lessonlinks li a:hover::before {top:-2px; color:#419aff;}
ul.lessonlinks li ul {margin-left:1.5rem;}
ul.lessonlinks li ul li {padding:2px 0; line-height:0 !important;}
ul.lessonlinks li ul li a {padding:0; position:relative; font-size:1.05rem; line-height:1.05rem;}
ul.lessonlinks li ul li a::before {content:"\f105";
  left:-0.8rem; top:0;
  transition:all .2s;}
ul.lessonlinks li ul li a:hover::before {left:-0.5rem; top:0;}


ul.matrixlink {margin:3rem 0.5rem 3rem 1.5rem;}
ul.matrixlink li {list-style-type:none; margin:0; padding:6px 0;}
ul.matrixlink li a {padding:0 15px; position:relative; display:block; font-size:1.2rem;}
ul.matrixlink li a::before {
  content:"\f0da"; font-size:1.2rem;
  font-family:FontAwesome;
  position:absolute;
  left:2px; top:0;
  transition:all 0.3s;
}
ul.matrixlink li a:hover::before {left:6px; color:#419aff;}

.mxbutton {
  font-family:'Pontano Sans'; font-size:1.2rem; line-height:1.2rem; text-align:center; color:#FFF;
  border-radius:6px; display:inline-block;
  border:none; background-color:#002a52;
  padding:10px 20px;
  transition: all 0.5s;
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); cubic-bezier(.25,.8,.25,1);
  margin-left:20px; margin-bottom:20px;
}
.mxbutton:hover {background-color:#419aff; color:#FFF;}
.mxbutton a {color:#f4d0ab;}
.mxbutton span {cursor: pointer;
  display:block;
  position: relative;
  transition: 0.5s;}
.mxbutton span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}
.mxbutton:hover span {padding-right:25px;}
.mxbutton:hover span:after {opacity: 1; right: 0;}

.mxsearchw {width:170px;}
.mxloginw {width:330px;}
.mxcenterw {width:46%; margin:3px auto;}
.mxLRbutton {width:29.3%;}
.mxbuttonwrap {display:block; margin:50px auto; text-align:center;}

/*matrix.tpl login*/
.logingrid {
  display:grid;
  grid-template-columns:auto auto;
  margin:0 15px;
}
.logingrid > div {
  padding:5px 0;
  display:inline-block;
  align-items:center;
}
.logingrid label {display:block; margin-left:2px;}
#mybinderlogin {margin:0 auto; display:flex; justify-content:center;}
.logininputs  {border:1px solid #888; width:94.5%; padding:6px 8px; font-size:1.1rem; line-height:1.1rem; display:inline-block; border-radius:4px; transition:all 0.3s;}
.logininputs:hover  {border:1px solid #051a3a; background-color:#f9fbff;}

/*createuser.tpl, editprofile.tpl*/
h4.checkboxlist {font-size:1.5rem; line-height:1.7rem; margin:1.5rem 0.5rem 0.5rem 0; font-weight:400;}
label.checkbox {margin:5px; line-height:1.7rem;}
#create  { margin: 0px 20px; }
#location  { cursor: pointer; }
.required  { color: #cc1313; }
.half  { width: 50%; padding-right: 2%; }
.whole  { width: 100%; }
.half, .whole  { float: left; margin: 5px 0px; box-sizing: border-box; }
.inputs  {border: 1px solid #cccccc; width: 70%; padding: 4px 8px; font-size:1.1rem; line-height:1.1rem; display:inline-block; border-radius:4px; transition:all 0.3s;}
.inputs:hover {background-color:aliceblue;}
.redinput  { background-color: #ffdddd; border: 1px solid #cc1313; color: #cc1313; }
.showerror  { margin: 5px 0px; color: #cc1313; font-weight: bold; }

/* forgotpassword.tpl resetpassword.tpl */
#address  {}
#resetpassword, #resetemail {display:flex; justify-content:center;}
#resetpassword::placeholder, #resetemail::placeholder  {color:#888; font-weight:normal;}
#forgoterror  {margin-bottom:20px;}
.resetinputs  {border:1px solid #888; width:44.5%; padding:8px; font-size:1rem; line-height:1rem; border-radius:5px; display:block; margin:0 auto; transition:all 0.3s;}
.resetinputs:hover {border:1px solid #8aa1a8; background-color:aliceblue;}

/*mylibrary.tpl*/
.deletebtn  {padding:8px 30px; margin:5px 15px 20px 10px; border:none; display:inline-block; cursor:pointer;}
.deletebtn:hover  {}
.deletebtn.disable {background-color:#333; transition:all 0.3s;}
.deletebtn.disable:hover {background-color:#777;}
.mark2  {position:absolute; top:17px !important; left:12px !important; width:26px; height:26px; background-color:#FFF; border:2px solid #002a50; border-radius:5px; box-sizing:border-box;}
.lessonanchor {display:inline-block; font-size:1.3rem; margin-left:-0.4rem; font-weight:600;}
.purpose2 {margin:0 0.5rem -0.3rem 3.4rem !important;}
/*.purpose2 p {margin:0 !important;}*/

/*searchresult.tpl*/
h5.searchtitle {font-family:'Pontano Sans'; font-size:1.4rem; line-height:1.5rem; margin:0.5rem 0.2rem 0rem 0.8rem; font-weight:600;}
h6.searchtitle {font-family:'Pontano Sans'; font-size:1.4rem; line-height:1.5rem; margin:0.5rem 0.2rem 0rem 0.8rem; font-weight:600;}
h5.searchtitle a, h6.searchtitle a {color:#0051d0 !important; transition: 0.4s all;}
h5.searchtitle a:hover, h6.searchtitle a:hover {color:#00baff !important;}
h5.searchmedia {font-family:'Pontano Sans'; font-size:1.7rem; line-height:1.8rem; margin:0.5rem 0.2rem 0 0.8rem; font-weight:600;}
.noresults {text-align:center; background-color:#e8e8e8; padding:5px 0px;}
.purpose {margin:0.1rem 0.5rem 1rem 1.0rem !important; font-weight:300;}
.purpose p {margin:0 !important;}

/*searchresult.tpl - View more...button*/
.showall {width:100%; position:relative;}
.showallfade {height:80px; width:100%; position:absolute; z-index:2; bottom:0px; left:0px; background-image:url("/images/matrix/whiteblend.svg"); background-size:auto 100%;}
.showallbtn {position:absolute; left:50%; top:50%; transform:translateX(-50%) translateY(-50%); border:none; border-radius:5px; padding:7px 15px 8px 15px; background-color:#002a52; color:#FFF; font-size:1em; cursor:pointer; box-shadow:0px 2px 6px rgba(0, 0, 0, 0.6); transition:all 0.3s;}
.showallbtn:hover {background-color:#419aff; color:#FFF;}
.showrest.hidden {display:none;}

/*lesson.tpl*/
h4.lessontitle {font-family:'Pontano Sans'; font-size:2.1rem; line-height:2.3rem; margin:0.2rem 0.2rem 0.5rem 0.1rem; font-weight:600;}
h5.Lcategory  {font-family:'Pontano Sans'; font-size:1.5rem; line-height:1.7rem; margin:0.9rem 0.2rem 0.2rem 0.1rem; font-weight:600;}
.Lsection {display:block; margin:5px 15px 5px 5px; clear:both;}
.Lsection > div {margin-left:0.1rem;}
.Lsection > div.leftmargin {margin-left:1.1rem;}
.Lsection ul, .Lsection ol  {margin:0 0.2rem 0.2rem 3rem;}
.Lsection p {margin-left:1rem;}
.Lsection ul ul, .Lsection ul ol, .Lsection ol ul, .Lsection ol ol {margin-left:1rem; padding-left:0;}
.Lsection IMG  {padding:15px;}

/*lesson.tpl -  standards buttons*/
#standardbtns  {width:100%; border-collapse:collapse; margin-top:30px; margin-left:0px; margin-right:0px; border:none; }
#standardbtns TR TD  {border:none; width:33.3%; padding:0px 5px; margin:0;}
#standardbtns.four TR TD  {width: 25%;}
#standardbtns TR TD  {vertical-align:top;}
#standardbtns TR TH  {vertical-align:middle;}
#standards  {width:100%; min-height:200px;}

.standardbtn  {border:none; font-size:0.98rem; line-height:1.18rem; cursor:pointer; width:100%; background-color:#002a52; color:#FFF; display:block; text-align:center; padding:8px 10px; border-radius:8px; transition:all 0.3s; height:55px;}
.standardbtn:hover  {background-color: #419aff; color:#FFF;}
.standardbtn.clicked  {background-color:#1760ba; color:#FFF; transition:all 0.3s;}
.standardbtn.clicked:hover  {background-color:#419aff;}

.showstd.hidden  {display:none;}
.showstd h5 {font-size:1.4rem; line-height:1.5rem; margin:0.5rem 0.2rem 0.2rem 0.2rem; font-weight:400;}
.showstd h6 {font-size:1.2rem; line-height:1.3rem; margin:0.2rem 0.2rem 0.3rem 0.4rem; font-weight:400;}
.showstd ul {margin:0 0 15px 55px !important;}
.showstd ul li {padding:1px 0;}
.showstd p {margin:5px 15px 5px 10px !important;}
.showstd .statestandard  {margin:0 15px 5px 20px;}
.showstd .contentstandard  {margin:0 15px 5px 20px;}
.ccdesc {padding: 10px 0px 2px 0px;}

/*lesson.tpl - View more...button*/
#backgroundcrop  { width:100%; overflow:hidden; height:170px; position: relative; }
#showmorebackground  { width:104%; height:40px; position:absolute; bottom: 0px; left: -2%; background-image: url("/images/matrix/whiteblend.svg"); background-size: auto 100%; background-repeat:repeat-x; }
#seemore  { color:#FFF; background-color:#002a52; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); cursor: pointer; padding: 5px 15px 7px 15px; border-radius: 6px; border: none; font-size:16px; line-height:16px; transition:all 0.3s;}
#seemore:hover  {background-color:#419aff; color:#FFF;}
#showmorebackground.hidden  { background-image: none; bottom: 0px; }
#backgroundcrop.show  { height: auto; overflow: visible; padding-bottom: 35px;}

/* lesson/resource */
.additionalactions  { width: 102%; margin-left: -1%; }
.additionalactions a {color:#FFF;} /*to change button link color*/
.action  {display:inline-block; color:#FFF !important;}
.action:hover  {text-decoration:none;}
.action.disabled  {background-color:#999;}
.action.disabled:hover {color:#FFF;}
.action.inbinder {background-color:#b71d21; color:#DDD; transition:all 0.3s;}
.action.inbinder:hover  {background-color:#d73d41; color:#FFF;}

/*resource.tpl*/
h4.resourcetitle {font-family:'Pontano Sans'; font-size:2.4rem; line-height:2.4rem; margin:1.5rem 0.2rem 0.5rem 0; font-weight:600;}
h5.Rcategory  {font-family:'Pontano Sans'; font-size:1.7rem; line-height:1.9rem; margin:0.5rem 0.2rem 0rem 0.5rem; font-weight:600;}
.lessons  {margin:0 0.2rem 0.2rem 1.5rem; padding-left:25px;}
#thumbnail  { margin: 20px 0px 15px 50px; max-width: 100%; height:auto;}
.Rsection {display:block; margin:0.5rem 0.2rem 0.5rem 1rem; clear:both;}
.Rsection p {margin:0 !important;}
.Rsection ul, .Rsection ol {margin:0 0.2rem 0.2rem 2rem;}
.Rsection ul ul, .Rsection ul ol, .Rsection ol ul, .Rsection ol ol {margin-left:1rem; padding-left:0;}
.Rsection IMG  {padding:15px;}
/*Phenomenon table*/
table.phenomenon {border-collapse: collapse; border:1px solid #b3cf8f; margin:1rem;}
table.phenomenon th {border:1px solid #b3cf8f; padding:5px; text-align:center; font-weight:600; font-size:0.9rem; line-height:1.0rem; color:#FFF;}
table.phenomenon td {border:1px solid #b3cf8f; padding:5px; vertical-align:top; font-size:0.9rem; line-height:1.15rem; color:#000;}
table.phenomenon td ul {margin-left:5px; margin-top: 0; margin-right: 0;}
table.phenomenon td ol {margin-left:0; margin-top: 0; margin-right: 0;}
table.phenomenon td ul li {font-size:0.9rem; line-height:1.15rem; color:#000; padding-left:0;}
table.phenomenon td ol li {font-size:0.9rem; line-height:1.15rem; color:#000; padding-left:0;}

/*Callout*/
h5.naitcheader {font-size:1.6rem; font-weight:500; margin-top:1rem; margin-bottom:0.2rem; margin-left:1rem;}

/***************************************************************RESPONSIVE*****************************************************************************/
@media screen and (max-width: 1150px) {
.topwrapper {max-width:100%;}

/************Homepage************/
.homewrapper {max-width:97%;}
.matrixgrid {grid-template-columns: repeat(1, minmax(1px, 100%)); margin:0 5px 15px 5px;}
.matrixF {width:100%;}
.matrixB {width:100%;}

.impactwrap {max-width:96%;}
.impactgrid {grid-gap:1rem;}
.impactgrid > div {pading:0 1rem;}
.impactgrid > div.odometer {font-size:4.0rem;}

/************Landing************/
.landingcol .garden-pic {height:220px;}
.landingcol .hatching-pic {height:220px;}
.landingcol .utlessons-pic {height:220px;}
.landingcol .student-pic {height:200px;}

/************Subpage************/
.subpage {max-width:90%;}
.res2grid {grid-template-columns: repeat(1, minmax(1px, 100%));}
.farmfieldgrid {grid-template-columns:auto 300px auto 260px auto auto;}

/*************Matrix************/
.matrix-subpage {max-width:90%;}
label.checkbox {margin:17px 0;}
.mark2  {top:31px !important;}
.lessonanchor {display:inline-block; font-size:1.3rem; margin-left:0;}
.purpose2 {margin:0 0.5rem -2rem 3.5rem !important;}

}


@media screen and (max-width: 1050px) {
.ctct-inline-form {width:90% !important;}
/*footer*/
.footrow {max-width:99%;}
#footer-bottom .footrow:nth-child(1) {text-align:center;}
#footer-bottom .footrow:nth-child(2) {border-bottom:none; height:auto;}
#footer-bottom .footrow:nth-child(2) li::after {content:none;}
#footer-bottom .footrow:nth-child(3) {text-align:center;}

/************Landing************/
.landingcol .utlessons-pic {height:170px;}
.landingcol .student-pic {height:170px;}
#landing-twocolumns1 .landingcol:nth-child(1) .student-pic {height:240px;}
#landing-twocolumns1 .landingcol:nth-child(2) .student-pic {height:240px;}

/************Subpage************/
.farmfieldgrid {grid-template-columns:auto 220px auto 200px auto auto;}
.farmfieldgrid > div {font-size:0.75rem; line-height:0.8rem;}
.farmfieldgrid > div.head {font-size:0.9rem; line-height:1.1rem;}

/*************Matrix************/
.lessonanchor {display:block; margin-left:3.2rem;}
.mark2  {top:52px !important; left:10px !important;}
.purpose2 {margin:0 0.5rem -2.5rem 3.4rem !important;}

}

@media screen and (max-width: 900px){
nav.main {display:none;}
#mobilemenu {display:block; position: relative; z-index:9999; box-shadow: 0px 3px 4px #000;}

/************Homepage************/
.homewrapper {max-width:90%;}
#home-columns.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#home-columns .homecol:nth-child(1),
#home-columns .homecol:nth-child(2) {margin: 0 0 30px 0;}
.homecol .featured-pic {height:510px;}
.homecol h2 {height:auto;}

.impactgrid > div.odometer {font-size:3.5rem;}

/***********Landing*************/
#landing-columns1.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#landing-columns2.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#landing-columns3.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}

#landing-twocolumns1.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#landing-twocolumns2.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#landing-twocolumns3.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}

#landing-twocolumns1 .landingcol:nth-child(1) {margin-right:calc(1vh + 10px);}
#landing-twocolumns2 .landingcol:nth-child(1) {margin-right:calc(1vh + 10px);}
#landing-twocolumns3 .landingcol:nth-child(1) {margin-right:calc(1vh + 10px);}

#landing-columns1 .landingcol:nth-child(1),
#landing-columns1 .landingcol:nth-child(2),
#landing-columns1 .landingcol:nth-child(3) {margin:0 0 30px 0;}
#landing-columns2 .landingcol:nth-child(1),
#landing-columns2 .landingcol:nth-child(2),
#landing-columns2 .landingcol:nth-child(3) {margin:0 0 30px 0;}
#landing-columns3 .landingcol:nth-child(1),
#landing-columns3 .landingcol:nth-child(2),
#landing-columns3 .landingcol:nth-child(3) {margin:0 0 30px 0;}

#landing-twocolumns1 .landingcol:nth-child(1),
#landing-twocolumns1 .landingcol:nth-child(2) {margin:0 0 30px 0;}
#landing-twocolumns2 .landingcol:nth-child(1),
#landing-twocolumns2 .landingcol:nth-child(2) {margin:0 0 30px 0;}
#landing-twocolumns3 .landingcol:nth-child(1),
#landing-twocolumns3 .landingcol:nth-child(2) {margin:0 0 30px 0;}

section#landing-columns1 {margin-top:30px; margin-bottom:0;}
section#landing-columns2,
section#landing-columns3 {margin-top:0; margin-bottom:0;}

section#landing-twocolumns1 {margin-top:30px; margin-bottom:0;}
section#landing-twocolumns2,
section#landing-twocolumns3 {margin-top:0; margin-bottom:0;}

.landingcol h3 {height:auto; margin:2rem 1rem !important;}

.landingcol .hatching-pic {height:450px;}
.landingcol .garden-pic {height:450px;}
.landingcol .utlessons-pic {height:470px;}
.landingcol .student-pic {height:450px;}
#landing-twocolumns1 .landingcol:nth-child(1) .student-pic {height:450px;}
#landing-twocolumns1 .landingcol:nth-child(2) .student-pic {height:450px;}

/***********Sub 3 Cols*************/
#sub-columns1.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#sub-columns2.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#sub-columns3.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#sub-columns4.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#sub-twocolumns1.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}

#sub-columns1 .subcol:nth-child(1),
#sub-columns1 .subcol:nth-child(2),
#sub-columns1 .subcol:nth-child(3) {margin:0 0 30px 0;}
#sub-columns2 .subcol:nth-child(1),
#sub-columns2 .subcol:nth-child(2),
#sub-columns2 .subcol:nth-child(3) {margin:0 0 30px 0;}
#sub-columns3 .subcol:nth-child(1),
#sub-columns3 .subcol:nth-child(2),
#sub-columns3 .subcol:nth-child(3) {margin:0 0 30px 0;}
#sub-columns4 .subcol:nth-child(1),
#sub-columns4 .subcol:nth-child(2),
#sub-columns4 .subcol:nth-child(3) {margin:0 0 30px 0;}
#sub-twocolumns1 .subcol:nth-child(1),
#sub-twocolumns1 .subcol:nth-child(2) {margin:0 0 30px 0;}

section#sub-columns1 {margin-top:30px; margin-bottom:0;}
section#sub-columns2,
section#sub-columns3,
section#sub-columns4 {margin-top:0; margin-bottom:0;}
section#sub-twocolumns1 {margin-top:0; margin-bottom:0;}

/*3cols*/
.subcol .harvest-pic {height:460px;}

/***********Sub 4 Cols*************/
#sub4-columns1.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#sub4-columns2.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#sub4-columns3.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}
#sub4-twocolumns1.display-flex {-webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column;}

#sub4-columns1 .sub4col:nth-child(1),
#sub4-columns1 .sub4col:nth-child(2),
#sub4-columns1 .sub4col:nth-child(3),
#sub4-columns1 .sub4col:nth-child(4) {margin:0 0 30px 0;}
#sub4-columns2 .sub4col:nth-child(1),
#sub4-columns2 .sub4col:nth-child(2),
#sub4-columns2 .sub4col:nth-child(3),
#sub4-columns2 .sub4col:nth-child(4) {margin:0 0 30px 0;}
#sub4-columns3 .sub4col:nth-child(1),
#sub4-columns3 .sub4col:nth-child(2),
#sub4-columns3 .sub4col:nth-child(3),
#sub4-columns3 .sub4col:nth-child(4) {margin:0 0 30px 0;}
#sub4-twocolumns1 .subcol:nth-child(1),
#sub4-twocolumns1 .subcol:nth-child(2) {margin:0 0 30px 0;}

section#sub4-columns1 {margin-top:30px; margin-bottom:0;}
section#sub4-columns2,
section#sub4-columns3 {margin-top:0; margin-bottom:0;}

section#sub4-twocolumns1 {margin-top:0; margin-bottom:0;}

/************Subpage************/
.volunteergrid {grid-template-columns:auto 80px auto;}
.agtiongrid {display:block; grid-template-columns:auto auto;}

/*Garden & Hatching Center Nav Grid*/
.centergrid {display:block; grid-template-columns:auto auto;}
.centergrid > div {padding-left:0;}
.centergrid > div.navside {margin-bottom:35px;}
.centernav {width:auto; text-align:center; margin:0 auto;}
.centernav ul li {display:inline-block; padding:3px 10px; text-align:center;}
.centernav ul li a {display:inline-block;}

}

@media screen and (max-width: 768px) { /*iPad*/
#scroll {bottom: 0;}
#rightwrap1 {float:none; width:100%; margin:1rem auto;}
#rightwrap2 {float:none; width:100%; margin:1rem auto;}

/***********Landing*************/
.landingcol .hatching-pic {height:400px;}
.landingcol .garden-pic {height:400px;}
.landingcol .utlessons-pic {height:400px;}
.landingcol .student-pic {height:400px;}
#landing-twocolumns1 .landingcol:nth-child(1) .student-pic {height:400px;}
#landing-twocolumns1 .landingcol:nth-child(2) .student-pic {height:400px;}

/************Sub Cols************/
/*3cols*/
.subcol .harvest-pic {height:420px;}

/************Subpage************/
.table3grid > div {padding:0.2rem;}
.table3grid > div ol {margin-left:2rem;}

.farmfieldgrid {grid-template-columns:auto auto auto auto auto auto;}
.farmfieldgrid > div {font-size:0.65rem; line-height:0.7rem;}
.farmfieldgrid > div.head {font-size:0.8rem; line-height:1rem;}

/*Image Style*/
.dropshadow {margin:20px auto;}
.width300 {width:80%;}
.width400 {width:80%;}
.marginright {margin:15px auto; text-align:center;}
.marginleft {margin:15px auto; text-align:center;}
.floatright {float:none;}
.floatleft {float:none;}
.photodesc_right {width:80%; float:none; margin:0.5rem auto; text-align:center;}

/*************Matrix************/
.half {width:100%; padding-right:0%; padding-top:10px;}
.logingrid {grid-template-columns:repeat(1, minmax(1px, 100%)); grid-gap:1rem; margin:1rem auto;}
.logininputs {width:96.5%; margin:0 auto;}
.mxsearchw {width:99%; margin-top:2px !important; margin-left:0 !important;}
.mxloginw {width:100%;}
.mxcenterw {width:100%;}
.mxLRbutton {width:72%; margin-bottom:5px !important;}
.resetinputs {width:96.5%;}
#standardbtns TR TD  {padding:0px 1px;}
.standardbtn {padding:6px 2px; border-radius:5px; height:55px;}

/*Callout*/
.naitccallout  {display:block; width:100%; margin-top:20px;}
.naitccallout TR  {display block; width:100%;}
.naitccallout TR TD  {display:block; width:100%;}
.naitccallout TR TD:first-child  {display:block; margin-left:auto; padding-left:15px; margin-right:auto;}
.naitccallout TR TD:last-child  {display:block; width:100%; }
.naitccallout TR TD:last-child h5.naitcheader  {margin-top:0; padding-top:0; text-align:center;}

}

@media screen and (max-width: 680px) {
#scroll {display: none !important;}

.buttonwrap {display:block; grid-template-columns:95%; margin:2rem auto; text-align:center;}
.button400 {width:95%;}

/************Homepage************/
.homecol .featured-pic {height:360px;}

#impactnumbers .impact_statement {font-size:1.3rem; line-height:1.5rem;}
.impactgrid > div {font-size:1.55rem;}
.impactgrid > div.odometer {font-size:2.8rem;}

/***********Landing*************/
.landingcol .hatching-pic {height:350px;}
.landingcol .garden-pic {height:350px;}
.landingcol .utlessons-pic {height:350px;}
.landingcol .student-pic {height:350px;}
#landing-twocolumns1 .landingcol:nth-child(1) .student-pic {height:350px;}
#landing-twocolumns1 .landingcol:nth-child(2) .student-pic {height:350px;}


/************Sub Cols************/
/*3cols*/
.subcol .harvest-pic {height:340px;}

/************Subpage************/
.staffgrid {display:block; grid-template-columns:auto auto;}
.res2grid > div h4 {font-size:1.35rem;}
.table3grid > div ol li {font-size:1rem; line-height:1.1rem;}

/*************Matrix************/
.standardbtn  {font-size:0.8rem; line-height:0.9rem;}
}

@media screen and (max-width: 540px) { /*Surface Plus*/
.topwrapper {height:250px;}
nav.topnav {float:none; margin:0;}

/************Homepage************/
.homecol .featured-pic {height:280px;}
.impactgrid > div {font-size:1.16rem;}
.impactgrid > div.odometer {font-size:2rem;}

/***********Landing*************/
.landingcol .hatching-pic {height:260px;}
.landingcol .garden-pic {height:260px;}
.landingcol .utlessons-pic {height:260px;}
.landingcol .student-pic {height:260px;}
#landing-twocolumns1 .landingcol:nth-child(1) .student-pic {height:260px;}
#landing-twocolumns1 .landingcol:nth-child(2) .student-pic {height:260px;}

/************Sub Cols************/
/*3cols*/
.subcol .harvest-pic {height:275px;}

/************Subpage************/
.res2grid img {margin:3rem auto 1rem auto; text-align:center; float:none; width:90%;}
.res2grid > div {border-top:60px solid #002a52;}
.res2grid > div h4 {margin:-66px 0 18px 0; font-size:1.35rem; line-height:1.45rem;}

#feedback ul li {padding:1rem 0.5rem 1rem 2.8rem; font-size:1.2rem; line-height:1.55rem;}
#feedback ul li::before {font-size:3.8rem; left:-2rem;}
}

@media screen and (max-width: 414px) { /*iPhone X*/
.topwrapper {height:210px;}
h1.logo {margin:1rem 0.5rem 0.5rem 0.5rem;}
nav.sign_log {top:100px; right:0.2rem}
/************Homepage************/
.homecol .featured-pic {height:220px;}
.impactgrid > div {font-size:0.9rem;}
.impactgrid > div.odometer {font-size:1.3rem;}

/***********Landing*************/
.aboutgrid > div {font-size:0.92rem; line-height:1.0rem;}
.aboutgrid > div i {font-size:3.2rem;}

.landingcol .hatching-pic {height:220px;}
.landingcol .garden-pic {height:220px;}
.landingcol .utlessons-pic {height:200px;}
.landingcol .student-pic {height:200px;}
#landing-twocolumns1 .landingcol:nth-child(1) .student-pic {height:200px;}
#landing-twocolumns1 .landingcol:nth-child(2) .student-pic {height:200px;}

/************Sub Cols************/
/*3cols*/
.subcol .harvest-pic {height:200px;}

/*************Matrix************/
#thumbnail  {margin:1rem auto; max-width:70%;}
.standardbtn {font-size:0.8rem; line-height:0.9rem;}

}


@media screen and (max-width: 320px) {
h1.logo {margin:0.5rem;}
nav.sign_log {top:90px;}
nav.sign_log ul li {font-size:1rem; line-height:1rem;}
nav.sign_log a {padding:0 0.3rem;}

/************Homepage************/
.impactgrid > div {font-size:0.85rem;}
.impactgrid > div.odometer {font-size:1.2rem;}

/*************Matrix************/
.standardbtn  {font-size:0.65rem; line-height:0.75rem;}

}
