/*
Theme Name: ETI 2025
Description: ETI 2025 WordPress Theme
Author: Gragg Advertising
Author URI: http://graggadv.com/
Version: 0
*/

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace, monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type="button"],[type="reset"],[type="submit"],button{-webkit-appearance:button}[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type="checklist"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

/* screenreader */
.sr-only, .m-sr-only {border:0; clip:rect(0, 0, 0, 0); height:1px; overflow:hidden; padding:0; position:absolute; white-space:nowrap; width:1px}
.sr-only-focusable:active,.sr-only-focusable:focus {clip:auto; height:auto; overflow:visible; position:static; white-space:normal; width:auto}
#skipnav {background-color: #2c713c; display: inline-block; color: #fff; left: 0; padding: 0.5em 1em; position: absolute; text-decoration: none; top: 0; z-index: 10}

:root {
	--brand: #21356a;
	--dark: #000000;
	--dark2: #979797;
	--field: #d4e6ff;
	--highlight: #f8ba00;
	--light: #ffffff;
	--light2: #f7f7f7;
	--light3: #f0f0f0;
	--light-alt: #f1fafe;
	--light-alt2: #e2f5fc;
	--light-alt3: #ceeffb;
	--notice: #0568fd;
	--rfi: #be1e2d;
	--font: "Inter", sans-serif;
	--font2: "proxima-nova", sans-serif;
	--font3: "Noto Sans", sans-serif;
	--gradient: rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 50%;
}

/* basic */
html {background-color: var(--light); height: 100%; scroll-behavior: smooth}
body {align-items: stretch; background-color: var(--light); color: var(--dark); display: flex; flex-direction: column; font-family: var(--font); overflow-x: hidden; min-height: 100%; margin: 0 auto; position: relative; width: 100%}
h1, h2, h3, h4, h5, h6, p, li {margin: 1rem 0}
h1, h2, h3, h4, h5, h6 {color: var(--dark); font-family: var(--font2); line-height: 1}
h2 {font-size: 2.5em}
h3 {font-size: 2em}
a {color: inherit}
img {height: auto; object-fit: contain; max-width: 100%}
pre {text-align: left !important; white-space: pre-wrap}
main {flex-grow: 1}
[id] {scroll-margin-top: 6.5rem}

/* general */
#nojs_warning {background-color: red; border: 3px double white; color: white; display: block; font-weight: bold; padding: 1rem; text-align: center}
.container {padding: 0 1rem; position: relative; z-index: 0}
.copy > :first-child {margin-top: 0 !important}
.copy > :last-child {margin-bottom: 0 !important}

.button {background-color: var(--brand); border-radius: 10rem; box-shadow: 0 0.25rem 0.125rem #00000040; color: var(--light); display: inline-block; font-family: var(--font2); font-weight: bold; min-width: 6rem; padding: 0.5rem 1rem; text-align: center; text-decoration: none}

.link {color: var(--brand); font-weight: bold; text-decoration: none}
.link span, .link::after {display: inline-block; vertical-align: middle}
.link::after {content: "\2192"; padding-left: 0.25rem}

/*
.overlay {position: relative}
.overlay::before {background-color: rgba(0,0,0,0.3333); content: ''; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0}
.overlay > * {position: relative; z-index: 1}
.accordion {box-shadow: 0 2px 0 var(--neutral2), 0 -2px 0 var(--neutral2); margin: 2px 0; padding: 0.5rem 0}
.accordion_toggle {cursor: pointer; margin: 0; padding: 0.5rem 2rem 0.5rem 0; position: relative}
.accordion_toggle::after {content: '+'; font-size: 3rem; font-weight: lighter; color: var(--neutral2); line-height: 1; position: absolute; right: 0; top: -0.25rem}
.accordion_toggle[aria-expanded='true']::after {content: '-'; top: -0.5rem}
body.js .accordion_content{display: none}
.mapholder {position: relative; height: 0; padding-bottom: 34%}
.videowrapper {margin: 1rem auto}
.videoholder:has(iframe) {height: 0; padding-bottom: 56.25%; position: relative}
.videoholder iframe, .mapholder iframe {border: none; height: 100%; left: 0; position: absolute; top: 0; width: 100%}
*/
.social_links {display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center}
.social_link {border-radius: 50%; display: inline-block; height: 48px; padding: 16px; width: 48px}
.social_icon {height: 100%; object-fit: contain; width: 100%}

/* form */
.theme-form .field {margin: 1rem 0}
.theme-form input, .theme-form select, .theme-form textarea {background-color: var(--light); border: none; border-radius: 0.5rem; box-sizing: border-box; height: 2.6875rem; padding: 0.5rem 1rem; width: 100%}
.theme-form textarea {min-height: 4rem; resize: vertical}
.theme-form input[type="submit"] {background-color: var(--brand); border-radius: 10rem; box-shadow: 0 0.25rem 0.125rem #00000040; color: var(--light); display: block; font-size: 1.375rem; font-weight: bold; height: auto; margin: 0 auto; padding: 1rem 3rem; width: auto}
.theme-form .cb_wrap  {align-items: flex-start; display: flex; gap: 0.5rem; width: 100%}
.theme-form .field.cb label > :first-child {margin-top: 0}
.theme-form .field.cb label > :last-child {margin-bottom: 0}
.theme-form .field.cb input {height: auto; margin-top: 0.125rem; padding: 0; width: auto}
.theme-form .form_disclaimer, .theme-form .optin label {font-size: .875rem}
.theme-form .form_disclaimer {text-align: center}
.theme-form [name="comments"] {display: none}
.theme-form .cf-turnstile {margin: 1rem auto; width: max-content}

/* header */
#top_banner {background-color: var(--notice); color: var(--light); padding: 1rem 0}
#header {background-color: var(--light)}
body.js #header {position: sticky; top: 0; z-index: 1}
#header .container {padding: 0}
#button_bar, #logomenu_bar {display: table; table-layout: fixed}
#button_bar, #logomenu_bar {width: 100%}
#top_phone, #top_reqinfo, #top_logo, #top_menu_open {display: table-cell}
#top_phone, #top_reqinfo {color: var(--light); font-family: var(--font3); font-weight: bold; padding: 1rem; text-align: center; text-decoration: none; text-transform: uppercase}
#top_phone {background-color: var(--rfi)}
#top_searchform {display: none}
#top_reqinfo {background-color: var(--brand)}
#logomenu_bar {margin: 0 1rem; width: calc(100% - 2rem)}
.header_logo {display: block; height: auto; max-height: 5rem; max-width: 100%; width: auto}
#top_menu_open {background: transparent; border: none; color: var(--primary); cursor: pointer; font-size: 5rem; line-height: 0.8; margin: 0 0 0 auto; padding: 0; text-align: right; text-decoration: none; width: 4rem}

/* menu */
#top_menu_close {background-color: var(--dark); border: none; color: var(--light); cursor: pointer; display: block; padding: 0.5rem 1rem; position: sticky; text-align: right; top: 0; width: auto; z-index: 1}
#top_menu .menu, #top_menu .sub-menu {list-style: none}
#top_menu .menu {background-color: var(--brand); color: var(--light); margin: 0; padding: 0.75rem 0 0.75rem 1rem}
#top_menu .sub-menu {padding: 0 0 0 1rem}
#top_menu li {margin: 0}
#top_menu a {display: block; padding: 0.25rem 0; text-decoration: none}
#top_menu .menu-item-has-children {position: relative}
#top_menu .menu-item-has-children a {margin-right: 3rem}
#top_menu .submenu_toggle {background-color: transparent; border: none; color: var(--light); box-sizing: content-box; cursor: pointer; padding: 0.25rem 1rem 0.25rem 1rem; position: absolute; right: 0; top: 0; width: 1rem}
#top_menu .submenu_toggle span {display: inline-block; transform: scale(1.25, 0.75)}
body.js #top_menu_overlay {display: none}
body.nojs #top_menu_close {display: none}
body.nojs #top_menu li {margin: 0}
body.nojs #top_menu a {display: inline-block; margin: 0 0.5rem}
body.nojs #top_menu .sub-menu li {display: inline}
body.menu_open {overflow: hidden}
body.menu_open #top_menu_overlay {background-color: rgba(0,0,0,0.5); bottom: 0; display: block; left: 0; overflow-y: auto; position: fixed; right: 0; top: 0}
body.menu_open #top_menu_inner {height:auto; margin: 0 0 0 auto; max-width: 360px; position:static; white-space:normal; width:auto}

/* hero */
#hero {background-color: #000000; background-size: cover; color: var(--light); padding: 20rem 0 2rem; position: relative}
#hero:before {background: linear-gradient(0deg, var(--hero-gradient)); content: ''; height: 100%; left: 0; position: absolute; top: 0; width: 100%}
#hero.top {padding: 2rem 0 20rem}
#hero.top:before {background: linear-gradient(180deg, var(--hero-gradient))}
.pagehead {color: inherit; font-size: 2.5rem}
#hero .pagehead {font-size: 3rem}
body.home #hero .pagehead {text-transform: uppercase}
.pagehead .prehead {display: block; font-size: 65%}
#hero .pagehead {text-shadow: 0.25rem 0.25rem 0.25rem #000000c0}
#hero .pagehead .prehead {color: var(--highlight)}
.pagehead_copy {font-size: 1.125rem}
#hero .pagehead_copy {text-shadow: 0.125rem 0.125rem 0.125rem #000000c0}

/* sections */
section.section {margin: 4rem 0}
section.section.bgCol {margin: 0; padding: 4rem 0}
section.section.bgCol .container > :first-child {margin-top: 0}
section.section.bgCol .container > :last-child {margin-bottom: 0}
section.section.no_bottom_pad {margin-bottom: 0; padding-bottom: 0}
section.section.no_top_pad {margin-top: 0; padding-top: 0}
section.bgCol_white2 {background-color: var(--light2)}
section.bgCol_white3 {background-color: var(--light3)}
section.bgCol_dk_blue {background-color: var(--brand)}
section.altCol {color: var(--light)}
.section_heading, .section_subheading {color: var(--brand); font-family: var(--font2); line-height: 1}
section.altCol .section_heading, section.altCol .section_subheading {color: var(--highlight)}
.section_preheading {color: var(--dark2)}
.section_heading {font-size: 2.5rem}
.section_heading.big {font-size: 3.5rem}
.section_subheading {font-size: 1.5rem}
.imgholder.composted, .imgholder.img, .imgholder .img {background-repeat: no-repeat; background-size: cover; padding-bottom: 50%}
.imgholder.composted {position: relative}
.imgholder.composted .img {padding-bottom: 0; position: absolute}
.imgholder.composted .img_fg {background-size: contain; bottom: 0; left: 0; right: 0; top: 1rem; z-index: 1}
.imgholder.composted .img_bg {background-size: cover; bottom: 3rem; left: 3rem; right: 0; top: 0; z-index: 0}
.rev .imgholder.composted .img_bg {left: 0; right: 3rem}
.no_bottom_pad .copywrap {padding-bottom: 2rem}
.no_top_pad .copywrap {padding-top: 2rem}

/*boxes*/
.sub_section_boxes .section_heading {
  text-align: center;
}
.box {
  margin: 2rem 0;
}
.boximg img {
  display: block;
}
.boximg {
  width: max-content;
  margin: 1rem auto;
	max-width: 640px;
}
.boximg::after {
  height: 0.25rem;
  width: auto; 
  display: block;
  background-color: var(--brand);
  content: '';
  margin: 0.5rem 0 0 0;
  border-radius: 10rem;
}
.box .link {display:block; margin: 1rem 0}

/*form*/
.sub_section_form .formhead {margin-bottom: 2rem; text-align: center}
.formBG_wrap_inputs {padding: 1rem 0 2rem}
.formBG_wrap_bg .img {background-size: cover; padding: 0}

/*main content*/
#main_content.enhanced .container {padding: 0}
#topform {background-color: var(--rfi); border-top: 0.625rem solid var(--highlight); color: var(--light); padding: 1rem}
#topform .form_heading {color: inherit; font-size: 1.625rem}
#topform form {margin-top: 2rem}
#topform input[type="submit"] {background-color: var(--highlight); color: var(--dark)}
#topform .optin label {font-size: .75rem}
#main_content_content {background-size: cover; padding: 3rem 1rem}
#home_promo {align-items: center; display: flex; gap: 1rem; margin: 1rem 0}
#home_promo {margin: 1rem auto 1rem 0; width: 480px}
.home_promo_copy {font-size: 1.125rem}

/*logos*/
.sub_section_logos {text-align: center}
.sub_section_logos .logos {align-items: center; display: flex; flex-wrap: wrap; gap: 2rem; justify-content: space-evenly; margin: 2rem 0}

/*program data*/

.program_info_data_stats .stat {
  display: inline-block;
  vertical-align: top;
  margin: 1rem 2rem;
}
.program_info_data_stats .stat .heading, .program_info_data_stats .stat .number, .program_info_data_stats .stat .source {
  display: block;
}
.program_info_data_stats {
  text-align: center;
}
.program_info_data_stats .stat .number {
  font-weight: bold;
  font-size: 2rem;
  margin: 0.5rem 0
}
.program_info_data_stats .stat .heading, .program_info_data_stats .stat .source {
  color: var(--dark2);
}
.program_info_data_stats .stat .source {
  font-size: .75rem;
  font-weight: bold;
}
.program_info_data_stats .stat .heading {
  text-transform: uppercase;
}

/*schedule visit*/
.sub_section_visit {background-color: var(--brand); color: var(--light)}
.sub_section_visit .container {padding: 0}
.sub_section_visit .copy {padding: 2rem 1rem}
.sub_section_visit .section_heading, .sub_section_visit .section_subheading {color: inherit}
.sub_section_visit .section_heading {font-size: 1.875rem}
.sub_section_visit .section_subheading {font-size: 1.125rem}
.sub_section_visit .buttonholder {margin-top: 2rem}
.sub_section_visit .button {background-color: var(--highlight); color: var(--dark)}

/*testimonial*/
.testimonial_content {font-family: var(--font2); font-size: 1.5rem}
.testimonial_content .quotemark {display: block; font-size: 4rem; height: 0.5em}
.testimonial .img {background-size: contain}

/* footer */
#footer {background-color: var(--light3); padding: 1rem 0}
#footer_logo .footer_logo {display: block; margin: 1rem 0; max-width: 640px; width: 100%}
.footer_col {margin: 3rem 0}
.footer_col a {text-decoration: none}
#footer_contact {font-size: 1.25rem}
#footer_nav .menu {font-weight: bold; list-style: none; padding: 0}
#footer_logos_social {text-align: center}
#footer_promo {align-items: center; display: flex; gap: 1rem; margin: 1rem 0}
.footer_promo_copy {font-size: 1.25rem; text-align: left}
#footer_social {margin: 2rem 0}
#footer_logos {align-items: center; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; margin: 1rem 0}
.footer_logo {height: auto; width: 120px}
#subfooter {text-align: center}
#subfooter_copyright, #subfooter_nav, #subfooter_nav li {display: inline}
#subfooter_nav {list-style: none; padding: 0}
#subfooter_nav:before {content: " "}
#subfooter_nav li:not(:last-child)::after {content: " | "}
