@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700'); /*Main Nav font*/ @import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700'); @import url('https://fonts.googleapis.com/css?family=Raleway:300,400,500,600,700,800'); /*When you make , create class for the . affects slideshow and modal's x(close).*/ html {height:100%; background:#FFF url(../images/default/bg.jpg) repeat top left;} body {overflow-x:hidden; font-family:'Open Sans';} * { 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**********************************************/ .clear {clear: both;} 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*/ .centerV2 {position:relative; top:50%; transform:translateY(-50%);} .centerH {display:flex; justify-content:center;}/*horizontally centered*/ a:link, a:visited {color:#7bb804; transition: 0.4s all; text-decoration:none; transition:all 0.4s;} a:hover, a:active, a:focus {color:#00aff0;} img {display:block; margin:0px; max-width:100%; height:auto;} a img {border:none;} footer a:link, footer a:visited {color:#FFF; transition:all 0.4s;} iframe {max-width:100%;} /*iframe responsive*/ .video-container {position:relative; height:0; overflow:hidden;} .video-container-16x9 {padding-bottom:56.25%;} .video-container-15x9 {padding-bottom:54%;} .video-container-7x3 {padding-bottom:62%;} .video-container-4x3 {padding-bottom:95%;} .video-container iframe {position:absolute; top:0; left:0; width:100%; height:100%;} /*Back to top*/ #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)"; } /*********************************Button & Field***************************************/ /*homepage, news, subscribe, programs/schoolyard/, programs/virtual, programs/alw*/ .buttonwrap { display: inline-grid; grid-template-rows: 30px; grid-template-columns: 450px; grid-gap:3px; margin-bottom:1rem; margin-left:1.3rem; } .buttonwrap > div {display:flex; justify-content:center; align-items:center;} .buttonwrapcenter {display:block; margin:1rem auto; text-align:center;} .deadline {margin:0 auto; font-size:1.15rem; text-align:center; color:#CB0003;} .button { font-family:'Raleway'; font-size:1.15rem; line-height:1.2rem; text-align:center; color:#FFF; border-radius:5px; display:block; border:none; background-color:#93bd3e; padding:6px 20px; text-transform:uppercase; 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); } .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:-2px; right: -18px; transition: 0.5s; } .button:hover span {padding-right:15px;} .button:hover span:after {opacity: 1; right:-10px;} .field {border-radius:3px; border:solid 1px #c8c8c8; height:27px; transition:0.3s all; font-size:1.0rem;} .field:hover {background-color:aliceblue;} .button_width350 {width:350px;} /*grants/conference, grow, programs/stem, programs/alw, programs/literacy, programs/growny*/ .button_width550 {width:550px; padding:8px 20px; margin:3px auto;} /*programs/schoolyard/, grants/grow*/ .button_width700 {width:7050px; padding:8px 20px;} /*grants/grow/*/ .button_ws {width:350px; margin:0 0.1rem; text-transform:none;} /*programs/virtual, workshops*/ .button_virtual {width:400px; padding:0.5rem 20px; margin:0 1rem 2rem 1.5rem; text-transform:none;} /*programs/virtual*/ /*two buttons side by side*/ .buttonwrapinline { display: inline-grid; grid-template-rows:10px; grid-template-columns:710px; margin-bottom:2rem; margin-left:1.3rem; } .buttonwrapinline > div { display: flex; width:100%; justify-content: center; align-items: center; } /*grants/grow*/ .button2wrapcenter {display:block; margin:1rem auto; text-align:center;} .button2wrapcenter > div {display:flex; justify-content:center; align-items:center;} .button2wrapcenter > div .button {text-transform:none;} /***********************************Anchor Links**************************************/ /*grants/conference2018, 2019, grants/grow_*/ .anchorlinks {margin:1rem;} .anchorlinks.top {margin:-1rem 1rem 3rem 1rem !important;} .anchorlinks ul {list-style:none; text-align:center;} .anchorlinks ul li {display:inline-block;} .anchorlinks ul li a {padding:0 20px; display:block; position:relative; text-decoration:none;} .anchorlinks ul li a::before { content:"\f13a"; font-family:FontAwesome; position:absolute; left:0; top:0; transition:all .2s; } .anchorlinks ul li a:hover::before {top:2px; color:#00aff0;} .anchorlinks ul li a.anchorhome::before {content:"\f015"; font-size:1.3rem; left:-2px;} /************************************List Links***************************************/ ul.listlink {margin:0 0.5rem 1.5rem 2rem !important;} ul.listlink.lessbottom {margin:0 0.5rem 0 1rem !important;} ul.listlink li {list-style-type:none; margin:0; padding:0.1rem 0;} ul.listlink li a {padding:0 1rem; position:relative; display:block;} ul.listlink li a::before { content:"\f0da"; font-size:1.2rem; font-family:FontAwesome; position:absolute; left:2px; top:0; transition:all .2s; } ul.listlink li a:hover::before {left:6px; color:#00aff0;} ul.listlink li a.yt::before {content:"\f431"; left:-13px;} ul.listlink li a.yt:hover::before {left:-8px; color:#00aff0;} ul.listlink span {margin:5px 20px 2px 23px; display:block;} ul.listlink span a {display:inline; padding:0;} ul.listlink span a::before {content:none;} /*largefont*/ ul.listlink li a.largefont {font-size:1.38rem; padding:2px 15px 0 15px;} ul.listlink li a.largefont::before {font-size:1.5rem; top:2px;} /*not linked list*/ ul.listlink li.nolink {line-height:1.22rem; margin-left:2px;} ul.listlink li.nolink::before { content:"\f0da"; font-size:1.2rem; font-family:FontAwesome; padding-right: 5px;} ul.listonelink {margin:0 0.2rem 1.5rem 2.0rem;} ul.listonelink li {list-style-type:none; margin:0; padding:0;} ul.listonelink li a {padding:0 15px; position:relative;} ul.listonelink li a::before { content:"\f0da"; font-size:1.4rem; font-family:FontAwesome; position:absolute; left:2px; top:1px; transition:all .2s; } ul.listonelink li a:hover::before {left:6px; color:#00baff;} /*movie*/ ul.movielink {margin:0 0.5rem 0.2rem 2.5rem !important;;} ul.movielink li {list-style-type:none; margin:0; padding:0.3rem 0;} ul.movielink li a {padding:0 1rem; position:relative; display:block;} ul.movielink li a::before {font-family:FontAwesome; content:"\f431"; position:absolute; font-size:1.5rem; left:-10px; top:0;} ul.movielink li a:hover::before {color:#00aff0;} /*recipe*/ ul.recipelink {margin:0 0.5rem 0.2rem 2.5rem !important;;} ul.recipelink li {list-style-type:none; margin:0; padding:0.3rem 0;} ul.recipelink li a {padding:0 1rem; position:relative; display:block;} ul.recipelink li a::before {font-family:FontAwesome; content:"\f818"; position:absolute; font-size:1.5rem; left:-12px; top:0;} ul.recipelink li a:hover::before {color:#00aff0;} /*Go back link*/ .goback {float:right; margin:-2rem 0.5rem 1rem 0.2rem;} .goback a {padding:0 2.0rem; font-size:1.4rem; position:relative; display:block;} .goback a::before { content:"\f04a"; font-size:1.4rem; font-family:FontAwesome; position:absolute; left:4px; top:0; transition:all .3s; } .goback a:hover::before {left:0; color:#00aff0;} .wrapper {max-width:1100px; margin:0 auto;} /********************************************Header********************************************/ header {display:block; height:120px; position:relative;} h1.logo {margin-top:0.5rem; margin-left:1rem; width:300px;} /*Matrix icon links*/ nav.sign_log {position:absolute; top:0; right:2rem; text-align:right;} nav.sign_log ul {padding:0; margin:0;} nav.sign_log ul li {list-style-type:none; display:inline-block; font-size:1rem;} nav.sign_log a {color:#1c315f; font-weight:400; transition:0.4s all; padding-left:0.5rem; display:inline-block;} nav.sign_log a:hover {color:#c9232b; text-decoration:none;} nav.sign_log a.fa-icon::before {padding-right:5px;} .fa-icon::before {font-family: FontAwesome;} /*Main Nav*/ .mobiles {display:none;} nav.mainnav a.navhighlight {color:#c9232b !important;} #mainnav {float:right; position:absolute; right:20px; top:45px; z-index:100;} #mainnav ul, #mainnav li, div.menu ul, div.menu ul li, ul.menu, ul.menu li {list-style:none; padding:0; margin:0; display:inline;} #mainnav ul li {float:left; position:relative;} #mainnav ul li a { text-decoration:none; color:#1c315f; font-size:1.35rem; font-weight:400; font-family:'Roboto Condensed'; display:block; text-transform:uppercase; padding:13px 30px; margin:0; white-space:nowrap; -webkit-transition: background .3s ease-in-out; -moz-transition: background .3s ease-in-out; -o-transition: background .3s ease-in-out; } #mainnav ul li a:hover { background:#FFF; color:#c9232b;} #mainnav ul ul { position:absolute; top:-99999px; left:0; opacity:0; -webkit-transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; z-index:497; background:#FFF; } #mainnav ul ul li.first {padding-top:7px;} #mainnav ul ul li.last {padding-bottom:11px;} #mainnav ul ul li {height:26px; margin:0; width:100%;} #mainnav ul ul li a {color:#1c315f; font-size:16px; margin:0; padding:8px 12px; text-transform:none; font-weight:300; font-family:'Roboto Condensed';} #mainnav ul ul li a:hover {background:#FFF; color:#c9232b;} #mainnav ul ul ul { position:absolute; top:-99999px; left:100%; opacity: 0; -webkit-transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; border-radius:6px; border:1px solid #444; } #mainnav ul li:hover>ul {opacity: 1; position:absolute; top:99%; left:0;} #mainnav ul ul li:hover>ul {position:absolute; top:0; left:100%; opacity:1; z-index:497; background:#333;} /*****************************************************Footer******************************************************/ footer {width:100%; color:#FFF; vertical-align:top; -webkit-flex:1; -ms-flex:1; flex:1;} .footrow {margin:0 auto;} .footrow ul li {display:inline-block;} .footrow ul {list-style:none;} #footer-top {background-color:#FFF;} .follow {text-align:center; color:#666; font-weight:600; font-size:1.5rem; margin-top:4rem;} #footer-top .footrow:nth-child(1) {text-align:center;} #footer-top .footrow:nth-child(1) li {width:27px; height:27px; padding:13px; margin:10px; line-height:0; border-radius:100%; transition:0.3s all;} #footer-top .footrow:nth-child(1) li.fb {background-color:#3d77cd;} #footer-top .footrow:nth-child(1) li.in {background-color:#c6c194;} #footer-top .footrow:nth-child(1) li.yt {background-color:#f14f4d; padding:13px 15px 13px 11px;} #footer-top .footrow:nth-child(1) li.news {background-color:#efd050; padding:13px 15px 13px 11px;} #footer-top .footrow:nth-child(1) li.pod {background-color:#74a676;} #footer-top .footrow:nth-child(1) i {color:#FFF; font-size:1.65rem;} #footer-top .footrow:nth-child(1) li a {transition:0.3s all; color:#1a4589;} #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:#666;} #footer-bottom .footrow:nth-child(1) {font-size:0.95rem; line-height:1.15rem; font-weight:300; max-width:1100px; text-align:center; font-size:1.1rem; padding:5px 0; justify-content:center; display:flex;} #footer-bottom .footrow:nth-child(1) ul {display:flex; align-items:center; margin:0 auto; text-align:center; list-style:none; padding-bottom:10px;} #footer-bottom .footrow:nth-child(1) li {display:inline-block;padding:0; text-align:center; vertical-align:middle; color:#FFF; font-size:14px; line-height:19px; margin:8px 0 0 0;} #footer-bottom .footrow:nth-child(1) li.address {line-height:1.45rem; padding-right:80px;} #footer-bottom .footrow:nth-child(1) li.contact {line-height:1.45rem;} #footer-bottom .footrow:nth-child(1) a {color:#FFF; transition:all 0.3s;} #footer-bottom .footrow:nth-child(1) a:hover {color:#50d0ff;} #footer-bottom .footrow:nth-child(1) a.footerlogo {width:220px; display:block; margin-right:3rem;} #footer-bottom .footrow:nth-child(2) {background-color:#333; width:100%; overflow:auto; padding:0.33rem 0;} #footer-bottom .footrow:nth-child(2) ul {margin:0 auto; text-align:center; max-width:1100px; list-style:none;} #footer-bottom .footrow:nth-child(2) ul li {display:inline-block; width:19%; text-transform:uppercase; font-size:1rem;} #footer-bottom .footrow:nth-child(2) ul li a {color:#E6E6E6; transition:all 0.3s;} #footer-bottom .footrow:nth-child(2) ul li a:hover {color:#50d0ff;} /**************************************************HOMEPAGE******************************************************/ /*Matrix*/ #matrix {background-color:#1c315f; width:100%;} .matrixbg {width:800px; height:280px; margin:0 auto; position:relative;} .matrix_desc {float:right; width:510px; margin-top:25px;} .matrix_desc h2 {margin-left:20px; font-size:1.6rem; line-height:1.7rem; font-family:'Raleway'; font-weight:400;} .matrix_desc h2 a {color:#FFF;} .matrix_desc p {color:#FFF; font-size:1.0rem; line-height:1.55rem; font-weight:300; margin:10px 10px 10px 20px;} .matriximg { background:url(/images/home/matrix.jpg) no-repeat center center; background-size:240px; top:10%; left:2.5%; position:absolute; text-align:center; width:200px; height:200px; transition:all 0.3s; border-radius:100%; border:12px solid #FFF; } .matriximg:hover {transform:scale(1.03);} /*Matrix form*/ .matrixgrid {display:grid; grid-template-columns:330px 135px; margin:0 0 0.5rem 1.0rem;} .matrixF {width:330px;} .matrixB {width:135px;} /*Cute Icons*/ .cuteicons {margin:2rem 0;} .cuteicons ul {margin:0 auto; text-align: center; width:100%; list-style:none; padding:30px 0;} .cuteicons ul li {display:inline-block; background:none; padding:0; width:30%; vertical-align:top; text-transform:uppercase; font-size:23px; line-height:22px; font-weight:400;} .cuteicons ul li div {margin-top:1.2rem;} .cuteicons .greenicon {color:#7fbf42;} .cuteicons .blueicon {color:#7fb0de;} .cuteicons .orangeicon {color:#f8a545;} .cuteicons .redicon {color:#ca665c;} .cuteicons i {font-size:4.5rem; line-height:5.5rem; margin-top:22px;} .cuteicons i.topcut {font-size:4rem; line-height:5rem; margin-top:25px;} .cuteicon figure { background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, .3), inset 0px 4px 1px 1px white, inset 0px -3px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; border-radius:50%; width:125px; height:125px; /*-moz-box-shadow: 0 0 3px #ccc; -webkit-box-shadow: 0 0 3px #ccc; box-shadow: 0 0 3px #ccc;*/ } .cuteicon figure:hover { -webkit-filter: grayscale(0); filter: grayscale(0); -moz-box-shadow: 0px 12px 28px #ccc; -webkit-box-shadow: 0px 12px 28px #ccc; box-shadow: 0px 12px 28px #ccc; } /*divider*/ hr {border:0; height:1px; background:#76a38f; background-image: linear-gradient(to right, #eaf0e8, #62a088, #eaf0e8); width:90%; margin:0 auto; position: relative;} .divider {text-align:center;} .divider i {font-size:2rem; color:#62a087; margin:0; position:absolute; border:5px solid #FFF; background-color:#FFF; left: 50%; margin-right: -50%; transform:translate(-50%, -50%);} /*Ag Literacy*/ #agliteracy {max-width:900px; margin:0 auto; padding:3rem 0;} .agliteracy_left {float:left; margin:5px; max-width:300px;} .agliteracy_right {float:right; padding-top:15px; max-width:550px;} #agliteracy h2 {font-family:'Raleway'; font-size:2.0rem; line-height:2.2rem; font-weight:400; margin:1.0rem 0.2rem 1.0rem 1.5rem;} #agliteracy .date {font-family:'Raleway'; font-size:1.5rem; line-height:1.7rem; font-weight:400; margin:0.5rem 0.2rem 0.4rem 1.5rem;} #agliteracy .booktitle {font-family:'Open Sans'; font-size:1.2rem; line-height:1.4rem; font-weight:400; margin:0 0 0.4rem 1.5rem; font-style:italic;} #agliteracy .author {font-family:'Open Sans'; font-size:1.1rem; font-weight:400; margin:0 0 0.4rem 1.5rem;} #agliteracy img { background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 6px 8px 0px rgba(0, 0, 0, .3), inset 0px 3px 1px 1px white, inset 0px -2px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(50%); filter: grayscale(50%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; border-radius:2%; border:16px solid #FFF; } #agliteracy img:hover { -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); -moz-box-shadow: 0px 12px 22px #ccc; -webkit-box-shadow: 0px 12px 22px #ccc; box-shadow: 0px 12px 22px #ccc; } .homelink {margin:0.5rem 0.5rem 1.5rem 1.5rem;} .homelink ul li {list-style-type:none; margin:0; padding:6px 0;} .homelink ul li a {padding:0 15px; position:relative; display:block; font-size:1.15rem; line-height:1.35rem; font-weight:300;} .homelink ul li a::before { content:"\f0da"; font-size:1.2rem; font-family:FontAwesome; position:absolute; left:2px; top:0; transition:all .2s; } .homelink ul li a:hover::before {left:6px; color:#00aff0;} .homelink ul span {margin:5px 20px 2px 23px; display:block;} /*Impact*/ #impact_bg {background:#241e2c url("../images/home/bg_impact.jpg") center center no-repeat; width: 100%; overflow: auto;} .impact_area {max-width:1100px; padding:15px; margin: 0 auto;} ul.impact {margin:0 auto; text-align:center; width:100%; list-style:none; padding:30px 0;} ul.impact li {display:inline-block; background:none; padding:0; width:33%; vertical-align: top;} ul.impact li h3 {text-transform:uppercase; font-size:1.5rem; line-height:1.6rem; font-weight:400; margin:15px 0 0 0; color:#FFF;} ul.impact li p {color:#FFF; text-align:center; margin:15px 0 0 0; font-size:0.85rem; line-height:1.0rem;} ul.impact li i {display:inline-block; color:#FFF; font-size:3rem;} /*Podcast*/ #podcast {width:800px; margin:0 auto; padding:2rem 0;} .podcast_logo {float:left; width:26%;} .podcast_right {float:right; width:74%;} .podcast_right h2 {font-family:'Raleway'; font-size:2.0rem; line-height:2.2rem; font-weight:400; color:#3a5d64; margin:1.5rem 0.2rem 0.5rem 1.5rem;} .podcast_right p {margin:0 1.5rem 3rem 1.5rem;} /**************************************************Landing Pages**************************************************/ .landing {min-height:600px; font-size:1.1rem; line-height:1.55rem; font-weight:400; max-width:1100px; margin:calc(6vh + 30px) auto;} .landingcol {-webkit-flex: 1; -ms-flex: 1; flex: 1; position: relative; border: 1px solid rgba(0,0,0,.2); } #landing-columns1 .landingcol:nth-child(1), #landing-columns1 .landingcol:nth-child(2){margin-right:20px;} #landing-columns2 .landingcol:nth-child(1), #landing-columns2 .landingcol:nth-child(2){margin-right:20px;} #landing-columns3 .landingcol:nth-child(1), #landing-columns3 .landingcol:nth-child(2){margin-right:20px;} #landing-twocolumns .landingcol:nth-child(1){margin-right:20px;} #landing-onecolumn {width:46.5%; margin:0 auto; text-align:center;} /* .landingbar { top:0; left:50%; background-color:#1c315f; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position:absolute; text-align:center; width:100.1%; height:20px; } */ section#landing-columns1, section#landing-columns2, section#landing-columns3, section#landing-twocolumns {margin: calc(1.0vh + 15px);} .landingcol h3 { font-family:'Raleway'; font-size:1.6rem !important; line-height:1.8rem !important; text-align:center; font-weight:500 !important; height:70px; margin:1rem 0.5rem; align-items: center; justify-content:center; align-content:right; display: flex; flex-direction: row; flex-wrap: wrap; transition:0.2s all; } .landingcol h3:hover {color:#008eaa !important; transition: all 0.4s;} .landingcol a {color:#1c315f !important; text-decoration: none;} .landingcol a:hover {color:#008eaa !important; transition: all 0.4s;} .text-box {font-size:1.15rem; line-height:1.5rem; padding:20px; font-weight:300;} /*GRANTS*/ .landingcol .grants-pic {height:200px; background-position:center; background-size:cover; background-repeat:no-repeat; transition: all 0.4s;} .grants-pic:hover {opacity:0.8;} #landing-columns1 .landingcol:nth-child(1) .grants-pic {background-image: url(../images/grants/index/agliteracy.jpg);} #landing-columns1 .landingcol:nth-child(2) .grants-pic {background-image: url(../images/grants/index/conference.jpg);} #landing-columns1 .landingcol:nth-child(3) .grants-pic {background-image: url(../images/grants/index/growus.jpg);} /*#landing-onecolumn .landingcol:nth-child(1) .grants-pic {background-image: url(../images/grants/index/read.jpg);}*/ /*RESOURCES*/ .landingcol .resources-pic {height:200px; background-position:center; background-size:cover; background-repeat:no-repeat; transition: all 0.4s;} .resources-pic:hover {opacity:0.8;} #landing-columns1 .landingcol:nth-child(1) .resources-pic {background-image: url(../images/resources/index/matrix.jpg);} #landing-columns1 .landingcol:nth-child(2) .resources-pic {background-image: url(../images/resources/index/lesson.jpg);} #landing-columns1 .landingcol:nth-child(3) .resources-pic {background-image: url(../images/resources/index/archive.jpg);} #landing-columns2 .landingcol:nth-child(1) .resources-pic {background-image: url(../images/resources/index/badge.jpg);} #landing-columns2 .landingcol:nth-child(2) .resources-pic {background-image: url(../images/resources/index/themes.jpg);} #landing-columns2 .landingcol:nth-child(3) .resources-pic {background-image: url(../images/resources/index/course.jpg);} #landing-columns3 .landingcol:nth-child(1) .resources-pic {background-image: url(../images/resources/index/elearn.jpg);} #landing-columns3 .landingcol:nth-child(2) .resources-pic {background-image: url(../images/resources/index/apps.jpg);} #landing-columns3 .landingcol:nth-child(3) .resources-pic {background-image: url(../images/resources/index/agro.jpg);} #landing-onecolumn .landingcol:nth-child(1) .resources-pic {background-image: url(../images/resources/index/next.jpg);} /*PROGRAMS*/ .landingcol .programs-pic {height:200px; background-position:center; background-size:cover; background-repeat:no-repeat; transition: all 0.4s;} .programs-pic:hover {opacity:0.8;} #landing-columns1 .landingcol:nth-child(1) .programs-pic {background-image: url(../images/programs/index/literacy.jpg);} #landing-columns1 .landingcol:nth-child(2) .programs-pic {background-image: url(../images/programs/index/workshops.jpg);} #landing-columns1 .landingcol:nth-child(3) .programs-pic {background-image: url(../images/programs/index/growny.jpg);} #landing-columns2 .landingcol:nth-child(1) .programs-pic {background-image: url(../images/programs/index/outreach.jpg);} #landing-columns2 .landingcol:nth-child(2) .programs-pic {background-image: url(../images/programs/index/mac.jpg);} #landing-columns2 .landingcol:nth-child(3) .programs-pic {background-image: url(../images/programs/index/schoolyard.jpg);} #landing-columns3 .landingcol:nth-child(1) .programs-pic {background-image: url(../images/programs/index/teacheryear.jpg);} #landing-columns3 .landingcol:nth-child(2) .programs-pic {background-image: url(../images/programs/index/topcut.jpg);} #landing-columns3 .landingcol:nth-child(3) .programs-pic {background-image: url(../images/programs/index/virtual.jpg);} /**************************************************SUBPAGE******************************************************/ .subpage {min-height:600px; font-size:1.1rem; line-height:1.55rem; font-weight:400; max-width:1100px; margin:calc(6vh + 30px) auto;} /*#content_wrap {width:98%; padding:0 1% 40px 1%;}*/ #h2_about {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url(../images/default/h2_about.jpg); background-size:cover; background-position: top center;} #h2_agtag {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url(../images/default/h2_agtag.jpg); background-size:cover; background-position: top center;} #h2_contact {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url(../images/default/h2_contact.jpg); background-size:cover; background-position: top center;} #h2_grants {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_grants.jpg"); background-size:cover; background-position: top center;} #h2_grow {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_grow.jpg"); background-size:cover; background-position: top center;} #h2_conf {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_conf.jpg"); background-size:cover; background-position: top center;} #h2_grantsliteracy {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_grantsliteracy.jpg"); background-size:cover; background-position: top center;} #h2_programs {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_programs.jpg"); background-size:cover; background-position: top center;} #h2_agliteracy {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url(../images/default/h2_literacy.jpg); background-size:cover !important; background-position: top center;} #h2_schoolyard {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_schoolyard.jpg"); background-size:cover; background-position: top center;} #h2_beef {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_beef.jpg"); background-size:cover; background-position: top center;} #h2_workshops {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_workshops.jpg"); background-size:cover; background-position: top center;} #h2_teacher {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_teacher.jpg"); background-size:cover; background-position: top center;} #h2_topcut {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_topcut.jpg"); background-size:cover; background-position: top center;} #h2_virtual {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_virtual.jpg"); background-size:cover; background-position: top center;} #h2_still {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_still.jpg"); background-size:cover; background-position: top center;} #h2_mac {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_mac.jpg"); background-size:cover; background-position: top center;} #h2_outreach {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_outreach.jpg"); background-size:cover; background-position: top center;} #h2_resources {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_resources.jpg"); background-size:cover; background-position: top center;} #h2_themes {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_themes.jpg"); margin-bottom:40px; background-size:cover; background-position: center center;} #h2_course {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_course.jpg"); margin-bottom:40px; background-size:cover; background-position: center center;} #h2_sustainability {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_sustainability.jpg"); margin-bottom:40px; background-size:cover; background-position: center center;} #h2_agbadging {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_agbadging.jpg"); margin-bottom:40px; background-size:cover; background-position: center center;} h2.heading {font-family:'Open Sans'; font-size:4.6rem; line-height:4.8rem; font-weight:300; color:#FFF; text-transform:uppercase; letter-spacing:3px; text-align:center; margin:0 1rem; padding:150px 0;} h2.agbadgingH {font-family:'Open Sans'; font-size:3.8rem; line-height:4.0rem; font-weight:300; color:#FFF; text-transform:uppercase; letter-spacing:3px; text-align:center; margin:0 1rem; padding:150px 0;} #h2_matrix {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/default/h2_matrix.jpg"); background-size:cover; background-position: top center;} h2.matrixH {font-family:'Open Sans'; font-size:3.5rem; line-height:3.7rem; font-weight:300; color:#FFF; letter-spacing:3px; text-align:center; margin:0 1rem; padding:150px 0;} .subpage h3 {font-family:'Raleway'; font-weight:500; font-size:2.8rem; line-height:3.0rem; margin:1.5rem 0.2rem 3rem 0.2rem; text-align:center;} .subpage h3.subh3 {margin:2rem 0.2rem 0.2rem 0.2rem !important;} .subpage h4 {font-family:'Raleway'; font-weight:400; font-size:2.0rem; line-height:2.2rem; margin:2.0rem 0.2rem 0.1rem 0.5rem;} .subpage h3.small {font-size:2.5rem; line-height:2.7rem; margin:1.5rem 0.2rem 1rem 0.2rem;} .subpage h4.small {font-size:1.8rem; line-height:2.0rem;} .subpage h5.small {font-size:1.4rem; line-height:1.6rem;} .subpage h5, .subpage h6, .subpage h7 {font-weight:400;} .subpage h5 {font-size:1.6rem; line-height:1.8rem; margin:1rem 0.2rem 0.1rem 0.7rem;} .subpage h6 {font-size:1.4rem; line-height:1.6rem; margin:0.3rem 0.2rem 0.1rem 0.9rem} .subpage h7 {font-size:1.2rem; line-height:1.4rem; margin:0.3rem 0.2rem 0.1rem 1.0rem} .subpage p {margin:0 0.2rem 1rem 1.5rem;} .center {text-align: center; margin:2rem 0.2rem;} .subpage p.br {margin:0 0.2rem 0.2rem 1.5rem;} .subpage p.dent {margin:0 0.2rem 1rem 2.5rem;} .subpage ul, .subpage ol {margin:0 0.2rem 1rem 3rem;} .subpage ul ul {margin:0 0.2rem 0.1rem 1.2rem;} .largep {font-size:1.45rem !important; line-height:1.9rem !important;} .note {font-style:italic;} .rednote {color:#DB0003;} .prizelevel {font-size:1.3rem; line-height:1.6rem;} /*programs/workshops*/ .date {font-size:1.3rem; line-height:1.5rem; font-weight:400; margin:0 0 0.4rem 1.5rem;} /*programs/virtual*/ .trip_info {font-size:1.3rem; line-height:1.6rem; font-weight:400; margin:0.5rem 1rem 1rem 1.5rem;} /*programs/iconart*/ .important {font-size:1.3rem; line-height:1.6rem; color:#E80003; margin-left:1.5rem;} strong {font-weight:600;} address, contact {font-size:1.24rem; line-height:1.9rem; font-style:normal !important; margin:0.2rem 0.2rem 1.5rem 1.5rem;} /*programs/alw,literacy - lesson,resource modal*/ h5.sectionnum {text-align:center; margin:0 auto 2rem auto; font-size:2.3rem; line-height:2.3rem; font-family:'Raleway', sans-serif; text-transform: uppercase; color:#74a676;} h6.sectiontitle {font-size:1.65rem; line-height:1.7rem; font-weight:500; font-family:'Raleway', sans-serif; } .section-grade {font-weight:500; margin-left:1.2rem; font-size:1.35rem; line-height:1.45rem;} .section-purpose {font-weight:500; margin-left:1.2rem; font-size:1.35rem; line-height:1.45rem;} .section-desc {margin:0.2rem 0.5rem 0 1.2rem;} .modal-body .sectionul {margin:0.3rem 0.5rem 2rem 1.8rem !important;} /*programs/beeftours .subpage table {border-collapse:collapse; margin-left:20px; margin-bottom:20px;} .subpage table, th, td {border:1px solid #777; vertical-align middle; padding:5px;} .subpage td.verticaltop {vertical-align:top;} .subpage th {color:#454545; text-align:left;} */ /**************************************************Subcols******************************************************/ .subcol {-webkit-flex:1; -ms-flex:1; flex:1; border:1px solid rgba(0,0,0,.2); position:relative;} #sub-columns1 .subcol:nth-child(1), #sub-columns1 .subcol:nth-child(2){margin-right:20px;} #sub-columns2 .subcol:nth-child(1), #sub-columns2 .subcol:nth-child(2){margin-right:20px;} #sub-columns3 .subcol:nth-child(1), #sub-columns3 .subcol:nth-child(2){margin-right:20px;} #sub-columns4 .subcol:nth-child(1), #sub-columns4 .subcol:nth-child(2){margin-right:20px;} #sub-columns5 .subcol:nth-child(1), #sub-columns5 .subcol:nth-child(2){margin-right:20px;} #sub-twocolumns .subcol:nth-child(1){margin-right:20px;} #sub-onecolumn {width:55%; margin:0 auto;} section#sub-columns1, section#sub-columns2, section#sub-columns3, section#sub-columns4, section#sub-columns5, section#sub-twocolumns, section#sub-onecolumn {margin: calc(1.0vh + 10px);} .subcol h3, .subcol h4 { font-family:'Raleway'; font-size:1.6rem !important; line-height:1.8rem !important; text-align:center; font-weight:500 !important; height:70px; margin:1rem 0.5rem; align-items: center; justify-content:center; align-content:right; display: flex; flex-direction: row; flex-wrap: wrap; transition:0.2s all; } .subcol h3:hover, .subcol h4:hover {color:#008eaa !important; transition: all 0.4s;} .subcol a {color:#1c315f !important; text-decoration: none;} .subcol a:hover {color:#008eaa !important; transition: all 0.4s;} .sub-box {font-size:1.0rem; line-height:1.5rem; padding:20px;} .sub-box ul {list-style:none; margin:0rem 0.1rem 1rem 0.1rem;} .sub-box ul li a {padding:5px 10px; display:block; position:relative; color:#0c63ae;} .sub-box ul li a::before { content:"\f105"; font-family:FontAwesome; color:#0c63ae; position:absolute; left:0; top:5px; transition:all .2s; } .sub-box ul li a:hover::before {left:4px; color:#03a8e5;} .sub-box ul li.notlinked {padding:5px 10px; display:block; position:relative;} .sub-box ul li.notlinked::before {content:"\f105"; font-family:FontAwesome; position:absolute; left:0; top:5px;} .subcol h3.sustain:hover {color:#000 !important;} .sub-box .courselinks {text-align:center; margin:1rem 0.1rem; font-size:1.15rem; line-height:1.4rem;} .sub-box .courselinks a {color:#0c63ae !important; text-decoration: none;} .sub-box .courselinks a:hover {color:#03a8e5 !important; transition: all 0.4s;} /* .subcol h4 {color:#7bb804; font-family:'Raleway'; font-size:1.47rem !important; line-height:1.7rem !important; text-align:center; font-weight:500 !important; height:50px; margin:1rem 0.2rem; align-items: center; justify-content:center; align-content:right; display: flex; flex-direction: row; flex-wrap: wrap; transition:0.2s all; } .subcol h4:hover {color:#00aff0;} .subcol h4.courseh4 {color:#000;} .subcol h3 { font-family:'Raleway'; font-size:1.47rem !important; line-height:1.7rem !important; text-align:center; font-weight:500 !important; height:50px; margin:1rem 0.2rem; align-items: center; justify-content:center; align-content:right; display: flex; flex-direction: row; flex-wrap: wrap; transition:0.2s all; } .subcol h3:hover {} .sub-box {font-size:1rem; font-weight:400; padding:15px; color:#000 !important;}*/ /*resources/themes*/ .subcol .themes-pic {height:220px; background-position:center; background-size:cover; background-repeat:no-repeat; transition: all 0.4s;} .themes-pic:hover {opacity:0.8;} #sub-columns1 .subcol:nth-child(1) .themes-pic {background-image: url(https://agclassroom.org/images/teacher/themes/garden.jpg);} #sub-columns1 .subcol:nth-child(2) .themes-pic {background-image: url(https://agclassroom.org/images/teacher/themes/pollinator.jpg);} #sub-columns1 .subcol:nth-child(3) .themes-pic {background-image: url(https://agclassroom.org/images/teacher/themes/hatching.jpg);} #sub-columns2 .subcol:nth-child(1) .themes-pic {background-image: url(https://agclassroom.org/images/teacher/themes/diversity.jpg);} #sub-columns2 .subcol:nth-child(2) .themes-pic {background-image: url(https://agclassroom.org/images/teacher/themes/source.jpg);} #sub-columns2 .subcol:nth-child(3) .themes-pic {background-image: url(https://agclassroom.org/images/index_teacher/matrix.jpg);} /*resources/course*/ .subcol .course-pic {height:220px; background-position:center; background-size:cover; background-repeat:no-repeat; transition: all 0.4s;} .course-pic:hover {opacity:0.8;} #sub-columns1 .subcol:nth-child(1) .course-pic {background-image: url(https://agclassroom.org/images/teacher/course/tile/integrated.jpg);} #sub-columns1 .subcol:nth-child(2) .course-pic {background-image: url(https://agclassroom.org/images/teacher/course/tile/biology.jpg);} #sub-columns1 .subcol:nth-child(3) .course-pic {background-image: url(https://agclassroom.org/images/teacher/course/tile/environ.jpg);} #sub-columns2 .subcol:nth-child(1) .course-pic {background-image: url(https://agclassroom.org/images/teacher/course/tile/history.jpg);} #sub-columns2 .subcol:nth-child(2) .course-pic {background-image: url(https://agclassroom.org/images/teacher/course/tile/geography.jpg);} #sub-columns2 .subcol:nth-child(3) .course-pic {background-image: url(https://agclassroom.org/images/teacher/course/tile/family.jpg);} /*resources/sustainability*/ .subcol .sustain-pic {height:178px; background-position: center; background-size: cover; background-repeat: no-repeat;} .sustain-pic:hover {opacity:0.8; transition: all 0.4s;} #sub-columns1 .subcol:nth-child(1) .sustain-pic {background-image: url(https://agclassroom.org/images/teacher/sustainability/journey.jpg);} #sub-columns1 .subcol:nth-child(2) .sustain-pic {background-image: url(https://agclassroom.org/images/teacher/sustainability/econ.jpg);} #sub-columns1 .subcol:nth-child(3) .sustain-pic {background-image: url(https://agclassroom.org/images/teacher/sustainability/animals.jpg);} #sub-columns2 .subcol:nth-child(1) .sustain-pic {background-image: url(https://agclassroom.org/images/teacher/sustainability/food.jpg);} #sub-columns2 .subcol:nth-child(2) .sustain-pic {background-image: url(https://agclassroom.org/images/teacher/sustainability/supply.jpg);} #sub-columns2 .subcol:nth-child(3) .sustain-pic {background-image: url(https://agclassroom.org/images/teacher/sustainability/water.jpg);} #sub-twocolumns .subcol:nth-child(1) .sustain-pic {background-image: url(https://agclassroom.org/images/teacher/sustainability/soil.jpg); height:260px;} #sub-twocolumns .subcol:nth-child(2) .sustain-pic {background-image: url(https://agclassroom.org/images/teacher/sustainability/action.jpg); height:260px;} /*teacher/integratedscience, environmentalscience, biology Grid*/ .course_twogrid { display:grid; margin:1rem 10%; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); } .course_twogrid > div { -webkit-flex: 1; -ms-flex: 1; flex: 1; } .course_twogrid > div ul {margin-bottom:0;} /********************************************Subpages Columns******************************************************/ /*programs/topcut*/ .grid4cols .topcut-lessons {background-image: url(../images/programs/topcut/column/lessons.jpg);} .grid4cols .topcut-fieldtrips {background-image: url(../images/programs/topcut/column/fieldtrips.jpg);} .grid4cols .topcut-toolkits {background-image: url(../images/programs/topcut/column/toolkits.jpg);} .grid4cols .topcut-classroom {background-image: url(../images/programs/topcut/column/classroom.jpg);} /*programs/topcut*/ .topcutcol {-webkit-flex: 1; -ms-flex: 1; flex: 1; position: relative; border-bottom-right-radius:3px; border-bottom-left-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #topcutcol-column .topcutcol:nth-child(1), #topcutcol-column .topcutcol:nth-child(2), #topcutcol-column .topcutcol:nth-child(3) {margin-right:15px;} .topcutbar {background-color:#FAFAFA; border-top:8px solid #c17d05; font-size:1.2rem; line-height:1.4rem; -webkit-flex: 1; -ms-flex: 1; flex: 1;} .topcutcol .topcut-pic {height:180px; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;} .topcut-pic:hover {opacity:0.8; transition: all 0.4s;} #topcutcol-column .topcutcol:nth-child(1) .topcut-pic {background-image:url(../images/programs/topcut/column/lessons.jpg);} #topcutcol-column .topcutcol:nth-child(2) .topcut-pic {background-image:url(../images/programs/topcut/column/fieldtrips.jpg);} #topcutcol-column .topcutcol:nth-child(3) .topcut-pic {background-image:url(../images/programs/topcut/column/toolkits.jpg);} #topcutcol-column .topcutcol:nth-child(4) .topcut-pic {background-image:url(../images/programs/topcut/column/classroom.jpg);} section#topcutcol-column {margin:calc(1vh + 1px) calc(1vh + 5px) calc(3vh + 10px) calc(1vh + 5px);} .topcutcol h5 { text-align:center; font-family:'Raleway'; transition:all 0.3s; font-size:1.45rem; line-height:1.5rem; height:60px; margin:1rem 0.5rem !important; align-items:center; justify-content:center; display:flex; flex-direction:row; flex-wrap:wrap; } .topcutcol a {color:#c17d05;} .topcutcol a:hover {color:#704803;} /*programs/schoolyard*/ .schoolyardcol {-webkit-flex: 1; -ms-flex: 1; flex: 1; position: relative; border-bottom-right-radius:3px; border-bottom-left-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #schoolyard-column .schoolyardcol:nth-child(1), #schoolyard-column .schoolyardcol:nth-child(2), #schoolyard-column .schoolyardcol:nth-child(3) {margin-right:15px;} .schoolyardbar {background-color:#FAFAFA; border-top:8px solid #8b1f03; font-size:1.2rem; line-height:1.4rem; -webkit-flex: 1; -ms-flex: 1; flex: 1;} .schoolyardcol .schoolyard-pic {height:180px; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;} .schoolyard-pic:hover {opacity:0.8; transition: all 0.4s;} #schoolyard-column .schoolyardcol:nth-child(1) .schoolyard-pic {background-image:url(../images/programs/schoolyard/column/sugarbush.jpg);} #schoolyard-column .schoolyardcol:nth-child(2) .schoolyard-pic {background-image:url(../images/programs/schoolyard/column/sugarhouse.jpg);} #schoolyard-column .schoolyardcol:nth-child(3) .schoolyard-pic {background-image:url(../images/programs/schoolyard/column/classroom.jpg);} #schoolyard-column .schoolyardcol:nth-child(4) .schoolyard-pic {background-image:url(../images/programs/schoolyard/column/about.jpg);} section#schoolyard-column {margin:calc(1vh + 1px) calc(1vh + 5px) calc(3vh + 10px) calc(1vh + 5px);} .schoolyardcol h5 { text-align:center; font-family:'Raleway'; transition:all 0.3s; font-size:1.45rem; line-height:1.5rem; height:60px; margin:1rem 0.5rem !important; align-items:center; justify-content:center; display:flex; flex-direction:row; flex-wrap:wrap; } .schoolyardcol a {color:#8b1f03;} .schoolyardcol a:hover {color:#b74a2d;} h4.sy {font-size:1.13rem; line-height:1.23rem; margin-left:2rem;} h4.sy a {padding:0 1rem; position:relative; display:block; font-size:1.35rem; line-height:1.55rem;} h4.sy a::before { /*YouTube*/ content:"\f431"; font-size:1.2rem; font-family:FontAwesome; position:absolute; left:-7px; top:0; transition:all .2s; } h4.sy a:hover::before {color:#00aff0;} /*Document*/ h4.sy a.doc::before {content:"\f15c";} /*Website*/ h4.sy a.web::before {content:"\f390"; font-size:1.1rem;} /*programs/alw*/ .alwcol {-webkit-flex: 1; -ms-flex: 1; flex: 1; position: relative; border-bottom-right-radius:3px; border-bottom-left-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #alwcol-column .alwcol:nth-child(1), #alwcol-column .alwcol:nth-child(2) {margin-right:15px;} .alwbar {background-color:#FAFAFA; border-top:8px solid #7bb804; font-size:1.2rem; line-height:1.4rem; -webkit-flex: 1; -ms-flex: 1; flex: 1;} .alwcol .alw-pic {height:200px; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;} .alw-pic:hover {opacity:0.8; transition: all 0.4s;} #alwcol-column .alwcol:nth-child(1) .alw-pic {background-image:url(../images/programs/alw/lessons.jpg);} #alwcol-column .alwcol:nth-child(2) .alw-pic {background-image:url(../images/programs/alw/multimedia.jpg);} #alwcol-column .alwcol:nth-child(3) .alw-pic {background-image:url(../images/programs/alw/books.jpg);} section#alwcol-column {margin:calc(1vh + 1px) calc(1vh + 5px) calc(3vh + 10px) calc(1vh + 5px);} .alwcol h5 { text-align:center; font-family:'Raleway'; transition:all 0.3s; font-size:1.7rem; line-height:1.9rem; height:60px; margin:1rem 0.5rem !important; align-items:center; justify-content:center; display:flex; flex-direction:row; flex-wrap:wrap; } /*programs/growny*/ .grownycol {-webkit-flex: 1; -ms-flex: 1; flex: 1; position: relative; border-bottom-right-radius:3px; border-bottom-left-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #grownycol-column .grownycol:nth-child(1), #grownycol-column .grownycol:nth-child(2), #grownycol-column .grownycol:nth-child(3) {margin-right:10px;} .grownybar {background-color:#FAFAFA; border-top:8px solid #7bb804; font-size:1.2rem; line-height:1.4rem; -webkit-flex: 1; -ms-flex: 1; flex: 1;} .grownycol .growny-pic {height:160px; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;} .growny-pic:hover {opacity:0.8; transition: all 0.4s;} #grownycol-column .grownycol:nth-child(1) .growny-pic {background-image:url(../images/programs/growny/project/instructions.jpg);} #grownycol-column .grownycol:nth-child(2) .growny-pic {background-image:url(../images/programs/growny/project/milestones.jpg);} #grownycol-column .grownycol:nth-child(3) .growny-pic {background-image:url(../images/programs/growny/project/template.jpg);} #grownycol-column .grownycol:nth-child(4) .growny-pic {background-image:url(../images/programs/growny/project/rubric.jpg);} section#grownycol-column {margin:calc(1vh + 1px) calc(1vh + 5px) calc(3vh + 10px) calc(1vh + 5px);} .grownycol h6 { text-align:center; font-family:'Raleway'; transition:all 0.3s; font-size:1.3rem; line-height:1.5rem; height:60px; margin:1rem 0.5rem !important; align-items:center; justify-content:center; display:flex; flex-direction:row; flex-wrap:wrap; } /*programs/outreach .outreachcol {-webkit-flex: 1; -ms-flex: 1; flex: 1; position: relative; border-bottom-right-radius:3px; border-bottom-left-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #outreachcol-column .outreachcol:nth-child(1), #outreachcol-column .outreachcol:nth-child(2) {margin-right:15px;} .outreachbar {background-color:#FAFAFA; border-top:8px solid #7bb804; font-size:1.2rem; line-height:1.4rem; -webkit-flex: 1; -ms-flex: 1; flex: 1;} .outreachcol .outreach-pic {height:200px; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;} .outreach-pic:hover {opacity:0.8; transition: all 0.4s;} #outreachcol-column .outreachcol:nth-child(1) .outreach-pic {background-image:url(../images/programs/outreach/lessons.jpg);} #outreachcol-column .outreachcol:nth-child(2) .outreach-pic {background-image:url(../images/programs/outreach/multimedia.jpg);} #outreachcol-column .outreachcol:nth-child(3) .outreach-pic {background-image:url(../images/programs/outreach/books.jpg);} section#outreachcol-column {margin:calc(1vh + 1px) calc(1vh + 5px) calc(3vh + 10px) calc(1vh + 5px);} .outreachcol h5 { text-align:center; font-family:'Raleway'; transition:all 0.3s; font-size:1.7rem; line-height:1.9rem; height:60px; margin:1rem 0.5rem !important; align-items:center; justify-content:center; display:flex; flex-direction:row; flex-wrap:wrap; }*/ /*2cols*/ .grid2cols {display:grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); grid-gap:1.5rem; margin:3rem 0;} .grid2cols > div {background-color:#FAFAFA; border-top:8px solid #7bb804; font-size:1.2rem; line-height:1.4rem; padding-bottom:1rem; border-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-flex: 1; -ms-flex: 1; flex: 1;} /*.twocols:nth-child(-n + 2) {grid-column: span 1;}*/ .twocols {height:320px; background-position:top center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;} .twocols:hover {opacity:0.8;} .grid2cols h4 { font-family:'Raleway'; font-size:1.85rem !important; line-height:1.9rem !important; text-align:center; font-weight:400; height:35px; margin:1rem 0.5rem; align-items:center; justify-content:center; align-content:right; display:flex; flex-direction:row; flex-wrap: wrap; transition:0.2s all; } .grid2cols h5 { font-family:'Raleway'; font-size:1.65rem !important; line-height:1.7rem !important; text-align:center; font-weight:400; height:35px; margin:1rem 0.5rem; align-items:center; justify-content:center; align-content:right; display:flex; flex-direction:row; flex-wrap: wrap; transition:0.2s all; } .grid2cols ul {margin:0 0.5rem 1rem 2rem;} .grid2cols ul li {list-style-type:none; margin:0; padding:0.2rem 0;} .grid2cols ul li a {padding:0 1rem; position:relative; display:block; font-size:1.1rem;} .grid2cols ul li a::before { content:"\f0da"; font-size:1.3rem; font-family:FontAwesome; position:absolute; left:2px; top:0; transition:all .2s; } .grid2cols ul li a:hover::before {left:6px; color:#00aff0;} .comm-description {font-size:1.1rem; line-height:1.4rem; font-weight:300; margin:1rem;} /*resources/agmap_comm-apples*/ .grid2cols .apples-dig {background-image: url(../images/resources/agmap/commodities/apples/dig.jpg);} .grid2cols .apples-lessons {background-image: url(../images/resources/agmap/commodities/apples/lessons.jpg);} /*resources/agmap_comm-aquaculture*/ .grid2cols .aquaculture-dig {background-image: url(../images/resources/agmap/commodities/aquaculture/dig.jpg);} .grid2cols .aquaculture-lessons {background-image: url(../images/resources/agmap/commodities/aquaculture/lessons.jpg);} /*resources/agmap_comm-cabbage*/ .grid2cols .cabbage-dig {background-image: url(../images/resources/agmap/commodities/cabbage/dig.jpg);} .grid2cols .cabbage-lessons {background-image: url(../images/resources/agmap/commodities/cabbage/lessons.jpg);} /*resources/agmap_comm-cheese*/ .grid2cols .cheese-dig {background-image: url(../images/resources/agmap/commodities/cheese/dig.jpg);} .grid2cols .cheese-lessons {background-image: url(../images/resources/agmap/commodities/cheese/lessons.jpg);} /*resources/agmap_comm-cherries*/ .grid2cols .cherries-dig {background-image: url(../images/resources/agmap/commodities/cherries/dig.jpg);} .grid2cols .cherries-lessons {background-image: url(../images/resources/agmap/commodities/cherries/lessons.jpg);} /*resources/agmap_comm-chickens*/ .grid2cols .chickens-dig {background-image: url(../images/resources/agmap/commodities/chickens/dig.jpg);} .grid2cols .chickens-lessons {background-image: url(../images/resources/agmap/commodities/chickens/lessons.jpg);} /*resources/agmap_comm-corn*/ .grid2cols .corn-dig {background-image: url(../images/resources/agmap/commodities/corn/dig.jpg);} .grid2cols .corn-lessons {background-image: url(../images/resources/agmap/commodities/corn/lessons.jpg);} /*resources/agmap_comm-processing*/ .grid2cols .processing-dig {background-image: url(../images/resources/agmap/commodities/processing/dig.jpg);} .grid2cols .processing-lessons {background-image: url(../images/resources/agmap/commodities/processing/lessons.jpg);} /*resources/agmap_comm-equine*/ .grid2cols .equine-dig {background-image: url(../images/resources/agmap/commodities/equine/dig.jpg);} .grid2cols .equine-lessons {background-image: url(../images/resources/agmap/commodities/equine/lessons.jpg);} /*resources/agmap_comm-grains*/ .grid2cols .grains-dig {background-image: url(../images/resources/agmap/commodities/grains/dig.jpg);} .grid2cols .grains-lessons {background-image: url(../images/resources/agmap/commodities/grains/lessons.jpg);} /*resources/agmap_comm-grapes*/ .grid2cols .grapes-dig {background-image: url(../images/resources/agmap/commodities/grapes/dig.jpg);} .grid2cols .grapes-lessons {background-image: url(../images/resources/agmap/commodities/grapes/lessons.jpg);} /*resources/agmap_comm-greenbeans*/ .grid2cols .greenbeans-dig {background-image: url(../images/resources/agmap/commodities/greenbeans/dig.jpg);} .grid2cols .greenbeans-lessons {background-image: url(../images/resources/agmap/commodities/greenbeans/lessons.jpg);} /*resources/agmap_comm-hay*/ .grid2cols .hay-dig {background-image: url(../images/resources/agmap/commodities/hay/dig.jpg);} .grid2cols .hay-lessons {background-image: url(../images/resources/agmap/commodities/hay/lessons.jpg);} /*resources/agmap_comm-honey*/ .grid2cols .honey-dig {background-image: url(../images/resources/agmap/commodities/honey/dig.jpg);} .grid2cols .honey-lessons {background-image: url(../images/resources/agmap/commodities/honey/lessons.jpg);} /*resources/agmap_comm-horticulture*/ .grid2cols .horticulture-dig {background-image: url(../images/resources/agmap/commodities/horticulture/dig.jpg);} .grid2cols .horticulture-lessons {background-image: url(../images/resources/agmap/commodities/horticulture/lessons.jpg);} /*resources/agmap_comm-peas*/ .grid2cols .peas-dig {background-image: url(../images/resources/agmap/commodities/peas/dig.jpg);} .grid2cols .peas-lessons {background-image: url(../images/resources/agmap/commodities/peas/lessons.jpg);} /*resources/agmap_comm-pigs*/ .grid2cols .pigs-dig {background-image: url(../images/resources/agmap/commodities/pigs/dig.jpg);} .grid2cols .pigs-lessons {background-image: url(../images/resources/agmap/commodities/pigs/lessons.jpg);} /*resources/agmap_comm-potatoes*/ .grid2cols .potatoes-dig {background-image: url(../images/resources/agmap/commodities/potatoes/dig.jpg);} .grid2cols .potatoes-lessons {background-image: url(../images/resources/agmap/commodities/potatoes/lessons.jpg);} /*resources/agmap_comm-sheep*/ .grid2cols .sheep-dig {background-image: url(../images/resources/agmap/commodities/sheep/dig.jpg);} .grid2cols .sheep-lessons {background-image: url(../images/resources/agmap/commodities/sheep/lessons.jpg);} /*resources/agmap_comm-soybeans*/ .grid2cols .soybeans-dig {background-image: url(../images/resources/agmap/commodities/soybeans/dig.jpg);} .grid2cols .soybeans-lessons {background-image: url(../images/resources/agmap/commodities/soybeans/lessons.jpg);} /*resources/agmap_comm-timber*/ .grid2cols .timber-dig {background-image: url(../images/resources/agmap/commodities/timber/dig.jpg);} .grid2cols .timber-lessons {background-image: url(../images/resources/agmap/commodities/timber/lessons.jpg);} /*resources/agmap_classroom*/ .grid2cols .primary {background-image: url(../images/resources/agmap/classroom/primary.jpg);} .grid2cols .inter {background-image: url(../images/resources/agmap/classroom/inter.jpg);} .grid2cols .middle {background-image: url(../images/resources/agmap/classroom/middle.jpg);} .grid2cols .high {background-image: url(../images/resources/agmap/classroom/high.jpg);} .class-description {font-size:1.3rem; line-height:1.4rem; text-align:center; margin:1rem 0.5rem;} /*programs/outreach*/ .grid2cols .outreach-matrix {background-image: url(../images/programs/outreach/tile-matrix.jpg);} .grid2cols .outreach-d75 {background-image: url(../images/programs/outreach/tile-d75.jpg);} .grid2cols .outreach-materials {background-image: url(../images/programs/outreach/tile-material.jpg);} .grid2cols .outreach-places {background-image: url(../images/programs/outreach/tile-places.jpg);} /*grants/grow*/ .grid2cols .grow-tower {background-image: url(../images/grants/grow/tower.jpg);} .grid2cols .grow-2445 {background-image: url(../images/grants/grow/2445.jpg);} /*3cols*/ .grid3cols {display:grid; grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)); grid-gap:1.5rem; margin:1rem 0;} .grid3cols > div {background-color:#FAFAFA; border-top:8px solid #7bb804; font-size:1.2rem; line-height:1.4rem; border-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-flex: 1; -ms-flex: 1; flex: 1;} /*.threecols:nth-child(-n + 4) {grid-column: span 1;}*/ .threecols {background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;} .threecols:hover {opacity:0.8;} .grid3cols h3, .grid3cols h4 { font-family:'Raleway'; font-size:1.5rem !important; line-height:1.6rem !important; text-align:center; font-weight:400; height:45px; margin:1rem 0.5rem; align-items:center; justify-content:center; align-content:right; display:flex; flex-direction:row; flex-wrap: wrap; transition:0.2s all; } .grid3cols h5 {/*eLearning*/ font-family:'Raleway'; font-size:1.7rem; line-height:1.9rem; text-align:center; font-weight:400; height:60px; margin:1rem 0.2rem; align-items: center; justify-content:center; align-content:right; display: flex; flex-direction: row; flex-wrap: wrap; transition:0.2s all; } .grid3cols ul {margin:0 0.5rem 1rem 1rem;} .grid3cols ul li {list-style-type:none; margin:0; padding:0.2rem 0;} .grid3cols ul li a {padding:0 1rem; position:relative; display:block; font-size:1.05rem;} .grid3cols ul li a::before { content:"\f0da"; font-size:1.3rem; font-family:FontAwesome; position:absolute; left:2px; top:0; transition:all .2s; } .grid3cols ul li a:hover::before {left:6px; color:#00aff0;} /*resources/agmap*/ .h220px {height:220px;} .grid3cols .agmap-classroom {background-image: url(../images/resources/agmap/classroom.jpg);} .grid3cols .agmap-commodities {background-image: url(../images/resources/agmap/commodities.jpg);} .grid3cols .agmap-about {background-image: url(../images/resources/agmap/about.jpg);} .agmap-description {font-size:1.15rem; line-height:1.55rem; margin:1rem 0.5rem; font-weight:300; height:120px;} .button_agmap {width:91%; margin:2rem auto 2rem auto; font-size:1.0rem;} /*resources/agmap_comm-beef*/ .grid3cols .beef-dig {background-image: url(../images/resources/agmap/commodities/beef/dig.jpg);} .grid3cols .beef-lessons {background-image: url(../images/resources/agmap/commodities/beef/lessons.jpg);} .grid3cols .beef-add {background-image: url(../images/resources/agmap/commodities/beef/add.jpg);} /*resources/agmap_comm-christmas*/ .grid3cols .christmas-dig {background-image: url(../images/resources/agmap/commodities/christmas/dig.jpg);} .grid3cols .christmas-lessons {background-image: url(../images/resources/agmap/commodities/christmas/lessons.jpg);} .grid3cols .christmas-add {background-image: url(../images/resources/agmap/commodities/christmas/add.jpg);} /*resources/agmap_comm-dairy*/ .grid3cols .dairy-dig {background-image: url(../images/resources/agmap/commodities/dairy/dig.jpg);} .grid3cols .dairy-lessons {background-image: url(../images/resources/agmap/commodities/dairy/lessons.jpg);} .grid3cols .dairy-add {background-image: url(../images/resources/agmap/commodities/dairy/add.jpg);} /*resources/agmap_comm-icecream*/ .grid3cols .icecream-dig {background-image: url(../images/resources/agmap/commodities/icecream/dig.jpg);} .grid3cols .icecream-lessons {background-image: url(../images/resources/agmap/commodities/icecream/lessons.jpg);} .grid3cols .icecream-add {background-image: url(../images/resources/agmap/commodities/icecream/add.jpg);} /*resources/agmap_comm-maple*/ .grid3cols .maple-dig {background-image: url(../images/resources/agmap/commodities/maple/dig.jpg);} .grid3cols .maple-lessons {background-image: url(../images/resources/agmap/commodities/maple/lessons.jpg);} .grid3cols .maple-add {background-image: url(../images/resources/agmap/commodities/maple/add.jpg);} /*resources/eLearning*/ .h330px {height:330px;} .grid3cols .elearn-better {background-image: url(../images/resources/elearning/better.jpg);} .grid3cols .elearn-bread {background-image: url(../images/resources/elearning/bread.jpg);} .grid3cols .elearn-dna {background-image: url(../images/resources/elearning/dna.jpg);} .grid3cols .elearn-edible {background-image: url(../images/resources/elearning/edible.jpg);} .grid3cols .elearn-endless {background-image: url(../images/resources/elearning/endless.jpg);} .grid3cols .elearn-farm {background-image: url(../images/resources/elearning/farm.jpg);} .grid3cols .elearn-farming {background-image: url(../images/resources/elearning/farming.jpg);} .grid3cols .elearn-honey {background-image: url(../images/resources/elearning/honey.jpg);} .grid3cols .elearn-make {background-image: url(../images/resources/elearning/make.jpg);} .grid3cols .elearn-my {background-image: url(../images/resources/elearning/my.jpg);} .grid3cols .elearn-plant {background-image: url(../images/resources/elearning/plant.jpg);} .grid3cols .elearn-sprouting {background-image: url(../images/resources/elearning/sprouting.jpg);} /*4cols*/ .grid4cols { display:grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap:0.7rem; margin:1rem 0; } .grid4cols > div {background-color:#FAFAFA; padding:0.6rem; font-size:1.2rem; line-height:1.4rem; border-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-flex: 1; -ms-flex: 1; flex: 1;} .fourcols:nth-child(-n + 4) {grid-column: span 1;} .fourcols {height:180px; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s;} .fourcols:hover {transform: scale(1.05);} .grid4cols h4 { font-family:'Raleway'; font-size:1.44rem !important; line-height:1.5rem !important; text-align:center; font-weight:400; height:45px; margin:1rem 0.5rem; align-items:center; justify-content:center; align-content:right; display:flex; flex-direction:row; flex-wrap: wrap; transition:0.2s all; } .grid4cols h5 { text-align:center; font-family:'Raleway'; transition:all 0.3s; font-size:1.6rem; line-height:1.65rem; height:60px; margin:1rem 0.5rem !important; align-items:center; justify-content:center; display:flex; flex-direction:row; flex-wrap:wrap; } /*resources/lesson_toolkits-Soil*/ .grid4cols .soil_toolkit {background-image: url(../images/resources/lesson/toolkits/soil/toolkit.jpg);} .grid4cols .soil_overview {background-image: url(../images/resources/lesson/toolkits/soil/overview.jpg);} .grid4cols .soil_teacher {background-image: url(../images/resources/lesson/toolkits/soil/teacher.jpg);} .grid4cols .soil_student {background-image: url(../images/resources/lesson/toolkits/soil/student.jpg);} /*resources/lesson_toolkits-Genetics*/ .grid4cols .genetics_toolkit {background-image: url(../images/resources/lesson/toolkits/genetics/toolkit.jpg);} .grid4cols .genetics_overview {background-image: url(../images/resources/lesson/toolkits/genetics/overview.jpg);} .grid4cols .genetics_teacher {background-image: url(../images/resources/lesson/toolkits/genetics/teacher.jpg);} .grid4cols .genetics_student {background-image: url(../images/resources/lesson/toolkits/genetics/student.jpg);} /*resources/lesson_toolkits-Water*/ .grid4cols .water_toolkit {background-image: url(../images/resources/lesson/toolkits/water/toolkit.jpg);} .grid4cols .water_overview {background-image: url(../images/resources/lesson/toolkits/water/overview.jpg);} .grid4cols .water_teacher {background-image: url(../images/resources/lesson/toolkits/water/guide.jpg);} .grid4cols .water_student {background-image: url(../images/resources/lesson/toolkits/water/student.jpg);} /*resources/agmap-commodities - NOT USED*/ .grid4cols .apples {background-image: url(../images/resources/agmap/commodities/apples.jpg);} .grid4cols .beef {background-image: url(../images/resources/agmap/commodities/beef.jpg);} .grid4cols .cabbage {background-image: url(../images/resources/agmap/commodities/cabbage.jpg);} .grid4cols .cheese {background-image: url(../images/resources/agmap/commodities/cheese.jpg);} .grid4cols .cherries {background-image: url(../images/resources/agmap/commodities/cherries.jpg);} .grid4cols .chickens {background-image: url(../images/resources/agmap/commodities/chickens.jpg);} .grid4cols .christmas {background-image: url(../images/resources/agmap/commodities/christmas.jpg);} .grid4cols .corn {background-image: url(../images/resources/agmap/commodities/corn.jpg);} .grid4cols .aquaculture {background-image: url(../images/resources/agmap/commodities/aquaculture.jpg);} .grid4cols .dairy {background-image: url(../images/resources/agmap/commodities/dairy.jpg);} .grid4cols .processing {background-image: url(../images/resources/agmap/commodities/processing.jpg);} .grid4cols .grains {background-image: url(../images/resources/agmap/commodities/grains.jpg);} .grid4cols .grapes {background-image: url(../images/resources/agmap/commodities/grapes.jpg);} .grid4cols .greenbeans {background-image: url(../images/resources/agmap/commodities/greenbeans.jpg);} .grid4cols .hay {background-image: url(../images/resources/agmap/commodities/hay.jpg);} .grid4cols .honey {background-image: url(../images/resources/agmap/commodities/honey.jpg);} .grid4cols .horticulture {background-image: url(../images/resources/agmap/commodities/horticulture.jpg);} .grid4cols .equine {background-image: url(../images/resources/agmap/commodities/equine.jpg);} .grid4cols .icecream {background-image: url(../images/resources/agmap/commodities/icecream.jpg);} .grid4cols .maple {background-image: url(../images/resources/agmap/commodities/maple.jpg);} .grid4cols .peas {background-image: url(../images/resources/agmap/commodities/peas.jpg);} .grid4cols .pigs {background-image: url(../images/resources/agmap/commodities/pigs.jpg);} .grid4cols .potatoes {background-image: url(../images/resources/agmap/commodities/potatoes.jpg);} .grid4cols .sheep {background-image: url(../images/resources/agmap/commodities/sheep.jpg);} .grid4cols .soybeans {background-image: url(../images/resources/agmap/commodities/soybeans.jpg);} .grid4cols .timber {background-image: url(../images/resources/agmap/commodities/timber.jpg);} /*resources/archive_contest*/ .artcontestgrid { display:grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap:1.5rem; margin:1rem 0; } /*.artpic:nth-child(n + 3) { grid-column: span 3; }*/ .artpic {height:180px; padding:0.6rem; border-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-flex: 1; -ms-flex: 1; flex: 1; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s; position:relative; } .artpic:hover {transform: scale(1.05);} .artcontestgrid .win2017 {background-image: url(../images/resources/archive/contest/win2017.jpg);} .artcontestgrid .win2016 {background-image: url(../images/resources/archive/contest/win2016.jpg);} .artcontestgrid .win2015 {background-image: url(../images/resources/archive/contest/win2015.jpg);} .artcontestgrid .win2014 {background-image: url(../images/resources/archive/contest/win2014.jpg);} .artcontestgrid .win2013 {background-image: url(../images/resources/archive/contest/win2013.jpg);} .artcontestgrid .win2012 {background-image: url(../images/resources/archive/contest/win2012.jpg);} .artcontestgrid .win2011 {background-image: url(../images/resources/archive/contest/win2011.jpg);} .artcontestgrid h6 {align-items:center; justify-content:center; display:flex; height:180px; font-family:'Raleway'; font-size:3rem !important; line-height:3rem !important; font-weight:500; text-shadow:1px 1px 2px #000; text-align:center; margin:0 0.2rem;} .artcontestgrid a {color:#000;} /*resources/agmap*/ #agmap1 {background-color:#1c315f; width:100%; margin-top:0;} .agmap1 {display:grid; grid-gap:2.5rem; grid-template-columns:320px auto; max-width:1000px; margin:0 auto;} .agmap1 > div {} .agmap1_desc {position:relative; top:63%; transform:translateY(-50%);} .agmap1_desc h2 {margin-top:1.5rem; font-size:2.0rem; line-height:2.2rem; font-family:'Raleway'; font-weight:400;} .agmap1_desc h2 a {color:#FFF;} .agmap1_desc p {color:#FFF; font-size:1.2rem; line-height:1.75rem; font-weight:300; margin:0.5rem 2rem 0.5rem 0;} .agmap1img { background:url(../images/resources/agmap/map.jpg) no-repeat center center; background-size:280px; margin:3rem 0 3rem 3rem; width:240px; height:240px; transition:all 0.3s; border-radius:100%; border:12px solid #FFF; } .agmap1img:hover {transform:scale(1.03);} .agmap1 button {margin-left:0;} /*resources/agmap*/ /*#agmaph2 {margin-bottom:40px;}*/ #h2_agmap-about {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/landing-about.jpg"); background-size:cover; background-position: top center;} #h2_agmap-classroom {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/landing-classroom.jpg"); background-size:cover; background-position: top center;} #h2_agmap-commodities {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/landing-commodities.jpg"); background-size:cover; background-position: top center;} /*resources/agmap-comm-*/ #h2_agmap-comm-apples {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-apples.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-beef {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-beef.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-cabbage {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-cabbage.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-cheese {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-cheese.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-cherries {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-cherries.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-chickens {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-chickens.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-christmas {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-christmas.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-corn {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-corn.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-aquaculture {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-aquaculture.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-dairy {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-dairy.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-processing {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-processing.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-equine {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-equine.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-grains {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-grains.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-grapes {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-grapes.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-greenbeans {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-greenbeans.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-hay {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-hay.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-honey {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-honey.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-horticulture {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-horticulture.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-icecream {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-icecream.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-maple {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-maple.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-peas {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-peas.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-pigs {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-pigs.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-potatoes {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-potatoes.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-sheep {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-sheep.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-soybeans {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-soybeans.jpg"); background-size:cover; background-position: top center;} #h2_agmap-comm-timber {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/agmap/h2/comm-timber.jpg"); background-size:cover; background-position: top center;} h2.agmapH {font-family:'Open Sans'; font-size:3.5rem; line-height:3.7rem; text-transform:uppercase; font-weight:300; color:#FFF; letter-spacing:3px; text-align:center; margin:0 1rem; padding:150px 0;} h2.agmap-commoditiesH {font-family:'Open Sans'; font-size:5.5rem; line-height:5.8rem; text-transform:uppercase; font-weight:300; color:#FFF; letter-spacing:3px; text-align:center; margin:0 1rem; padding:150px 0;} h2.agmap-commoditiesHL {font-family:'Open Sans'; font-size:4.0rem; line-height:4.2rem; text-transform:uppercase; font-weight:300; color:#FFF; letter-spacing:3px; text-align:center; margin:0 1rem; padding:150px 0;} /*resources/agmap_about*/ #agmapart {width:100%; background-color:#000; padding:1rem 0;} #agmapart_wrapper {max-width:1100px; margin:0 auto; text-align:center; } .agmapartgrid {display:grid; grid-template-columns: repeat(6, 1fr); grid-gap:0.5rem; margin:0 auto;} .agmapartgrid > div {padding:0; margin:0;} .agmapartgrid > div img {transition:all 0.3s;} .agmapartgrid > div img:hover {transform:scale(1.03);} /*resources/agmap_about*/ .button_nasswrap { grid-template-rows:30px; grid-template-columns:350px; grid-gap:0.5rem; margin:0.5rem auto; display:flex; justify-content:center; } .button_nass {width:350px; margin:2rem auto 2rem auto; font-size:1.1rem;} /*resources/agmap-commodities - if NY doesn't like this, change it to grid4cols*/ .commoditygrid2 { display:grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap:1.5rem; margin:1rem 0; } .commodity2:nth-child(-n + 4) { grid-column: span 1; } .commodity2 {height:180px; padding:0.6rem; border-radius:3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-flex: 1; -ms-flex: 1; flex: 1; background-position:center; background-size:cover; background-repeat:no-repeat; transition:all 0.3s; position:relative; } .commodity2:hover {transform: scale(1.05);} .commoditygrid2 .apples {background-image: url(../images/resources/agmap/commodities/apples.jpg);} .commoditygrid2 .beef {background-image: url(../images/resources/agmap/commodities/beef.jpg);} .commoditygrid2 .cabbage {background-image: url(../images/resources/agmap/commodities/cabbage.jpg);} .commoditygrid2 .cheese {background-image: url(../images/resources/agmap/commodities/cheese.jpg);} .commoditygrid2 .cherries {background-image: url(../images/resources/agmap/commodities/cherries.jpg);} .commoditygrid2 .chickens {background-image: url(../images/resources/agmap/commodities/chickens.jpg);} .commoditygrid2 .christmas {background-image: url(../images/resources/agmap/commodities/christmas.jpg);} .commoditygrid2 .corn {background-image: url(../images/resources/agmap/commodities/corn.jpg);} .commoditygrid2 .aquaculture {background-image: url(../images/resources/agmap/commodities/aquaculture.jpg);} .commoditygrid2 .dairy {background-image: url(../images/resources/agmap/commodities/dairy.jpg);} .commoditygrid2 .processing {background-image: url(../images/resources/agmap/commodities/processing.jpg);} .commoditygrid2 .grains {background-image: url(../images/resources/agmap/commodities/grains.jpg);} .commoditygrid2 .grapes {background-image: url(../images/resources/agmap/commodities/grapes.jpg);} .commoditygrid2 .greenbeans {background-image: url(../images/resources/agmap/commodities/greenbeans.jpg);} .commoditygrid2 .hay {background-image: url(../images/resources/agmap/commodities/hay.jpg);} .commoditygrid2 .honey {background-image: url(../images/resources/agmap/commodities/honey.jpg);} .commoditygrid2 .horticulture {background-image: url(../images/resources/agmap/commodities/horticulture.jpg);} .commoditygrid2 .equine {background-image: url(../images/resources/agmap/commodities/equine.jpg);} .commoditygrid2 .icecream {background-image: url(../images/resources/agmap/commodities/icecream.jpg);} .commoditygrid2 .maple {background-image: url(../images/resources/agmap/commodities/maple.jpg);} .commoditygrid2 .peas {background-image: url(../images/resources/agmap/commodities/peas.jpg);} .commoditygrid2 .pigs {background-image: url(../images/resources/agmap/commodities/pigs.jpg);} .commoditygrid2 .potatoes {background-image: url(../images/resources/agmap/commodities/potatoes.jpg);} .commoditygrid2 .sheep {background-image: url(../images/resources/agmap/commodities/sheep.jpg);} .commoditygrid2 .soybeans {background-image: url(../images/resources/agmap/commodities/soybeans.jpg);} .commoditygrid2 .timber {background-image: url(../images/resources/agmap/commodities/timber.jpg);} .commoditygrid2 h4 {align-items:center; justify-content:center; display:flex; height:180px; font-family:'Raleway'; font-size:1.65rem; line-height:1.7rem; font-weight:500; text-shadow:1px 1px 2px #000; text-align:center; margin:0 0.2rem;} .commoditygrid2 a {color:#FFF;} /*TEST page for Agmap .maphead {width:100%; margin:1rem auto; text-align:center;} .maphead img {width:100%;} #agmap2 {max-width:1100px; margin:0 auto;} .agmap2 {display:grid; grid-gap:2rem; grid-template-columns:320px auto; max-width:1000px; margin:3rem auto;} .agmap2 > div {padding:1rem;} .agmap2 h2 {font-family:'Raleway'; font-size:2.0rem; line-height:2.2rem; font-weight:400; margin:0.5rem 0.2rem 1.0rem 1.5rem;} .agmap2 p {font-size:1.2rem; line-height:1.75rem; font-weight:300; margin:0.5rem 2rem 0.5rem 2.1rem;} .agmap2 img { background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 6px 8px 0px rgba(0, 0, 0, .3), inset 0px 3px 1px 1px white, inset 0px -2px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(50%); filter: grayscale(50%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; border-radius:2%; border:14px solid #FFF; } .agmap2 img:hover { -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); -moz-box-shadow: 0px 12px 22px #ccc; -webkit-box-shadow: 0px 12px 22px #ccc; box-shadow: 0px 12px 22px #ccc; } #agmap3 {background:#241e2c url("../images/resources/agmap/commodities2.jpg") center center no-repeat; width:100%; overflow:auto;} .agmap3_area {max-width:1100px; margin: 0 auto;} .agmap3_area {margin:0 auto; text-align:center; width:100%; list-style:none; padding:30px 0;} .agmap3_area h2 {font-family:'Raleway'; font-size:2.0rem; line-height:2.2rem; font-weight:400; margin-top:1rem; color:#FFF;} .agmap3_area p {color:#FFF; text-align:center; margin:15px 0 0 0; font-size:1.2rem; line-height:1.75rem; font-weight:300;} .agmap3_area i {display:inline-block; color:#FFF; font-size:3rem;} .agmap3_area button {width:450px;} #agmap4 {max-width:1000px; margin:0 auto; padding:2rem 0;} .agmap4 {display:grid; grid-gap:2rem; grid-template-columns:320px auto;} .agmap4 > div {padding:1rem;} .agmap4_desc {position:relative; top:63%; transform:translateY(-50%);} .agmap4_desc h2 {font-family:'Raleway'; font-size:2.0rem; line-height:2.2rem; font-weight:400; margin-left:2.1rem; margin-top:2rem;} .agmap4_desc p {font-size:1.2rem; line-height:1.75rem; font-weight:300; margin:0.5rem 2rem 0.5rem 2.1rem;} .agmap4img { background:url(/images/resources/agmap/about2.jpg) no-repeat center center; background-size:240px; margin:3rem 0 3rem 3rem; width:200px; height:200px; transition:all 0.3s; border-radius:100%; border:12px solid #1c315f; } .agmap4img:hover {transform:scale(1.03);} .agmap4 button {margin-left:2.2rem;} */ /*resource/lesson_toolkits*/ #h2_toolkits {background:linear-gradient( rgba(0,0,0,0.5), rgba(0, 0, 0, 0.5) ),url("../images/resources/lesson/toolkits/banner.jpg"); background-size:cover; background-position: top center;} #toolkits-logos {max-width:950px; margin:2rem auto;} .logo3grid {display:grid; grid-template-columns:repeat(3, minmax(1px, 100%)); grid-gap:2.5rem; margin:1rem 0;} .logo3grid > div {display:flex; justify-content:center; align-items:center;} .logo3grid > div a {transition:all 0.3s;} .logo3grid > div a.nyaitc {width:300px;} .logo3grid > div a:hover {transform:scale(1.03);} /**************AgBadging - milestone landing page************/ .milelandingcol { -webkit-flex: 1; -ms-flex: 1; flex: 1; border: 1px solid rgba(0,0,0,.2); position: relative; background-color:#FFF; } #milelanding-columns .milelandingcol:nth-child(1), #milelanding-columns .milelandingcol:nth-child(2) { margin-right: 25px; } .milelandingcol .milelanding-pic {height:230px; background-position:center; background-size:cover; background-repeat: no-repeat;} #milelanding-columns .milelandingcol:nth-child(1) .milelanding-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/index/students.jpg);} #milelanding-columns .milelandingcol:nth-child(2) .milelanding-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/index/teachers.jpg);} #milelanding-columns .milelandingcol:nth-child(3) .milelanding-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/index/volunteers.jpg);} #milelanding-columns .milelandingcol:nth-child(1) .milelandingicon {background-color: #f15a29;} #milelanding-columns .milelandingcol:nth-child(2) .milelandingicon {background-color: #662d91;} #milelanding-columns .milelandingcol:nth-child(3) .milelandingicon {background-color: #006838;} .milelandingicon { left:50%; top:0; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position:absolute; text-align:center; width:110px; height:110px; border-radius:100%; font-family:FontAwesome; font-style:normal; display:inline-block; color:#FFF; line-height:110px; font-size:4rem; } .milelandingcol h3 {text-align:center; font-size:1.5rem; line-height:1.5rem; font-weight:500; margin:5rem 0 2rem 0; text-transform:uppercase;} .milelandingcol a {color:#051a3a; text-decoration: none; transition: all 0.4s;} .milelandingcol a:hover {color:#03a8e5;} /*AgBadging/students, -teachers, -volunteers*/ .milestonewrapper {margin:calc(3vh + 10px) auto calc(11vh + 10px) auto;} .milestonecol {-webkit-flex:1; -ms-flex:1; flex:1; position:relative;} #milestone-columns1 .milestonecol:nth-child(1), #milestone-columns1 .milestonecol:nth-child(2), #milestone-columns1 .milestonecol:nth-child(3) {margin-right:25px;} #milestone-columns2 .milestonecol:nth-child(1), #milestone-columns2 .milestonecol:nth-child(2), #milestone-columns2 .milestonecol:nth-child(3) {margin-right:25px;} section#milelanding-columns {margin-top: calc(5vh + 70px);} section.section {margin: 10vh 0 5vh 0;} /*students*/ #milestone-columns1 .milestonecol:nth-child(1) .studentsicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/ag.svg); background-position: center center; background-repeat: no-repeat; background-size:180px; height:180px; transition: all 0.4s;} #milestone-columns1 .milestonecol:nth-child(2) .studentsicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/plants.svg); background-position: center center; background-repeat: no-repeat; background-size:180px; height:180px; transition: all 0.4s;} #milestone-columns1 .milestonecol:nth-child(3) .studentsicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/food.svg); background-position: center center; background-repeat: no-repeat; background-size:180px; height:180px; transition: all 0.4s;} #milestone-columns1 .milestonecol:nth-child(4) .studentsicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/tech.svg); background-position: center center; background-repeat: no-repeat; background-size:180px; height:180px; transition: all 0.4s;} #milestone-columns2 .milestonecol:nth-child(1) .studentsicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/geo.svg); background-position: center center; background-repeat: no-repeat; background-size:180px; height:180px; transition: all 0.4s;} #milestone-columns2 .milestonecol:nth-child(2) .studentsicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/badge.svg); background-position: center center; background-repeat: no-repeat; background-size:180px; height:180px; transition: all 0.4s;} #milestone-columns2 .milestonecol:nth-child(3) .studentsicon {background-image: url(https://agclassroom.org/images/agbadging/survey.svg); background-position: center center; background-repeat: no-repeat; background-size:180px; height:180px; transition: all 0.4s;} #milestone-columns2 .milestonecol:nth-child(4) .studentsicon {background-image: url(https://agclassroom.org/images/agbadging/milestone.svg); background-position: center center; background-repeat: no-repeat; background-size:180px; height:180px; transition: all 0.4s;} .studentsicon:hover {transform: scale(1.05); transition: all 0.4s;} /*teachers & volunteers*/ #milestone-columns1 .milestonecol:nth-child(1) .teachvolicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/badge.svg); background-position: center center; background-repeat: no-repeat; background-size:200px; height:200px; transition: all 0.4s;} #milestone-columns1 .milestonecol:nth-child(2) .teachvolicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/ag.svg); background-position: center center; background-repeat: no-repeat; background-size:200px; height:200px; transition: all 0.4s;} #milestone-columns1 .milestonecol:nth-child(3) .teachvolicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/plants.svg); background-position: center center; background-repeat: no-repeat; background-size:200px; height:200px; transition: all 0.4s;} #milestone-columns2 .milestonecol:nth-child(1) .teachvolicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/food.svg); background-position: center center; background-repeat: no-repeat; background-size:200px; height:200px; transition: all 0.4s;} #milestone-columns2 .milestonecol:nth-child(2) .teachvolicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/tech.svg); background-position: center center; background-repeat: no-repeat; background-size:200px; height:200px; transition: all 0.4s;} #milestone-columns2 .milestonecol:nth-child(3) .teachvolicon {background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/geo.svg); background-position: center center; background-repeat: no-repeat; background-size:200px; height:200px; transition: all 0.4s;} .teachvolicon:hover {transform: scale(1.05); transition: all 0.4s;} .milestonebox {margin:1rem; text-align:center;} .milestonecol h3 {text-align:center; text-decoration:none; font-size:1.4rem; line-height:1.5rem; font-weight:400; text-decoration:none !important;} .milestonecol a {color:#051a3a; text-decoration: none; transition: all 0.4s;} .milestonecol a:hover {color:#03a8e5;} /*AgBadging/students, -teachers, -volunteers*/ /*milestone heading*/ .milestone-heading h3.badge-title {font-size:2.3rem; line-height:2.4rem; margin:1.5rem auto 2.8rem auto; font-weight:400; text-align:center;} /*AgBadging/milestone-ag*/ .subcol .milestone-ag-pic {height:220px; background-position: center; background-size: cover; background-repeat: no-repeat;} .milestone-ag-pic:hover {opacity:0.8; transition: all 0.4s;} #sub-columns1 .subcol:nth-child(1) .milestone-ag-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/ag/seed.jpg);} #sub-columns1 .subcol:nth-child(2) .milestone-ag-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/ag/weather.jpg);} #sub-columns1 .subcol:nth-child(3) .milestone-ag-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/ag/soil.jpg);} #sub-twocolumns .subcol:nth-child(1) .milestone-ag-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/ag/compost.jpg); height:280px;} #sub-twocolumns .subcol:nth-child(2) .milestone-ag-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/ag/light.jpg); height:280px;} /*AgBadging/milestone-plants*/ .subcol .milestone-plants-pic {height:220px; background-position: center; background-size: cover; background-repeat: no-repeat;} .milestone-plants-pic:hover {opacity:0.8; transition: all 0.4s;} #sub-columns1 .subcol:nth-child(1) .milestone-plants-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/plants/ag.jpg);} #sub-columns1 .subcol:nth-child(2) .milestone-plants-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/plants/farm.jpg);} #sub-columns1 .subcol:nth-child(3) .milestone-plants-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/plants/life.jpg);} #sub-twocolumns .subcol:nth-child(1) .milestone-plants-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/plants/eating.jpg); height:280px;} #sub-twocolumns .subcol:nth-child(2) .milestone-plants-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/plants/pollinator.jpg); height:280px;} /*AgBadging/milestone-food*/ .subcol .milestone-food-pic {height:220px; background-position: center; background-size: cover; background-repeat: no-repeat;} .milestone-food-pic:hover {opacity:0.8; transition: all 0.4s;} #sub-columns1 .subcol:nth-child(1) .milestone-food-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/food/myplate.jpg);} #sub-columns1 .subcol:nth-child(2) .milestone-food-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/food/farmers.jpg);} #sub-columns1 .subcol:nth-child(3) .milestone-food-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/food/crop.jpg);} #sub-twocolumns .subcol:nth-child(1) .milestone-food-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/food/produce.jpg); height:280px;} #sub-twocolumns .subcol:nth-child(2) .milestone-food-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/food/myenergy.jpg); height:280px;} /*AgBadging/milestone-tech*/ .subcol .milestone-tech-pic {height:220px; background-position: center; background-size: cover; background-repeat: no-repeat;} .milestone-tech-pic:hover {opacity:0.8; transition: all 0.4s;} #sub-columns1 .subcol:nth-child(1) .milestone-tech-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/tech/inventors.jpg);} #sub-columns1 .subcol:nth-child(2) .milestone-tech-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/tech/equipment.jpg);} #sub-columns1 .subcol:nth-child(3) .milestone-tech-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/tech/barn.jpg);} #sub-twocolumns .subcol:nth-child(1) .milestone-tech-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/tech/future.jpg); height:280px;} #sub-twocolumns .subcol:nth-child(2) .milestone-tech-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/tech/career.jpg); height:280px;} /*AgBadging/milestone-geo*/ .subcol .milestone-geo-pic {height:220px; background-position: center; background-size: cover; background-repeat: no-repeat;} .milestone-geo-pic:hover {opacity:0.8; transition: all 0.4s;} #sub-columns1 .subcol:nth-child(1) .milestone-geo-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/geo/cooking.jpg);} #sub-columns1 .subcol:nth-child(2) .milestone-geo-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/geo/world.jpg);} #sub-columns1 .subcol:nth-child(3) .milestone-geo-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/geo/lunch.jpg);} #sub-twocolumns .subcol:nth-child(1) .milestone-geo-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/geo/supply.jpg); height:280px;} #sub-twocolumns .subcol:nth-child(2) .milestone-geo-pic {background-image: url(https://agclassroom.org/images/agbadging/milestone/geo/holiday.jpg); height:280px;} /*Modal Style*/ .agbadging {text-align:left;} .agbadging h4 {text-align:center; font-size:2.5rem; line-height:2.7rem; font-weight:400; margin:1rem 0.2rem 2.2rem 0.2rem; padding-top:1.6rem;} .agbadging h5 {margin:0 0.3rem 0.5rem 1rem; font-size:1.65rem; line-height:1.85rem; font-weight:400;} .agbadging h6 {margin:0 0.3rem 0.5rem 1rem; font-size:1.3rem; line-height:1.5rem; font-weight:400;} .agbadging p {margin:0 0.3rem 1.8rem 1.5rem; font-size:1.05rem; line-height:1.4rem; font-weight:400;} .agbadging p.br {margin-bottom:0;} .agbadging .undermovie {margin-bottom:2.5rem;} .agbadging .bookgrid { display: grid; grid-template-columns:auto 120px; grid-gap:1.5rem; margin:0 1rem 1rem 0; -webkit-flex: 1; -ms-flex: 1; flex: 1; } .agbadging .bookgrid > div {} .agbadging .bookgrid img {box-shadow: 3px 3px 4px #777; margin-top:0.5rem;} .agbadging ul.movielist {margin:0 0.5rem 1.5rem 2.0rem;} .agbadging ul.movielist li {list-style-type:none; margin:0; padding:4px 0;} .agbadging ul.movielist li a {padding:0 15px; position:relative; display:block;} .agbadging ul.movielist li a::before { content:"\f0da"; font-size:1.2rem; font-family:FontAwesome; position:absolute; left:2px; top:1px; transition:all .2s; } .agbadging ul.movielist li a:hover::before {left:6px; color:#03a8e5;} /*For Teachers*/ .outcomes-standards {margin:1rem 0.3rem 0.5rem 1.2rem; font-size:1.4rem; line-height:1.4rem; font-weight:400;} .os-subject {margin:0 0.3rem 0.5rem 1.6rem; font-size:1.25rem; line-height:1.25rem; font-weight:400;} p.os-desc {margin:0 0.3rem 0.5rem 2rem;} /*AgBadging Home back link*/ #agbadging-home {position:relative; width:98%; margin-top:-1rem; height:80px;} .agbadging-home {position:absolute; right:0; top:0rem;} .agbadging-home ul li {list-style-type:none; margin:0; padding:2px 5px 0 40px; background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/badge.svg); background-position:left center; background-repeat: no-repeat; background-size:33px; height:33px;} /*AgBadging Student, Teacher, Volunteer back link*/ #agbadging-audience {position:relative; width:98%; margin-top:-1rem; height:80px;} .agbadging-audience {position:absolute; right:0; top:1rem;} .agbadging-audience ul li.students {list-style-type:none; margin:0; padding:2px 5px 0 40px; background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/students.svg); background-position:left center; background-repeat: no-repeat; background-size:33px; height:33px;} .agbadging-audience ul li.teachers {list-style-type:none; margin:0; padding:2px 5px 0 40px; background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/teachers.svg); background-position:left center; background-repeat: no-repeat; background-size:33px; height:33px;} .agbadging-audience ul li.volunteers {list-style-type:none; margin:0; padding:2px 5px 0 40px; background-image: url(https://agclassroom.org/images/agbadging/milestone/icons/volunteers.svg); background-position:left center; background-repeat: no-repeat; background-size:33px; height:33px;} .agbadging-audience ul li a {display: block;} .agbadging-audience a:hover::before {color:#03a8e5;} /*********************************************************GRIDS**************************************************************/ /*2 plain grids programs/growny2023*/ .plain2grids {display:grid; grid-template-columns:repeat(2, minmax(1px, 90%)); grid-gap:2rem; margin:3rem auto 3rem auto;} .plain2grids > div {text-align:center;} /*.plain2grids > div img {width:60%; text-align:center; margin:0 auto;}*/ .plain2grids > div h5 {font-size:1.5rem; line-height:1.6rem;} .plain2grids > div h6 {font-size:1.3rem; line-height:1.4rem;} .plain2grids > div p {font-size:1.1rem; line-height:1.4rem; margin:0.5rem 0.5rem 3rem 0.5rem;} /*about - members*/ .membergrid { display:grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); grid-gap:2rem; margin:35px 5px; } .membergrid > div { background:#F8F8F8; border-top:12px solid #1c3260; padding:1rem; border-bottom-right-radius:5px; border-bottom-left-radius:5px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-flex: 1; -ms-flex: 1; flex: 1; } .membergrid > div h5 {font-size:1.5rem; margin:1rem 0.1rem 0.2rem 0;} .memberinfo { display:grid; grid-template-columns:180px auto; grid-column: col 1 / span 2; grid-row: row 1; grid-gap:0; } .memberphoto { grid-column: 1; grid-row: 1; } .memberdetail { grid-column: 2; grid-row: 1; } .membergrid img {transition:all 0.3s; width:150px;} .membergrid img:hover {transform: scale(1.02);} /*about/news*/ .newsgrid {display:grid; grid-template-columns:repeat(5, minmax(1px, 100%)); grid-gap:1rem; margin:1rem;} .newsgrid > div { margin:0; padding:3px 0; display:inline-block; vertical-align:top; background-color:#FAFAFA; border-top:36px solid #1c3260; border-bottom-right-radius:5px; border-bottom-left-radius:5px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } .newsgrid > div h5 {margin:-33px 0 5px 0; color:#FFF; line-height:1.2rem; font-family:'Raleway'; text-align:center;} .newsgrid > div ul {margin:25px;} .newsgrid > div ul li {list-style-type:none; margin:0; padding:0.2rem 0;} .newsgrid > div ul li a {padding:0 1rem; position:relative; display:block;} .newsgrid > div ul li a::before { content:"\f0da"; font-size:1.2rem; font-family:FontAwesome; position:absolute; left:2px; top:0; transition:all .2s; } .newsgrid > div ul li a:hover::before {left:6px;} /*Subscribe form*/ #subscribe {margin:0 auto; text-align:center;} #subscribe label {margin:0; display:block;} .newsubscribe {width:500px;} /*grants/cce, grow*/ .duegrid {display:grid; grid-template-columns:250px auto; margin:0 0.2rem 1rem 1.5rem;} .duegrid > div {padding:0.1rem;} .duegrid > div.head {font-weight:600;} /*grants/conference table*/ .recipient4grid {display:grid; grid-template-columns:170px 170px 1fr 130px; margin:1rem;} .recipient4grid > div {border-left:1px #777 solid; border-bottom:1px #777 solid; padding:0.2rem 0.2rem 0.2rem 0.5rem; font-size:1.05rem; line-height:1.1rem;} .recipient4grid > div.last {border-right:1px #777 solid;} .recipient4grid > div.head {font-weight:600; font-size:1.25rem; border-top:1px #333 solid; border-bottom:1px #333 solid;} .recipient4grid > div.head:nth-child(4) {border-right:1px #333 solid;} .recipient3grid {display:grid; grid-template-columns:170px 170px 1fr; margin:1rem;} .recipient3grid > div {border-left:1px #777 solid; border-bottom:1px #777 solid; padding:0.2rem 0.2rem 0.2rem 0.5rem; font-size:1.05rem; line-height:1.1rem;} .recipient3grid > div.last {border-right:1px #777 solid;} .recipient3grid > div.head {font-weight:600; font-size:1.25rem; border-top:1px #333 solid; border-bottom:1px #333 solid;} .recipient3grid > div.head:nth-child(3) {border-right:1px #333 solid;} /*grants/conference, grants/grow_2445*/ .threephotos {display:grid; grid-template-columns:repeat(3, minmax(1px, 100%)); grid-gap:1.5rem; margin:2.5rem 1rem;} .threephotos > div {display:flex; justify-content:center; alignment-baseline:bottom; align-items:baseline;} .threephotos > div img {width:100%; transition:all 0.3s; box-shadow: 3px 3px 4px #777;} .threephotos > div img:hover {transform:scale(1.03);} /*resources/archive_animalcareers, programs/virtual*/ .twophotos {display:grid; grid-template-columns:repeat(2, minmax(1px, 100%)); grid-gap:1.5rem; margin:2.5rem 1rem;} .twophotos > div {display:flex; justify-content:center; alignment-baseline:bottom; align-items:baseline;} .twophotos > div img {width:100%; transition:all 0.3s; box-shadow: 3px 3px 4px #777;} .twophotos > div img:hover {transform:scale(1.03);} /*resources/archive_career*/ .twoareas {display:grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); grid-gap:5rem; margin:2.5rem 1rem;} .twoareas h5 {margin-left:2rem;} /*resources/archive_contest*/ .grade {font-size:1.7rem; line-height:1.9rem;} .theme {font-size:1.3rem; line-height:1.5rem; font-style:italic;} /*resources/archive_contest GRID*/ .contestgrid {display:grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows:auto; grid-gap:1rem; margin:1rem 0.5rem;} .contestcol:nth-child(-1n + 3) {grid-column: span 4;} .contestcol:nth-last-child(2) {grid-row-start: 2; grid-column: 3 / span 4;} .contestcol:nth-last-child(1) {grid-row-start: 2; grid-column: 7 / span 4;} /*3 boxes and 1 box*/ .contestcol2:nth-child(-1n + 3) {grid-column: span 4;} .contestcol2:nth-last-child(1) {grid-row-start: 2; grid-column: 5 / span 4;} .contestcol, .contestcol2 {text-align:center; line-height:1.3rem; margin-bottom:1rem;} .contestcol h6, .contestcol2 h6 {margin:1rem 0.5rem 0.3rem 0.5rem; font-size:1.6rem;} .contestcol p, .contestcol2 p {font-size:0.9rem; margin:0.5rem;} .contestcol img, .contestcol2 img {transition:all 0.3s;} .contestcol img:hover, .contestcol2 img:hover {transform:scale(1.03);} .contestgrid2 {display:grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows:auto; grid-gap:1rem; margin:1rem 0.5rem;} /*video grids programs/literacy2021_videos*/ .twogrids {display:grid; grid-template-columns:repeat(2, minmax(1px, 100%)); grid-gap:2rem; margin:1rem;} .twogrids > div { margin:0; padding:0; display:inline-block; vertical-align:top; border-bottom-right-radius:5px; border-bottom-left-radius:5px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } .twogrids > div h5 {margin:1.2rem 0.5rem 0.5rem 0.5rem; font-size:1.6rem; line-height:1.8rem; font-family:'Raleway'; text-align:center;} .twogrids > div h6 {margin:0 0.5rem 1.5rem 0.5rem; font-size:1.3rem; line-height:1.5rem; font-family:'Raleway'; text-align:center;} .twogrids > div p {margin:0 1.5rem 1.5rem 1.5rem; font-weight:300;} .twogrids > div ul {margin:1.5rem 1.5rem 1.5rem 2.3rem;} .twogrids > div ul li {list-style-type:none; margin:0; padding:2px 0;} .twogrids > div ul li a {padding:0 15px; position:relative; display:block; font-size:1.15rem; line-height:1.35rem;} .twogrids > div ul li a::before { content:"\f0da"; font-size:1.05rem; font-family:FontAwesome; position:absolute; left:2px; top:0; transition:all .2s; } .twogrids > div ul li a:hover::before {left:6px; color:#00baff;} /*resources/eLearning*/ .elearn {width:100%; margin:1rem auto; justify-content:center;} .elearn h3 {font-family:'Open Sans'; font-size:7rem !important; line-height:7rem !important; margin-bottom:3rem !important; color:#000; font-weight:600; text-align:center; letter-spacing: 0.01em; text-shadow: 1px 1px 2px rgba(0, 0, 0, .8);} .elearn h3 a {color:#000;} .elearn h3 a:hover {color:#000; text-decoration:none;} .elearn .egrade {font-size:1.7rem; line-height:1.9rem; color:#FFF; font-style:italic; text-align:center; margin:0 0.5rem; letter-spacing:0.025em; position:absolute; bottom:1.5rem; text-shadow: 1px 1px 2px rgba(0, 0, 0, .8);} .elearn ul {width:100%; margin:0 auto; justify-content:center; text-align:center; list-style:none; padding-bottom:8px;} .elearn ul li {width:20%; margin:0px 0.5%; display: inline-block; position:relative; vertical-align:top;} .elearn img { border-radius:8px; background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, .3), inset 0px 3px 1px 1px white, inset 0px -2px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(30%); filter: grayscale(30%); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; } .elearn img:hover { -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transform: scale(1.03); -ms-transform: scale(1.03); transform: scale(1.03); -moz-box-shadow: 0px 12px 22px #ccc; -webkit-box-shadow: 0px 12px 22px #ccc; box-shadow: 0px 12px 22px #ccc; } /*programs/alw*/ .alw_loggedin {float:right; margin-top:-50px;} .alw_loggedin a {padding:6px 30px; text-decoration:none; display:block; position:relative; font-size:1.2rem;} .alw_loggedin a::before { font-family:FontAwesome; content:"\f2f5"; font-size:1.3rem; position:absolute; right:5px; top:7px; transition:all .4s; } .alw_loggedin a:hover::before {right:0; color:#03a8e5;} /*programs/literacy*/ .author {font-family:'Open Sans'; font-size:1.3rem; line-height:1.5rem; font-weight:400; margin:0 0 0.4rem 1.5rem;} /*literach archive GRID*/ .literacygrid {display:grid; grid-template-columns: repeat(6, 1fr); grid-auto-rows:auto; grid-gap:0.5rem; margin:1rem 0.5rem;} .literacygrid > div img {transition:all 0.3s;} .literacygrid > div img:hover {transform:scale(1.03);} /*programs/literacy - Coordinatro button*/ .coordinator {display:grid; grid-gap:1.5rem; grid-template-columns:70px auto; margin:2rem 0.1rem 2.5rem 2.0rem;} .coordinator > div {display:inline-block; align-items:center;} .coordinator > div.icon_coordinator figure { background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, .3), inset 0px 4px 1px 1px white, inset 0px -3px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; border-radius:50%; width:95px; height:95px; } .coordinator > div.icon_coordinator figure:hover { -webkit-filter: grayscale(10%); filter: grayscale(10%); -moz-box-shadow: 0px 12px 28px #ccc; -webkit-box-shadow: 0px 12px 28px #ccc; box-shadow: 0px 12px 28px #ccc; } .coordinator > div.icon_coordinator i {font-size:3.2rem; line-height:3.3rem; padding:1.2rem 0 0 1rem; transition:0.3s all;} .coordinator > div.icon_coordinator i:hover {color:#00aff0;} .icon_coordinator {color:#7fbf42;} .coordinator > div.txt_coordinator {margin:2.2rem 0.2rem 0 0.8rem; font-size:1.5rem; height:1.9rem; width:338px; border-bottom:dotted 4px #7fbf42; transition:all 0.3s;} .coordinator > div.txt_coordinator:hover {border-bottom:dotted 4px #00aff0;} .coordinator > div.txt_coordinator a {position:relative;} .coordinator > div.txt_coordinator a::after { content:"\f105"; font-size:1.8rem; font-family:FontAwesome; position:absolute; right:-15px; top:23px;} /*programs/literacy - Book, Author*/ .subpage .book {font-size:1.7rem; line-height:1.8rem; font-weight:400; font-style:italic; margin:1.2rem 0.2rem 0.2rem 0.5rem;} .subpage .author {font-size:1.3rem; line-height:1.4rem; font-weight:400; margin:0 0.2rem 2rem 1.2rem} .subpage .sponsors {font-size:1.3rem; line-height:1.4rem; font-weight:400; margin-left:0.5rem;} .twobookgrid {display:grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows:auto; grid-gap:0.5rem; margin:1rem 0.5rem;} .twobookgrid > div {text-align:center;} .twobookgrid > div img {width:80%; text-align:center; margin:0 auto;} /*programs/teacheryear*/ .congrats {font-size:1.6rem; line-height:2rem; font-family:'Raleway'; font-weight:500; text-align:center; margin:0 auto 2rem auto; width:90%; color:#000; border-bottom:1px solid #333;} /*********************programs/mac************************/ /*programs/mac table*/ .mac4grid {display:grid; grid-template-columns:80px 1fr 1fr 185px; margin:0.2rem 1rem 2rem 1rem;} .mac4grid > div {border-left:1px #777 solid; border-bottom:1px #777 solid; padding:0.3rem 0.2rem 0.3rem 0.5rem; font-size:1.05rem; line-height:1.1rem;} .mac4grid > div.last {border-right:1px #777 solid;} .mac4grid > div.head {font-weight:600; font-size:1.25rem; border-top:1px #333 solid; border-bottom:1px #333 solid;} .mac4grid > div.head:nth-child(4) {border-right:1px #333 solid;} /*mac winners Icons*/ .macwin {margin:0; color:#7fbf42;} .macwin ul {margin:0 auto; text-align: center; width:95%; list-style:none; padding:30px 0;} .macwin ul li {display:inline-block; background:none; padding:0 1rem; width:120px; vertical-align:top; text-transform:uppercase; font-size:23px; line-height:22px; font-weight:400;} .macwin ul li div {margin-top:1.2rem;} .macwin i {font-size:4.2rem; line-height:4.2rem; margin-top:22px;} .macwin figure { background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, .3), inset 0px 4px 1px 1px white, inset 0px -3px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; border-radius:50%; width:115px; height:115px; } .macwin figure:hover { -webkit-filter: grayscale(10%); filter: grayscale(10%); -moz-box-shadow: 0px 12px 28px #ccc; -webkit-box-shadow: 0px 12px 28px #ccc; box-shadow: 0px 12px 28px #ccc; } /*********************programs/growny************************/ /*programs/growny_winners photos*/ .grownyphotos {display:grid; grid-template-columns:repeat(2, minmax(1px, 100%)); grid-gap:1.5rem; margin:1rem 1rem 0 1rem;} .grownyphotos > div {text-align:center; border-top:8px solid #e9a226; border-bottom-right-radius:5px; border-bottom-left-radius:5px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);} .grownyphotos > div img {width:100%;} .grownyphotos h5 {font-size:1.5rem; text-align:center; margin:0.3rem; height:90px; align-items:center; justify-content:center; align-content:right; display:flex; flex-direction:row; flex-wrap:wrap;} .grownyphotos .provided {font-size:1.1rem; line-height:1.3rem; text-align:center; margin:0.3rem; align-items:center;} .grownyphotos .winner {font-size:1.3rem; margin:1.5rem 0.2rem;} /*growny winners Icons*/ .grownywin {margin:0; color:#7fbf42;} .grownywin ul {margin:0 auto; text-align: center; width:95%; list-style:none; padding:30px 0;} .grownywin ul li {display:inline-block; background:none; padding:0 1rem; width:120px; vertical-align:top; text-transform:uppercase; font-size:23px; line-height:22px; font-weight:400;} .grownywin ul li div {margin-top:1.2rem;} .grownywin i {font-size:4.2rem; line-height:4.2rem; margin-top:22px;} .grownywin figure { background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, .3), inset 0px 4px 1px 1px white, inset 0px -3px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; border-radius:50%; width:115px; height:115px; } .grownywin figure:hover { -webkit-filter: grayscale(10%); filter: grayscale(10%); -moz-box-shadow: 0px 12px 28px #ccc; -webkit-box-shadow: 0px 12px 28px #ccc; box-shadow: 0px 12px 28px #ccc; } /*********************programs/schoolyard************************/ /*programs/schoolyard table*/ .school4grid {display:grid; grid-template-columns:70px 300px 220px 1fr; margin:0.2rem 1rem 2rem 1rem;} .school4grid > div {border-left:1px #777 solid; border-bottom:1px #777 solid; padding:0.3rem 0.2rem 0.3rem 0.5rem; font-size:1.05rem; line-height:1.1rem;} .school4grid > div.last {border-right:1px #777 solid;} .school4grid > div.head {font-weight:600; font-size:1.25rem; border-top:1px #333 solid; border-bottom:1px #333 solid;} .school4grid > div.head:nth-child(4) {border-right:1px #333 solid;} .school3grid {display:grid; grid-template-columns:70px 1fr 1fr; margin:0.2rem 1rem 2rem 1rem;} .school3grid > div {border-left:1px #777 solid; border-bottom:1px #777 solid; padding:0.3rem 0.2rem 0.3rem 0.5rem; font-size:1.05rem; line-height:1.1rem;} .school3grid > div.last {border-right:1px #777 solid;} .school3grid > div.head {font-weight:600; font-size:1.25rem; border-top:1px #333 solid; border-bottom:1px #333 solid;} .school3grid > div.head:nth-child(3) {border-right:1px #333 solid;} .school {margin:0 0.2rem 1rem 2rem;} .schoolprizes {display:grid; grid-template-columns:250px 250px; margin:0.2rem 1rem 2rem 3rem;} .schoolprizes > div {} .schoolprizes .prize {font-size:1.4rem; color:#8b1f03;} .schoolprizes .prizelev ul {list-style-type:none; margin-left:0.1rem;} /*programs/schoolyard photos*/ .schoolphotos {display:grid; grid-template-columns:repeat(3, minmax(1px, 100%)); grid-gap:1.5rem; margin:0.5rem 1rem 1rem 1rem;} .schoolphotos > div { text-align:center; border-bottom-right-radius:5px; border-bottom-left-radius:5px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);} .schoolphotos > div img {width:100%;} .schoolphotos h6 {font-size:1.5rem; text-align:center; text-transform:uppercase; margin:0.3rem; height:50px; align-items:center; justify-content:center; align-content:right; display:flex; flex-direction:row; flex-wrap:wrap;} .schoolphotos .winner {font-size:1.3rem; margin:1.5rem 0.2rem;} /*Schookyard winners Icons*/ .schoolyardwin {margin:0;} .schoolyardwin a {color:#8b1f03;} .schoolyardwin a:hover {color:#b74a2d;} .schoolyardwin ul {margin:0 auto; text-align: center; width:98%; list-style:none; padding:25px 0;} .schoolyardwin ul li {display:inline-block; background:none; padding:1rem 0; width:150px; vertical-align:top; text-transform:uppercase; font-size:22px; line-height:21px; font-weight:400;} .schoolyardwin ul li div {margin-top:1.2rem;} .schoolyardwin i {font-size:3.2rem; line-height:3.2rem; margin-top:25px; color:#8b1f03;} .schoolyardwin i:hover {color:#b74a2d;} .schoolyardwin figure { background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, .3), inset 0px 4px 1px 1px white, inset 0px -3px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; border-radius:50%; width:100px; height:100px; } .schoolyardwin figure:hover { -webkit-filter: grayscale(10%); filter: grayscale(10%); -moz-box-shadow: 0px 12px 28px #ccc; -webkit-box-shadow: 0px 12px 28px #ccc; box-shadow: 0px 12px 28px #ccc; } /*********************programs/topcut************************/ /*programs/topcut table*/ .topcut4grid {display:grid; grid-template-columns:80px 1fr 1fr 240px; margin:0.2rem 1rem 2rem 1rem;} .topcut4grid > div {border-left:1px #777 solid; border-bottom:1px #777 solid; padding:0.3rem 0.2rem 0.3rem 0.5rem; font-size:1.05rem; line-height:1.1rem;} .topcut4grid > div.last {border-right:1px #777 solid;} .topcut4grid > div.head {font-weight:600; font-size:1.25rem; border-top:1px #333 solid; border-bottom:1px #333 solid;} .topcut4grid > div.head:nth-child(4) {border-right:1px #333 solid;} .topcut5grid {display:grid; grid-template-columns:138px 1fr 1fr 1fr 1fr; margin:0.2rem 1rem 2rem 1rem;} .topcut5grid > div {border-left:1px #777 solid; border-bottom:1px #777 solid; padding:0.3rem 0.2rem 0.3rem 0.5rem; font-size:1.05rem; line-height:1.1rem;} .topcut5grid > div.last {border-right:1px #777 solid;} .topcut5grid > div.head {font-weight:600; font-size:1.25rem; border-top:1px #333 solid; border-bottom:1px #333 solid;} .topcut5grid > div.head:nth-child(5) {border-right:1px #333 solid;} .topcut6grid {display:grid; grid-template-columns:68px 1fr 1fr 1fr 1fr 1fr; margin:0.2rem 1rem 2rem 1rem;} .topcut6grid > div {border-left:1px #777 solid; border-bottom:1px #777 solid; padding:0.3rem 0.2rem 0.3rem 0.5rem; font-size:1.05rem; line-height:1.1rem;} .topcut6grid > div.last {border-right:1px #777 solid;} .topcut6grid > div.head {font-weight:600; font-size:1.25rem; border-top:1px #333 solid; border-bottom:1px #333 solid;} .topcut6grid > div.head:nth-child(6) {border-right:1px #333 solid;} /*Topcut winners Icons*/ .topcutwin {margin:0;} .topcutwin a {color:#c17d05;} .topcutwin a:hover {color:#704803;} .topcutwin ul {margin:0 auto; text-align: center; width:95%; list-style:none; padding:25px 0;} .topcutwin ul li {display:inline-block; background:none; padding:1rem 0; width:150px; vertical-align:top; text-transform:uppercase; font-size:22px; line-height:21px; font-weight:400;} .topcutwin ul li div {margin-top:1.2rem;} .topcutwin i {font-size:3.2rem; line-height:3.2rem; margin-top:25px; color:#c17d05;} .topcutwin i:hover {color:#704803;} .topcutwin figure { background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, .3), inset 0px 4px 1px 1px white, inset 0px -3px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; border-radius:50%; width:100px; height:100px; } .topcutwin figure:hover { -webkit-filter: grayscale(10%); filter: grayscale(10%); -moz-box-shadow: 0px 12px 28px #ccc; -webkit-box-shadow: 0px 12px 28px #ccc; box-shadow: 0px 12px 28px #ccc; } /*topcut access*/ .accesswrap {display:grid; grid-gap:1rem; grid-template-columns:360px 90px auto; margin:1rem 0.1rem 2.5rem 0;} .access {display:grid; grid-gap:1rem; grid-template-columns:90px auto;} .access > div {display:inline-block; align-items:center;} .access > div.icon_access {margin-top:3rem;} .access > div.icon_access figure { background-image: -webkit-linear-gradient(top, #f4f1ee, #fff); background-image: linear-gradient(top, #f4f1ee, #fff); box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, .3), inset 0px 4px 1px 1px white, inset 0px -3px 1px 1px rgba(204,198,197,.5); -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; display:inline-block; border-radius:50%; width:95px; height:95px; } .access > div.icon_access figure:hover { -webkit-filter: grayscale(10%); filter: grayscale(10%); -moz-box-shadow: 0px 12px 28px #ccc; -webkit-box-shadow: 0px 12px 28px #ccc; box-shadow: 0px 12px 28px #ccc; } .access > div.icon_access i {font-size:3.2rem; line-height:3.3rem; padding:1.5rem 0 0 1rem; transition:0.3s all;} .access > div.icon_access i:hover {color:#00aff0;} .icon_access {color:#7fbf42;} .access > div.txt_access {margin-top:5rem; font-size:1.3rem; height:1.7rem; width:310px; border-bottom:dotted 4px #7fbf42; transition:all 0.3s;} .access > div.txt_access:hover {border-bottom:dotted 4px #00aff0;} .access > div.txt_access a {position:relative;} .access > div.txt_access a::after { content:"\f105"; font-size:1.6rem; font-family:FontAwesome; position:absolute; right:-15px; top:18px;} /*programs/tupcut_materials*/ .submission { position:relative; padding:10px; margin-bottom:50px; } .submissionicon {background-color:#b71d21; position:absolute; left:20px; width:75px; height:75px; border-radius:100%; color:#FFF; line-height:5.0rem; font-size:2.7rem; text-align:center; font-family:FontAwesome; font-style:normal; display:inline-block; transition:all 1.0s; } .submissionicon:hover {background-color:#f84449;} .submissionicon i {margin-left:2px;} .submission p {position:absolute; left:80px; top:35px; font-size:1.5rem; line-height:1.5rem; color:#b71d21; transition:all 1.0s;} /********************************************Image Styles*************************************************/ .dropshadow {box-shadow: 3px 3px 4px #777;} .width400 {width:400px;} .width300 {width:300px;} .width200 {width:200px;} .width80p {width:80%;} .marginright {margin:0.5rem 0.5rem 1.5rem 1.5rem;} .marginleft {margin:0.5rem 1.5rem 1.5rem 1rem;} .floatright {float:right;} .floatleft {float:left;} .centerimg {margin:25px auto; text-align:center;} /*prorams/growny*/ .photodesc {background-color:#edeae7; padding:1rem 0 0.5rem 0; margin:1rem auto; text-align:center; width:88%;} .photodesc p {font-size:1.25rem; line-height:1.85rem; color:#141313; margin-top:1rem;} .photodesc_right {float:right; margin:1rem; text-align:center; width:400px; font-size:1.05rem; line-height:1.15rem;} .photodesc_img {margin:0 auto;} .photodesc_right h4 {color:#516840; font-weight:500; margin-bottom:0;} .photodesc_right h5 {color:#e9a225; font-weight:400; margin-top:0; margin-bottom:1rem;} /*growny photo description and logos*/ .logodescgrid {display:grid; grid-template-columns:180px 1fr 180px; margin:0;} /*************************************** Evaluate Lesson Plan (Matrix) *************************************/ .evaluationtable { border-collapse: collapse; table-layout: fixed; width: 100%; margin: 20px 0px 10px -5px; } .evaluationtable TR TD { padding: 5px; } .evaluationtable TR TD:nth-child(1) { width: 110px; } .evaluationtable TR TD:nth-child(1) IMG { width: 100px; height: auto; } /************************************************Matrix Styles***********************************************/ .matrix-subpage {min-height:600px; font-size:1.1rem; line-height:1.55rem; font-weight:400; max-width:1100px; margin:calc(6vh + 30px) auto;} .matrix-subpage p {margin-top:0.7rem !important; margin-bottom:0.7rem !important;} .matrix-subpage hr {border:0; height:1px; background-image: linear-gradient(to right, #FFF, #4c7700, #FFF); width:100%; margin:0 auto; position: relative;} h3.matrixh3 {font-size:2.6rem; line-height:2.8rem; margin:3rem 1rem 0.1rem 0.2rem; font-family:'Raleway'; font-weight:500;} h3.matrixh3center {margin:3rem auto; text-align:center; font-size:3rem; line-height:3.2rem; font-family:'Raleway'; font-weight:500;} h4.matrixh4 {font-size:2.0rem; line-height:2.2rem; margin:0.2rem 0.5rem 3rem 0.5rem; font-family:'Raleway'; color:#000; font-weight:400;} h5.matrixh5 {font-size:1.7rem; line-height:1.8rem; margin:0 0.5rem 0 0.9rem; font-family:'Open Sans'; color:#000; font-weight:400;} p.matrix {margin:0 1.0rem 1.5rem 1.0rem;} /*.searchhead {text-align:left; font-size:1.5rem; line-height:1.6rem; margin-left:11px; 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;} .successcode span {color:#000; font-weight:400; display:block; text-align:center;} 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 .2s; } ul.matrixlink li a:hover::before {left:6px;} ul.matrixnews {margin:0 0.5rem 1.5rem 0.5rem;} ul.matrixnews li {list-style-type:none; margin:0; padding:2px 0 2px 15px;} ul.matrixnews li a {padding:2px 15px; position:relative; font-size:1.2rem;} ul.matrixnews li a::before { content:"\f391"; font-size:1.2rem; font-family:FontAwesome; position:absolute; left:-6px; top:4px; transition:all 0.3s; } ul.matrixnews li a:hover::before {color:#00aff0;} .mxbutton { font-family:'Raleway'; font-size:1.1rem; line-height:1.0rem; text-align:center; color:#FFF; border-radius:6px; display:inline-block; border:none; background-color:#1c315f; 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:#4c618f;} .mxbutton a {color:#FFF !important; } .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:180px;} .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 9px 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 #888888; 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;} /*Main page*/ #main-mybinderlogin {width:380px; margin-left:0.66rem;} #bands { display: block; width: 450px; margin: 10px auto 10px auto; } #bands .checkbox { width: 50%; display: block; float: left; text-align: left; } #getcsv { background-color:#1c315f !important; color: #FFF; font-size: 18px; padding: 6px 25px; border: none; border-radius: 5px; cursor: pointer; transition:all 0.4s; width:200px !important;} #getcsv:hover, #getcsv:active { background-color:#4c618f !important; } /*Modal Login*/ .mxloginmodal {width:98%; margin:1rem auto; text-align:center;} .logingroup {margin:10px auto;} /*createuser.tpl, editprofile.tpl*/ h4.checkboxlist {font-size:1.6em; line-height:2.0rem; margin:1em 0.2rem 0.5rem 0.2rem; color:#000; font-weight:400;} label.checkbox {font-size:1rem; line-height:1rem;} #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:5px 8px; border-radius:5px;} .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%; padding:6px 10px; 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;} /*mybinder.tpl*/ .deletebtn {padding:8px 30px; margin:5px 15px 20px 10px; border:none; display:inline-block; cursor:pointer;} .deletebtn:hover {} .deletebtn.disable {background-color:#a7a7a7; transition:all 0.3s;} .deletebtn.disable:hover {background-color:#BBB;} .mark2 {top:13px !important; left:10px !important;} /*position of checkbox for only MyBinder*/ .lessonanchor {display:inline-block; font-size:1.3rem;} .purpose2 {margin:0 0.5rem 1rem 3.4rem !important;} .purpose2 p {margin:0 !important;} /*searchresult.tpl*/ h4.searchtitle {font-family:'Raleway'; font-size:1.5rem; line-height:1.7rem; margin:0.5rem 0.2rem 0rem 0.8rem; font-weight:400;} h5.searchtitle {font-family:'Raleway'; font-size:1.5rem; line-height:1.7rem; margin:0.5rem 0.2rem 0rem 0.8rem; font-weight:400;} h4.searchmedia {font-family:'Raleway'; font-size:1.7rem; line-height:1.9rem; margin:0.5rem 0.2rem 0rem 0.8rem; font-weight:400;} .noresults {text-align:center; background-color:#e8e8e8; padding:5px 0px;} .purpose {margin:0.1rem 0.5rem 1rem 1.0rem !important;} .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:#6da700; 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:#8ed902;} .showrest.hidden {display:none;} /*lesson.tpl*/ h4.lessontitle {font-size:2.2rem; line-height:2.4rem; margin:0.2rem 0.2rem 0.5rem 0.1rem; font-weight:500;} h5.Lcategory {font-size:1.7rem; line-height:1.9rem; margin:0.9rem 0.2rem 0.5rem 0.8rem; font-weight:400;} .Lsection {display:block; margin:5px 15px 5px 5px; clear:both;} .Lsection > div {margin-left:0.1rem;} .Lsection > div.leftmargin {margin-left:1.1rem; margin-top:0.7rem; margin-bottom:0.7rem;} .Lsection ul, .Lsection ol {margin:0 0.2rem 0.2rem 3rem;} .Lsection p {margin:0px 0.2rem 0 1rem;} .Lsection ul ul, .Lsection ul ol, .Lsection ol ul, .Lsection ol ol {margin-left:1.8rem; margin-top:1rem; margin-bottom:1rem; padding-left:0;} .Lsection IMG {padding:15px;} /*Elaborate (activity)*/ .Lsection-activity ul {margin-left:3.4rem;} .Lsection-activity ul ul {margin-left:1.5rem;} /*Did you know (agfacts)*/ .Lsection-agfacts ul {margin-left:3.4rem;} .Lsection-agfacts ul li {padding:0 !important;} .Lsection-agfacts span {padding:0 !important;} #vocab { margin-top: 10px; margin-bottom: 12px; } #vocab p { margin-left:16px; margin-bottom: 10px; margin-top: 7px; } /*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:#b54343; color:#FFF; display:block; text-align:center; padding:8px 10px; border-radius:8px; transition:all 0.3s; height:35px;} .standardbtn:hover { background-color: #4c618f; color:#FFF; } .standardbtn.clicked { background-color: #5c719f; color #FFF; transition:all 0.3s;} .standardbtn.clicked:hover { background-color: #8ca1cf; color:#FFF; } .showstd.hidden {display:none;} .showstd h5 {font-size:1.66rem; line-height:1.8rem; margin:0.5rem 0.2rem 0.2rem 0.2rem; font-weight:400;} .showstd h6 {font-size:1.4rem; line-height:1.5rem; margin:0.2rem 0.2rem 0.3rem 0.4rem; font-weight:400;} .showstd ul {margin:0 0.2rem 0 2rem;} .showstd ul.educontent {margin:0 0.2rem 0 2.1rem;} .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: #1c315f; 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: #8ed902;} #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-size:2.4rem; line-height:2.4rem; margin:1.5rem 0.2rem 0.5rem 0; font-weight:500;} h5.Rcategory {font-size:1.7rem; line-height:1.9rem; margin:0.5rem 0.2rem 0rem 0.5rem; font-weight:400;} .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;} table.phenomenon td ul {margin-left:15px; margin-top: 0; margin-right: 0;} table.phenomenon td ol {margin-left:15px; margin-top: 0; margin-right: 0;} table.phenomenon td ul li {font-size:0.9rem; line-height:1.15rem; color:#000;} table.phenomenon td ol li {font-size:0.9rem; line-height:1.15rem; color:#000;} table {border-spacing:0px; border-collapse:collapse;} /*Callout*/ h5.naitcheader {font-size:1.6rem; font-weight:400; margin-top:0.3rem; margin-bottom:0.2rem; margin-left:0;} .naitccallout { background-color: #ececec; margin: 10px; border: 2px solid #cccccc; } .naitccallout TR TD:nth-child(2) { padding: 15px 15px 15px 0px; } .naitccallout TR TD P { margin: 0px 10px 10px 0px; } .naitccallout TR TD UL { margin-left:2.2rem; margin-bottom:0.8rem;} .naitccallout TR TD OL { margin-left:2.2rem; margin-bottom:0.8rem;} .naitccallout table, th, td {border:none;} #spinner { display: none; width: 80px; height: 80px; margin: 0 auto; } .lds-spinner { color: #002b50; display: inline-block; position: relative; width: 80px; height: 80px; } .lds-spinner div { transform-origin: 40px 40px; animation: lds-spinner 1.2s linear infinite; } .lds-spinner div:after { content: " "; display: block; position: absolute; top: 3px; left: 37px; width: 6px; height: 18px; border-radius: 20%; background: #002b50; } .lds-spinner div:nth-child(1) { transform: rotate(0deg); animation-delay: -1.1s; } .lds-spinner div:nth-child(2) { transform: rotate(30deg); animation-delay: -1s; } .lds-spinner div:nth-child(3) { transform: rotate(60deg); animation-delay: -0.9s; } .lds-spinner div:nth-child(4) { transform: rotate(90deg); animation-delay: -0.8s; } .lds-spinner div:nth-child(5) { transform: rotate(120deg); animation-delay: -0.7s; } .lds-spinner div:nth-child(6) { transform: rotate(150deg); animation-delay: -0.6s; } .lds-spinner div:nth-child(7) { transform: rotate(180deg); animation-delay: -0.5s; } .lds-spinner div:nth-child(8) { transform: rotate(210deg); animation-delay: -0.4s; } .lds-spinner div:nth-child(9) { transform: rotate(240deg); animation-delay: -0.3s; } .lds-spinner div:nth-child(10) { transform: rotate(270deg); animation-delay: -0.2s; } .lds-spinner div:nth-child(11) { transform: rotate(300deg); animation-delay: -0.1s; } .lds-spinner div:nth-child(12) { transform: rotate(330deg); animation-delay: 0s; } @keyframes lds-spinner { 0% { opacity: 1; } 100% { opacity: 0; } } /******************************************************RESPONSIVE****************************************************/ /* @media screen and (max-width: 1500px) { #sub-fourcolumns1 {flex-wrap:wrap;} .agmapcol {-webkit-flex:48%; -ms-flex:48%; flex:48%; margin-top:30px;} #sub-fourcolumns1 .agmapcol:nth-child(1) {margin-right:25px;} #sub-fourcolumns1 .agmapcol:nth-child(2) {margin-right:0;} #sub-fourcolumns1 .agmapcol:nth-child(3) {margin-right:25px;} #sub-fourcolumns1 .agmapcol:nth-child(4) {margin-right:0;} } */ @media screen and (max-width: 1170px) { .subpage {width:95%;} header {height:auto;} #mainnav {display:none;} .mobiles {display:block; margin-top:1rem;} /**********Homepage*************/ .impact_area {width:98%; padding:1%;} .agliteracy_left {max-width:30%; margin-left:2rem;} .agliteracy_right {max-width:58%; margin-right:1rem;} /************Subpage************/ h2.heading {padding:100px 0;} h2.agbadgingH {padding:100px 0;} h2.matrixH {padding:100px 0;} .newsgrid > div ul {margin:25px 5px 25px 15px;} .button_nasswrap {display:block; margin:1rem 0.5rem 1rem 1.65rem;} .button_nass {width:58.1%; margin:0.5rem 0;} .grid3cols {grid-gap:1rem;} /**********AgBadging*********/ .milelandingcol h3 {margin:5rem 0 2rem 0;} /***********Matrix***********/ .matrix-subpage {width:90%;} } @media screen and (max-width: 900px) { /**********Homepage*************/ /*Matrix*/ .matrixbg {width:100%; height:auto; border-top:25px solid #1c315f; border-bottom:15px solid #1c315f; position:static;} .matrix_desc {float:none; width:96%; margin:2%;} .matrix_desc h2 {text-align:center; margin:0 auto;} .matrix_desc p {margin:0.6rem 1.25rem;} .matriximg {position:static; margin:0 auto; display:flex; justify-content:center;} .buttonwrap {display:block; grid:block;} .matrixF {width:77.8%;} .matrixB {width:78%;} /************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-twocolumns.display-flex {-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #landing-columns1 .landingcol:nth-child(1), #landing-columns1 .landingcol:nth-child(2) {margin: 0 0 30px 0;} #landing-columns2 .landingcol:nth-child(1), #landing-columns2 .landingcol:nth-child(2) {margin: 0 0 30px 0;} #landing-columns3 .landingcol:nth-child(1), #landing-columns3 .landingcol:nth-child(2) {margin: 0 0 30px 0;} #landing-twocolumns .landingcol:nth-child(1), #landing-twocolumns .landingcol:nth-child(2) {margin: 0 0 30px 0;} #landing-onecolumn .landingcol:nth-child(1) {margin: 0 0 30px 0;} #landing-onecolumn {width:auto;} .landingcol .resources-pic {height:360px;} .landingcol .grants-pic {height:360px;} .landingcol .programs-pic {height:360px;} /************Subpage************/ h2.heading {font-size:3.6rem; line-height:3.8rem; font-weight:300; padding:90px 0;} h2.agbadgingH {font-size:3.0rem; line-height:3.2rem; font-weight:300; padding:90px 0;} h2.matrixH {font-size:2.5rem; line-height:2.7rem; font-weight:300; padding:90px 0;} /*Sub Columns*/ #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-columns1 .subcol:nth-child(1), #sub-columns1 .subcol:nth-child(2){margin: 0 0 20px 0;} #sub-columns2 .subcol:nth-child(1), #sub-columns2 .subcol:nth-child(2){margin: 0 0 20px 0;} #sub-columns3 .subcol:nth-child(1), #sub-columns3 .subcol:nth-child(2){margin: 0 0 20px 0;} #sub-columns4 .subcol:nth-child(1), #sub-columns4 .subcol:nth-child(2){margin: 0 0 20px 0;} #sub-onecolumn .subcol:nth-child(1){margin: 0 0 20px 0;} #sub-twocolumns .subcol:nth-child(1){margin: 0 0 20px 0;} .subcol .themes-pic {height:480px;} .subcol .course-pic {height:480px;} .subcol .sustain-pic {height:480px;} .newsgrid {grid-template-columns: repeat(3, minmax(1px, 100%));} .newsgrid > div ul {margin:1rem 0.6rem;} .accesswrap {display:block;} .access > div.icon_access {margin-top:0rem;} .access > div.txt_access {margin-top:2rem;} /*resources/agmap*/ .agmap1 {grid-gap:2.5rem; grid-template-columns:220px auto;} .agmap1img {background-size:200px; margin:2.8rem 0 2.8rem 1.5rem; width:180px; height:180px; border:10px solid #FFF;} .agmap1_desc h2 {margin-top:0;} h2.agmapH {font-size:3.0rem; line-height:3.2rem; padding:80px 0;} h2.agmap-commoditiesH {font-size:4.0rem; line-height:4.2rem; padding:80px 0;} h2.agmap-commoditiesHL {font-size:3.3rem; line-height:3.5rem; padding:80px 0;} .grid3cols {display:block;} .grid3cols > div {margin-top:1rem; padding-bottom:0.1rem;} .agmap-description {height:auto; margin:1rem 2rem;} .h220px {height:360px;} .h330px {height:480px;} .logodescgrid {grid-template-columns:130px 1fr 130px;} /*programs/topcut*/ #topcutcol-column.display-flex {-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #topcutcol-column .topcutcol:nth-child(1), #topcutcol-column .topcutcol:nth-child(2), #topcutcol-column .topcutcol:nth-child(3) {margin: 0 0 30px 0;} section#topcutcol-column {margin:0 30px;} .topcutcol .topcut-pic {height:380px;} /*programs/schoolyard*/ #schoolyard-column.display-flex {-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #schoolyard-column .schoolyard:nth-child(1), #schoolyard-column .schoolyard:nth-child(2), #schoolyard-column .schoolyard:nth-child(3) {margin: 0 0 30px 0;} section#schoolyard-column {margin:0 30px;} .schoolyard .schoolyard-pic {height:380px;} /**********AgBadging*********/ .milelanding-pic {height:230px;} /*agbadging landing page*/ #milelanding-columns.display-flex {-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #milelanding-columns .milelandingcol:nth-child(1), #milelanding-columns .milelandingcol:nth-child(2){margin: 0 0 100px 0;} /*students,teachers,volunteers*/ #milestone-columns1.display-flex {-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #milestone-columns2.display-flex {-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #milestone-columns1 .milestonecol:nth-child(1), #milestone-columns1 .milestonecol:nth-child(2){margin: 0 0 20px 0;} #milestone-columns2 .milestonecol:nth-child(1), #milestone-columns2 .milestonecol:nth-child(2){margin: 0 0 20px 0;} } @media screen and (max-width: 850px) { #scroll {bottom:0;} /**********Homepage*************/ .cuteicons ul li {display: block; padding: 15px 0; width: 99%;} .agliteracy_left {float:none; max-width:80%; margin:0 auto; padding-right:5%;} .agliteracy_right {float:none; width:95%; text-align:center; margin:1rem auto;} #agliteracy h2 {margin:1.0rem 0.2rem;} #agliteracy .date {margin:0.5rem 0.2rem;} #agliteracy .booktitle {margin:0 0.2rem;} #agliteracy .author {margin:0 0.2rem;} .homelink ul li a::before {content:none;} #podcast {width:96%; margin:10px 1%; text-align:center;} .podcast_logo {float:none; width:220px; margin:0 auto;} .podcast_right {float:none; width:90%; margin:0 auto;} .podcast_right h2 {margin:1rem;} .podcast_right p {margin:1rem;} /************Subpage************/ .plain2grids {display:block;} .school4grid {grid-template-columns: 45px 1fr 1fr 1fr; margin:1rem 0.5rem;} .school4grid > div {padding:0.1rem; font-size:0.75rem; line-height:0.9rem;} .school4grid > div.head {font-size:0.9rem;} .schoolphotos {grid-template-columns:repeat(1, minmax(1px, 100%)); grid-gap:1rem;} .grownyphotos {grid-template-columns:repeat(1, minmax(1px, 100%)); grid-gap:1rem;} .mac4grid {grid-template-columns: 45px 1fr 1fr 1fr; margin:1rem 0.5rem;} .mac4grid > div {padding:0.1rem; font-size:0.75rem; line-height:0.9rem;} .mac4grid > div.head {font-size:0.9rem;} .topcut4grid {grid-template-columns: 45px 1fr 1fr 1fr; margin:1rem 0.5rem;} .topcut4grid > div {padding:0.1rem; font-size:0.75rem; line-height:0.9rem;} .topcut4grid > div.head {font-size:0.9rem;} .topcut5grid {grid-template-columns:1fr 1fr 1fr 1fr 1fr; margin:0 0.3rem 2rem 0.3rem;} .topcut5grid {margin:1rem 0.5rem;} .topcut5grid > div {padding:0.1rem; font-size:0.75rem; line-height:0.9rem;} .topcut5grid > div.head {font-size:0.9rem;} .topcut6grid {margin:0 0.3rem 2rem 0.3rem;} .topcut6grid > div {padding:0.1rem; font-size:0.75rem; line-height:0.9rem;} .topcut6grid > div.head {font-size:0.9rem;} .elearn ul li {width:22%;} .logo3grid {grid-gap:1rem;} /*Image styles*/ .width400 {width:45%;} .width300 {width:35%;} .photodesc_right {float:none; margin:0 auto;} } @media screen and (max-width: 768px) { /*iPad*/ #footer-bottom .footrow:nth-child(1) ul {display:block;} #footer-bottom .footrow:nth-child(1) li {display:block;} #footer-bottom .footrow:nth-child(1) li.address {padding-right:0; margin:1rem;} #footer-bottom .footrow:nth-child(1) li.contact {line-height:5rem; margin:1rem;} #footer-bottom .footrow:nth-child(1) a.footerlogo {width:220px; margin:1rem;} .buttonwrap {margin:1rem auto} .button_width350 {width:90%;} /*grants/conference, grow, programs/stem*/ .button_width550 {width:100%;} /*programs/read*/ .button_virtual {width:90%;} /**********Homepage*************/ ul.impact {padding:0 0 20px 0;} ul.impact li {width:98%; padding-top:15px;} ul.impact li h3 {margin:0;} ul.impact li p {margin:0;} /************Landing************/ .landingcol .resources-pic {height:300px;} .landingcol .grants-pic {height:300px;} .landingcol .programs-pic {height:300px;} /************Subpage************/ .subcol .themes-pic {height:340px;} .subcol .course-pic {height:340px;} .subcol .sustain-pic {height:340px;} #alwcol-column.display-flex {-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #alwcol-column .alwcol:nth-child(1), #alwcol-column .alwcol:nth-child(2){margin: 0 0 30px 0;} section#alwcol-column {margin:0 30px;} .alwcol .alw-pic {height:280px;} #grownycol-column.display-flex {-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #grownycol-column .grownycol:nth-child(1), #grownycol-column .grownycol:nth-child(2), #grownycol-column .grownycol:nth-child(3) {margin: 0 0 20px 0;} section#grownycol-column {margin:0 30px;} .grownycol .growny-pic {height:280px;} .threephotos {grid-template-columns:repeat(2, minmax(1px, 100%)); grid-gap:1rem;} .recipient4grid {grid-template-columns: 1fr 1fr 1fr 1fr; margin:1rem 0.5rem;} .recipient4grid > div {padding:0.1rem; font-size:0.75rem; line-height:0.9rem;} .recipient4grid > div.head {font-size:0.9rem;} .contestgrid {display:block;} .twogrids {grid-template-columns:repeat(1, minmax(1px, 100%)); grid-gap:1.5rem; margin:1.5rem;} .logodescgrid {display:block;} .logodescgrid img {width:180px; text-align:center; margin:0 auto;} .schoolprizes {display:block; grid-template-columns:auto auto; margin:0 auto; text-align:center;} .elearn h3 {font-size:5rem !important; line-height:5rem !important; margin-bottom:2rem !important;} .elearn .egrade {font-size:1.3rem; line-height:1.4rem; font-style:italic;} /*resources/agmap*/ .agmap1 {display:block; padding-top:2rem;} .agmap1 > div {text-align:center;} .agmap1img {text-align:center; margin:0 auto 1rem auto; background-size:240px; width:220px; height:220px;} .agmap1_desc {position:static; top:auto; transform:none;} .agmap1_desc p {margin:1rem;} .agmap1 button {margin:0 auto 3rem auto; text-align:center;} /*resources/agmap_about*/ .button_nasswrap {margin:1rem auto; text-align:center;} .button_nass {width:90%; margin:0.5rem 5%; text-align:center;} .buttonwrapinline {display:block; grid-template-columns:88%; margin-left:0;} .buttonwrapinline > div button {font-size:1rem;} /**********AgBadging*********/ .milelandingcol h3 {font-size:1.7rem; line-height:1.7rem} .milestonecol h3 {font-size:1.4rem; line-height:1.5rem;} /*Matrix*/ .half {width:100%; padding-right:0%; padding-top:10px;} .logingrid {grid-template-columns:repeat(1, minmax(1px, 100%)); grid-gap:0.1rem; margin:0 15px;} .mxsearchw {width:95%; margin-top:2px !important; margin-left:0 !important;} .mxloginw {width:75%;} .mxcenterw {width:75%;} .resetinputs {width:72%;} .mxLRbutton {width:75%;} .lessonanchor {display:block; margin-left:3.2rem;} .mark2 {top:36px !important; left:10px !important;} .purpose2 {margin:0 0.5rem 0rem 3.4rem !important;} #standardbtns TR TD {padding:0px 1px;} .standardbtn {font-size:0.95rem; line-height:1.09rem; 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;} /*Image styles*/ .width400 {width:75%;} .width300 {width:75%;} .marginright {margin:15px auto; text-align:center;} .marginleft {margin:15px auto; text-align:center;} .floatright {float:none;} .floatleft {float:none;} } @media screen and (max-width: 540px) { /*Surface Plus*/ #scroll {display: none !important;} h1.logo {margin-top:2rem; width:75%;} nav.sign_log {top:-28px; right:1rem; } nav.sign_log ul {margin-bottom:1rem;} #footer-bottom .footrow:nth-child(2) ul li {width:auto; padding:0 1rem; font-size:0.85rem;} /**********Homepage*************/ .agliteracy_left {max-width:83%; padding-right:8%;} /************Landing************/ .landingcol .grants-pic {height:240px;} .landingcol .resources-pic {height:240px;} .landingcol .programs-pic {height:240px;} /************Subpage************/ .subcol .themes-pic {height:240px;} .subcol .course-pic {height:240px;} .subcol .sustain-pic {height:240px;} .threephotos {grid-template-columns:repeat(1, minmax(1px, 100%)); grid-gap:1.5rem; margin:2.5rem 0.5rem;} .twophotos {grid-template-columns:repeat(1, minmax(1px, 100%)); grid-gap:2rem 1rem; margin:2.5rem 0.5rem;} .newsgrid {grid-template-columns: repeat(1, minmax(1px, 100%));} .duegrid {display:block; grid-template-columns:auto auto; margin:0 0.2rem 1rem 1.5rem;} .duegrid > div.head {margin-left:-0.5rem; margin-bottom:-0.5rem;} .elearn ul li {width:40%;} .coordinator {display:block; grid-gap:0.5rem; margin:1rem auto; text-align:center;} .coordinator > div {display:flex; justify-content:center;} .coordinator > div.icon_coordinator i {padding:1.2rem 0 0 0.1rem;} .coordinator > div.txt_coordinator {margin:0.5rem 5%; width:auto; height:3rem;} .coordinator > div.txt_coordinator a::after {content:"";} .access {display:block; grid-template-columns:auto auto; grid-gap:0.5rem; margin:1rem auto; text-align:center;} .access > div {display:flex; justify-content:center;} .access > div.icon_access i {padding:1.2rem 0 0 0.1rem;} .access > div.txt_access {margin:0.5rem 5%; width:auto; height:3rem;} .access > div.txt_access a::after {content:"";} .school3grid {grid-template-columns: 45px 1fr 1fr; margin:1rem 0.5rem;} .school3grid > div {padding:0.1rem; font-size:0.75rem; line-height:0.9rem;} .school3grid > div.head {font-size:0.9rem;} .topcutwin ul li {padding:1rem; width:80px; font-size:19px; line-height:19px;} .topcutwin i {font-size:2.5rem; line-height:2.5rem; margin-top:18px;} .topcutwin figure {width:80px; height:80px;} .agmapcol h3 {font-size:1.7rem; line-height:1.8rem;} h2.agmap-commoditiesH {font-size:3.1rem; line-height:3.3rem; margin:0 0.5rem; padding:70px 0;} h2.agmap-commoditiesHL {font-size:2.7rem; line-height:2.9rem; margin:0 0.5rem; padding:70px 0;} .h220px {height:250px;} .h330px {height:360px;} .twocols {height:230px;} .logo3grid {display:block;} .logo3grid > div {margin:2rem;} .logo3grid > div a.nyaitc {width:95%;} .topcutcol .topcut-pic {height:250px;} .schoolyardcol .schoolyard-pic {height:250px;} .buttonwrapinline > div button {font-size:0.8rem; line-height:0.8rem;} /***Matrix***/ #main-mybinderlogin {width:auto; margin:0 auto;} #bands { display:contents; width:auto;} } @media screen and (max-width: 414px) { #footer-top .footrow:nth-child(1) li {width:16px; height:16px; margin:5px;} #footer-top .footrow:nth-child(1) i {font-size:1.22rem;} #footer-bottom .footrow:nth-child(2) ul li {padding:0 0.2rem; font-size:0.6rem;} /************Landing************/ .landingcol h3 {height:100px;} .landingcol .grants-pic {height:180px;} .landingcol .resources-pic {height:180px;} .landingcol .programs-pic {height:180px;} /************Subpage************/ h2.heading {font-size:3rem; line-height:3.2rem; font-weight:300; padding:60px 0;} h2.agbadgingH {font-size:2.5rem; line-height:2.7rem; font-weight:300; padding:60px 0;} h2.matrixH {font-size:2rem; line-height:2.2rem; font-weight:300; padding:60px 0;} .twoareas {display:block;} .twoareas > div {margin-top:1rem;} .subcol .themes-pic {height:200px;} .subcol .course-pic {height:200px;} .subcol .sustain-pic {height:200px;} .membergrid {display:block;} .membergrid > div {margin-top:1rem; padding:0.6rem 0.6rem 1rem 0.6rem;} .membergrid > div h5 {margin-top:0; font-size:1.4rem; line-height:1.5rem;} .membergrid img {width:120px;} .memberinfo {grid-template-columns:130px auto;} .subpage h3 {font-size:2.5rem; line-height:2.7rem;} .subpage h3.subh3 {margin:2rem 0.2rem 0.2rem 0.2rem !important;} .subpage h4 {font-size:1.9rem; line-height:2.1rem; margin:1rem 0.2rem 0.1rem 0rem;} .subpage h5 {font-size:1.5rem; line-height:1.7rem; margin:1rem 0.2rem 0.1rem 0rem;} .subpage h6 {font-size:1.2rem; line-height:1.4rem; margin:1rem 0.2rem 0.1rem 0rem} .subpage h7 {font-size:1.2rem; line-height:1.4rem; margin:1rem 0.2rem 0.1rem 0rem} .subpage p {margin:0 0.2rem 1rem 0.5rem;} .subpage p.br {margin:0 0.2rem 0.2rem 0.5rem;} .subpage p.dent {margin:0 0.2rem 1rem 0.8rem;} .subpage p.dentbr {margin:0 0.2rem 0.2rem 0.8rem;} .subpage p.dent2 {margin:0 0.2rem 1rem 1rem;} .subpage ul, ol {margin:0 0.2rem 1rem 1.5rem;} .topcutwin ul li {display: block; padding: 15px 0; width:auto;} .grownywin ul li {display: block; padding: 15px 0; width:auto;} .macwin ul li {display: block; padding: 15px 0; width:auto;} .grid2cols {display:block;} .grid2cols > div {margin-top:1.5rem;} .grid2cols ul {margin:0 0.5rem 1.5rem 1rem !important;} .grid3cols {display:block;} .grid3cols > div {margin-top:1.5rem;} .grid4cols {display:block;} .grid4cols > div {margin-top:1.5rem;} .artcontestgrid {display:block;} .artpic {margin-top:1rem !important;} .agmapcol h3 {font-size:1.5rem !important; line-height:1.6rem !important;} .agmap1img {background-size:200px; width:180px; height:180px;} .agmap1_desc h2 {font-size:1.8rem; line-height:1.9rem;} h2.agmapH {font-size:2.3rem; line-height:2.5rem; padding:40px 0;} h2.agmap-commoditiesH {font-size:3.0rem; line-height:3.2rem;} h2.agmap-commoditiesHL {font-size:2.3rem; line-height:2.5rem;} /**********AgBadging*********/ .agbadging .bookgrid {display:block; margin-bottom:3rem;} .buttonwrapinline > div button {font-size:0.6rem; line-height:0.6rem;} .h220px {height:180px;} .h330px {height:300px;} /*Matrix*/ #thumbnail {margin:1rem auto; max-width:70%;} .standardbtn {font-size:0.8rem; line-height:0.9rem;} } @media screen and (max-width: 320px) { h2.heading {font-size:2.4rem; line-height:2.6rem; font-weight:300; padding:40px 0;} h2.agbadgingH {font-size:2.1rem; line-height:2.3rem; font-weight:300; padding:40px 0;} h2.matrixH {font-size:1.8rem; line-height:2rem; font-weight:300; padding:40px 0;} .memberinfo {display:block; text-align:center;} .memberphoto img {margin:0.5rem auto; text-align:center;} }