html, body { color: #333; font-family: futura-pt-condensed, sans-serif; font-size: 22px; -webkit-font-smoothing: antialiased; }
.container { padding: 0; width: 100%; }
.row { margin: 0; }
.row > div { padding: 0 1.5% 12px; }
.content { width: 100%; }
.vertical-center > div { float: none; display: inline-block; margin-left: -.5%; vertical-align: middle; }
.vertical-center > div:first-of-type { margin: 0; }

/* Links */
a { transition: background-color .2s, color .2s; }
a:hover,
a:focus { text-decoration: none; }
.button { background-color: #c47; border-radius: 14px; border: 0; color: #fff; display: inline-block; letter-spacing: .05em; margin-top: 12px; padding: 4px 16px; transition: background-color .2s; }
.button:hover { background-color: #b16; color: #fff; }
.button:focus { color: #fff; }

/* Headers */
h1 { font-size: 3.3em; margin: 30px 0 22px; }
h2 { font-size: 2.2em; margin: 12px 0 0; }
h3 { font-size: 1.8em; margin: 28px 0 0; }
h4 { font-size: 1.6em; margin: 28px 0 0; }
h5 { font-size: 1.4em; margin: 26px 0 0; }
h6 { font-size: 1.3em; margin: 26px 0 0; }

/* Paragraphs & Lists */
p { line-height: 1.34em; margin: 16px 0 6px; }
ul, ol { margin: 16px 0 10px; }
li {  line-height: 1.4em; margin-bottom: 8px; }

/* Forms */
form { margin: 18px 0; }
label { display: block; margin: 10px 0 8px; width: 100%; }
input[type="text"] { margin-bottom: 8px; padding-left: 3px; width: 100%; }
textarea { height: 80px; margin-bottom: 8px; padding: 3px 5px; resize: none; width: 100%; }
input[type="checkbox"],
input[type="radio"] { margin: 0 4px 0 2px; }
input[type="checkbox"] + label,
input[type="radio"] + label { display: inline-block; margin-right: 14px; position: relative; top: -1px; width: auto; }
input[type="submit"],
input[type="reset"] { background-color: #c47; border-radius: 14px; border: 0; color: #fff; letter-spacing: .05em; margin-top: 14px; padding: 4px 16px; transition: background-color .2s; }
.button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover { background-color: #b16; }

/* Accordion  (can remove if not needed)*/
.accordion-header { cursor: pointer; }
.accordion-header i { font-size: .7em; margin-left: 12px; transition: transform .45s; vertical-align: middle; }
.opened .accordion-header i { transform: rotate(180deg); }
.accordion > div { padding: 3px 0; }

/* Modal Window   (can remove if not needed)*/
#modal-window { height: 100%; left: 0; position: fixed; top: -100%; transition: top .95s; width: 100%; }
#modal-window.showing { top: 0; }
#modal-window > span { background-color: rgba(0,0,0,.75); cursor: pointer; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
#modal-window > span > span { color: #fff; font-size: 3em; line-height: .6em; padding: 13px 15px; position: absolute; right: 0; top: 0; transition: color .2s; }
#modal-window > span > span:hover { color: #ddd; }
#modal-window > div { background-color: #fff; border: 1px solid #333; box-shadow: 1px 63px 58px 0 #111; height: 78%; margin: -84px auto 0; padding: 12px 16px; position: relative; transition: 1s ease-in-out .1s; width: 70%; }
#modal-window.showing > div { box-shadow: 4px 13px 28px 0 #111; margin-top: 60px; }

/*********************************************/
/******   Custom CSS  ************************/
/*********************************************/

.header { background-color: #000; background-image: url("../images/wood_bg.jpg"); background-size: 100%; border-bottom: 12px solid #dfd3b0; padding: 54px 18px 12px; position: relative; }
.header h1 { color: #fff; font-size: 2em; letter-spacing: .03em; margin: 0; text-transform: uppercase; }
.header img { bottom: -54px; left: 50%; margin-left: -107px; position: absolute; width: 214px; }
.menu { bottom: 0; margin: 0; padding: 8px 14px; position: absolute; right: 0; }
.menu li { border-right: 2px solid #dfd3b0; display: inline-block; font-size: 1.3em; line-height: 1.2em; padding: 0 24px 0 18px; }
.menu li:last-of-type { border: 0; }
.menu li a { color: #fff; letter-spacing: .02em; }
.menu li a:hover { color: #dfd3b0; }
.menu li a.selected { color: #dfd3b0; }

#home-top-row { background-color: #373c49; border: 12px solid #fff; border-width: 6px 0 12px; padding: 64px 30px 46px; text-align: center; }
#home-top-row p { color: #fff; font-size: 2.4em; line-height: 1.1em; margin: 0 auto; width: 50%; }
#home-top-row p:last-of-type { color: #dfd3b0; font-size: 1.3em; line-height: 1.3em; margin-top: 36px; width: 76%; }

#alert-banner { background-color: #a37429; border-bottom: 12px solid #fff; color: #fff; font-size: 1.8em; line-height: 1.2em; padding: 46px 2% 16px; text-align: center; }
#alert-banner a { color: #fff; display: inline-block; text-decoration: underline; }
#alert-banner strong { text-transform: uppercase; }
#alert-banner a:hover { color: #dddd; }

h2 { border: 2px dashed #dfd3b0; color: #dfd3b0; display: inline-block; font-size: 5em; font-weight: 700; line-height: .85em; margin: 28px 0; padding: 8px 18px; text-transform: uppercase; }
.ada-element { left: -9999px; position: absolute; top: -9999px; }

.upcoming-meeting { background: #654734; color: #fff; text-align: center; }
.upcoming-meeting h2 { border: 0; color: #fff; font-size: 1.4em; margin: 20px 0 0; }
.upcoming-meeting.home-one h2 { margin-top: 50px; }
.upcoming-meeting p { margin: 0 0 8px; padding-bottom: 20px; }

#study-area { background-color: #373c49; background-image: url("../images/town_bg.jpg"); background-size: auto 100%; background-repeat: no-repeat; overflow: auto; position: relative; }
#study-area h2 { margin: 60px 0 40px 3%; position: relative; text-align: right; width: 23%; }
#study-area h2:after { border-bottom: 2px dashed #dfd3b0; content: ""; left: 100%; position: absolute; top: 50%; width: 20%; }
#study-area p { color: #fff; margin-left: 4%; position: absolute; width: 20%; }
#study-area p:last-of-type { color: #654734; left: 30%; top: 3%; width: 12%; }
#study-area div { float: right; width: 70%; }
#study-area div img { width: 100%; }

#get-involved { background-color: #583f50; background-image: url("../images/aerial_bg.jpg"); background-size: 100%; border: 12px solid #fff; border-width: 12px 0; position: relative; }
#get-involved h2 { left: 56%; margin-top: -6%; position: absolute; top: 50%; width: 34%; }
#get-involved h2:after { border-bottom: 2px dashed #dfd3b0; content: ""; right: 100%; position: absolute; top: 50%; width: 18%; }
#get-involved div { border-right: 2px dashed #dfd3b0; padding: 160px 6%; width: 50%; }
#get-involved p { color: #fff; }
#get-involved p:first-of-type { font-size: 1.8em; font-weight: 700; line-height: 1.2em; }

#mid-menu .row > div { padding: 0; }
#mid-menu a { background-color: #284331; border-right: 1px solid #fff; color: #fff; display: block; height: 240px; padding: 24px 11% 0;}
#mid-menu div:nth-of-type(2) a { background-color: #373c49; }
#mid-menu div:nth-of-type(3) a { background-color: #583f50; }
#mid-menu div:nth-of-type(4) a { background-color: #654734; border-right: 0; }
#mid-menu a:hover { background-color: #192d20; }
#mid-menu div:nth-of-type(2) a:hover { background-color: #292e3b; }
#mid-menu div:nth-of-type(3) a:hover { background-color: #3c2735; }
#mid-menu div:nth-of-type(4) a:hover { background-color: #553826; }
#mid-menu a p { margin: 0; }
#mid-menu strong { display: block; font-size: 1.5em; letter-spacing: .04em; line-height: 1em; margin-bottom: 2px; }

#timeline-row > div { background-color: #654734; background-image: url("../images/path_bg.jpg"); background-position: center; background-size: cover; border: 12px solid #fff; border-width: 12px 0; height: 1200px; position: relative; }
#timeline-row h2 { left: 10%; margin-top: -4%; position: absolute; top: 50%; text-align: center; width: 30%; }
#timeline-row h2:after { border-bottom: 2px dashed #dfd3b0; content: ""; left: 100%; margin-top: -1%; position: absolute; top: 50%; width: 33%; }
#timeline { border-left: 2px dashed #dfd3b0; height: 100%; position: absolute; right: 0; top: 0; width: 50.1%; }
#timeline > div { background-color: #654734; background-color: rgba(101,71,52,.6); border: 2px solid #93836b; border-width: 0 2px; height: 80%; left: 40%; position: absolute; text-align: center; top: 9%; width: 80px; }
#timeline > div span { color: #93836b; display: block; font-size: .9em; height: 2.846%; }
#timeline > div span.on { color: #fff; }
#timeline > div img { bottom: 100%; position: absolute; right: 100%; width: 8px; }
#timeline > div img.right { left: 100%; right: auto; transform: rotateY(180deg); }
#timeline > div img.bottom { bottom: auto; top: 100%; transform: rotateX(180deg); }
#timeline > div img.bottom.right { transform: rotate(180deg); }
#timeline h3 { color: #dfd3b0; font-size: 2.2em; margin: .9% 78px 0 0; position: absolute; right: 60%; top: 9.8%; }
#timeline h3:nth-of-type(2) { top: 23.2%; }
#timeline h3:nth-of-type(3) { top: 52.8%; }
#timeline h3:after { border-bottom: 2px dashed #dfd3b0; content: ""; left: 100%; margin-top: -1%; margin-left: 8px; position: absolute; top: 50%; width: 150px; }
#timeline p { color: #fff; font-size: 1em; left: 40%; line-height: 1em; margin: 0; margin-left: 128px; position: absolute; width: 160px; }
#timeline p:after { border-bottom: 2px dashed #fff; content: ""; margin-top: -1%; margin-right: 8px; position: absolute; right: 100%; top: 50%; width: 40px; }
#timeline p:first-of-type { top: 16%; }
#timeline p:nth-of-type(2) { left: auto; right: 60%; margin-right: 56px; text-align: right; top: 16%; }
#timeline p:nth-of-type(2):after { left: 100%; margin-left: 8px; margin-right: 0; right: auto; width: 28px; }
#timeline p:nth-of-type(2):before { border: 2px dashed #fff; border-right: 0; content: ""; height: 244%; left: 100%; margin-top: -18px; margin-left: 36px; position: absolute; width: 20px; }
#timeline p:nth-of-type(3) { top: 32%; }
#timeline p:nth-of-type(4) { left: auto; right: 60%; margin-right: 56px; text-align: right; top: 35.2%; }
#timeline p:nth-of-type(4):after { left: 100%; margin-left: 8px; margin-right: 0; right: auto; width: 28px; }
#timeline p:nth-of-type(4):before { border: 2px dashed #fff; border-right: 0; content: ""; height: 164%; left: 100%; margin-left: 36px; position: absolute; width: 20px; }
#timeline p:nth-of-type(5) { top: 41.3%; }
#timeline p:nth-of-type(5):after { top: 80%; }
#timeline p:nth-of-type(6) { top: 45.7%; width: 250px; }
#timeline p:nth-of-type(6):after { top: 86%; }
#timeline p:nth-of-type(7) { top: 50.2%; }
#timeline p:nth-of-type(8) { left: auto; right: 60%; margin-right: 56px; text-align: right; top: 59.2%; }
#timeline p:nth-of-type(8):after { left: 100%; margin-left: 8px; margin-right: 0; right: auto; width: 28px; }
#timeline p:nth-of-type(8):before { border: 2px dashed #fff; border-right: 0; content: ""; height: 488%; left: 100%; margin-top: -60%; margin-left: 36px; position: absolute; width: 20px; }
#timeline p:nth-of-type(9) { top: 61.6%; }
#timeline p:nth-of-type(10) { top: 68.6%; }
#timeline p:nth-of-type(10):after { top: 80%; }
#timeline p:nth-of-type(11) { top: 73.1%; width: auto; }
#timeline p:nth-of-type(12) { color: #dfd3b0; top: 79.7%; }

.page-header { background-image: url("../images/resources_bg.jpg"); background-size: cover; height: 400px; margin: 6px 0 0; overflow: hidden; text-align: center; }
.page-header.contact-page { background-image: url("../images/contact_bg.jpg"); height: auto; padding-top: 84px; }
.page-header h2 { position: relative; top: 28%; }
.page-header.contact-page h2 { margin-bottom: 0; position: static; }
.page-header.contact-page p { margin: 28px auto; }
.page-header h2:after { border-left: 2px dashed #dfd3b0; content: ""; height: 200px; left: 50%; position: absolute; top: 100%; width: 1px; }
.page-header.contact-page h2:after { display: none; }
.page-header h3 { color: #fff; font-size: 2em; font-weight: 700;  margin-bottom: 0; }
.page-header p { color: #fff; font-size: 1.3em; line-height: 1.1em; margin: 3px auto; width: 80%; }

.survey-button { background: #a37429; color: #fff !important; display: inline-block; font-size: 1.3em; margin-top: 14px;  padding: 7px 10px; text-decoration: none !important; }
.survey-button:hover { background: #81591a; }

#resource-row .col-md-6 { padding: 20px 6% 70px; }
#resource-row h3 { background-color: #284331; color: #fff; margin: 56px 0 18px; padding: 6px 18px; }
#resource-row h4 { font-size: 1.5em; font-weight: 700; margin-bottom: 8px; margin-left: 17px; }
#resource-row p { line-height: 1.2em; margin: 0 18px 8px; }
#resource-row p a { color: #284331; text-decoration: underline; }
#resource-row p a:hover { color: #15291c; }
#resource-row .public-meeting-materials h3 { background-color: #373c49; }
#resource-row .public-meeting-materials p { color: #373c49; }
#resource-row .public-meeting-materials p a { color: #373c49; word-wrap: break-word; }
#resource-row .public-meeting-materials p a:hover { color: #242833; }
#resource-row .public-meeting-materials img { margin: 10px 0 20px; width: 100%;}
#resource-row .previous-studies h3 { background-color: #654734; }
#resource-row .previous-studies p,
#resource-row .previous-studies p a { color: #654734; }
#resource-row .previous-studies p a:hover { color: #402819; }
#resource-row .disabled { position: relative; }
#resource-row .disabled:after { background-color: rgba(255,255,255,.5); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }

#resource-row .via-process h3 { background: #a37429; }

.wistia_responsive_padding { margin: 24px 0; }
.comment-banner {background-color: #373c49; color: #fff; display: inline-block; width: 100%; padding: 8px 10px; margin-bottom: 25px;}
.comment-banner a {color: #fff; display: inline-block; margin-right: 15px;}
.comment-banner p {color: #fff!important; display: inline-block;}
.comment-banner a img {display: inline-block; width: 25px; margin-right: 10px;}


.footer { background-color: #000; background-image: url("../images/wood_bg.jpg"); background-size: 100%; color: #fff; padding-top: 24px;  }
.footer h2 { border: 0; color: #fff; font-size: 1.8em; margin: 0; padding: 0; }
.footer h3 { color: #dfd3b0; font-size: 1.2em; margin: 0; text-transform: uppercase; }
.footer a { color: #fff; display: block; line-height: 1.3em; }
.footer a:hover { color: #dfd3b0; }
.footer p { line-height: 1.2em; margin: 0; }
.footer img { display: block; height: 84px; margin: 0 auto; }
.footer .menu { background-color: #373c49; margin-top: 8px; padding-top: 14px; position: static; }
.footer .menu li a { font-size: .8em; }

.footer.variation img { height: 64px; }
.footer.variation .col-md-3 img { display: inline-block; height: 60px; left: 0; position: absolute; }
.footer.variation .col-md-3 { font-size: .85em; padding-left: 100px; }
.footer.variation .col-md-3:nth-of-type(3) img { height: 40px; }
.footer.variation .col-md-3:nth-of-type(3) { padding-left: 85px; }

/* Map Specific */
#map-area { border-top: 12px solid #fff; height: 100%; overflow: hidden; position: relative; width: 100%; }
#map { height: 650px; width: 100%; }
#flash { background-color: transparent; border-radius: 50%; height: 350px; left: 50%; margin: -195px 0 0 -175px; position: absolute; top: -100%; transition: background-color .3s, height .3s, width .3s, margin .3s, top 0s ease-in-out .3s; width: 350px; }
#flash.go { background-color: rgba(125,0,0,.6); height: 250px; margin: -145px 0 0 -125px; top: 50%; transition: 0s; width: 250px; }

#form-area { background-color: rgba(0,0,0,.8); height: 100%; padding: 12px 30px; position: absolute; right: 0; top: -100%; transition: top .8s; width: 100%; }
#form-area.showing { top: 0; transition: top 1.1s; }
#form-area form { background-color: #eee; box-shadow: 2px 68px 84px 0 #000; height: 80%; margin: -66px auto 0; overflow: auto; padding: 18px 38px 24px; transition: 1.3s ease-in-out .3s; width: 60%; }
#form-area.showing form { box-shadow: 2px 18px 44px 0 #000; margin-top: 36px; }
#form-area form input[type="submit"] { background-color: #654734; float: right; font-size: 1.2em; margin-bottom: 18px; }
#form-area form input[type="submit"]:hover { background-color: #3e2719;  }
#thank-you { background-color: #fff; border: 2px solid #654734; border-radius: 8px; box-shadow: 3px 8px 24px 0 #444; padding: 6px 34px 6px 26px; position: absolute; top: -264px; transition: top .8s; left: 28px; }
#thank-you span { cursor: pointer; font-size: 1.4em; line-height: .6em; padding: 8px; position: absolute; right: 0; top: 0; }
#thank-you p { margin-top: 8px; }
#thank-you.showing { top: 138px; }

#buttons { top: 24px; height: 80px; padding: 28px; position: absolute; }
#buttons div { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: #284331; box-shadow: 0 0 11px -1px #333; color: #ebdfcc; cursor: pointer; float: left; font-size: .9em; font-weight: 700; height: 100px; letter-spacing: .07em; line-height: 1.1em; position: absolute; text-align: center; top: 0; transition: background-color .2s, top .6s ease-in-out 0s; width: 104px;  }
#buttons div:hover { background-color: #182b1e; }
#buttons div img { display: block; height: 24px; margin: 14px auto 11px; }
#buttons #view-comment-button { left: 146px; transition: background-color .2s, top .6s ease-in-out .15s; }
#buttons #cancel-add-button{ background-color: #654734; left: 28px; top: -150px; transition: background-color .2s, top .6s; }
#buttons #cancel-add-button:hover{ background-color: #3e2719; }
#buttons #cancel-form-button { background-color: #373c49; left: 146px; top: -150px; }
#buttons #cancel-form-button:hover { background-color: #242833; }
.gm-style-iw-d div { padding: 5px; width: 300px; }
.gm-style-iw-d div a { background-color: #654734; border-radius: 6px; color: #fff; display: block; font-weight: 700; margin: 0 auto; padding: 4px 0; text-align: center; width: 170px; }
.gm-style-iw-d div a:hover { background-color: #3e2719; }

#buttons.adding #add-comment-button,
#buttons.viewing #add-comment-button { top: -150px; transition: background-color .2s, top .6s ease-in-out .15s; }
#buttons.adding #view-comment-button,
#buttons.viewing #view-comment-button { top: -150px; transition: background-color .2s, top .6s ease-in-out 0s; }
#buttons.adding #cancel-add-button,
#buttons.viewing #cancel-view-button { top: -4px; transition: background-color .2s, top .8s ease-in-out .4s; }
#buttons.commenting #cancel-form-button { top: -4px; }

#crmWebToEntityForm { line-height: .7em; margin-top: 60px !important; width: 80% !important; }
#crmWebToEntityForm td { color: #373c49 !important; font-family: futura-pt-condensed,sans-serif !important; font-size: 1.2em !important; padding: 8px 1em !important; text-align: right !important; }
#crmWebToEntityForm td:nth-of-type(2) { width: 50% !important; }
#crmWebToEntityForm td strong { display: none; }
#crmWebToEntityForm tr:last-of-type td { padding-left: 31.5% !important; text-align: left !important; }
#crmWebToEntityForm a { color: #15375F; font-size: 80%; }
#crmWebToEntityForm form { margin-bottom: 2em !important; margin-top: -4.5em; }
#crmWebToEntityForm textarea { background-color: #dfd3b0; border: 0; font-family: futura-pt-condensed, sans-serif; font-size: 1.1em !important; height: 110px; letter-spacing: 0 !important; color: #15375F; line-height: 1.3em; margin: 5px 0 9px !important;  padding: 6px !important; }
#crmWebToEntityForm input { background-color: #dfd3b0; border: 0; font-family: futura-pt-condensed, sans-serif; font-size: 1.1em !important; letter-spacing: 0 !important; color: #15375F; margin: 5px 0 9px !important; padding: 4px 6px !important; }
#crmWebToEntityForm input[type=submit] { background-color: #373c49; border-radius: 4px; color: #fff !important; font-size: 1.5em !important; letter-spacing: 0 !important; color: #15375F; font-weight: 600; margin: 26px 8px 0 !important; padding: 18px 24px !important; transition: background-color .2s; }
#crmWebToEntityForm input[type=submit]:hover { background-color: #252935; }
#crmWebToEntityForm input[type=reset] { display: none; font-size: 1.5em !important; letter-spacing: 0 !important; color: #15375F; font-weight: 600; }
#crmWebToEntityForm table { background-color: transparent !important; width: 100% !important; }
#crmWebToEntityForm tbody:before { content: ''; height: 0.5em; display:block; }
#crmWebToEntityForm tbody:after { content: ''; height: 1.5em; display:block; }

#mc_embed_signup { padding: 50px 0; text-align: center; }
#mc_embed_signup h2 { border: 0; color: #373c49; }
#mc_embed_signup input[type="email"] { max-width: 80%; padding: 4px; width: 400px; }
#mc_embed_signup input[type="submit"] { background-color: #373c49; }

/*********************************************/
/****** Media Queries ************************/
/*********************************************/
/* Add more queries as needed; 992px is the column breakpoint for "medium"  columns in Bootstrap */

@media screen and (min-width: 1920px) {
    body { font-size: 24px; }
    #timeline-row > div { font-size: 22px; }
}

@media screen and (max-width: 1510px) {
    #timeline-row h2 { left: 6%; width: 36%; }
    #timeline-row h2:after { width: 23%; }
    #timeline > div span { font-size: .75em; }
    #timeline h3 { font-size: 1.8em; margin-top: 1.1%; }

    .footer.variation img { height: 52px; }
}

@media screen and (max-width: 1315px) {
    p { font-size: .9em; }
    .header { padding-top: 32px; }
    .header h1 { font-size: 1.5em; }
    .header img { margin-left: -82px; width: 164px; }
    .menu li { font-size: 1.1em; }
    #home-top-row p { font-size: 2em; }

    h2 { font-size: 4em; }
    #study-area h2 { margin: 30px 0 18px 3%; }

    #buttons.commenting #cancel-form-button { left: 28px; top: 110px; }

    #timeline p:nth-of-type(6) { top: 45.7%; width: 200px; }

    .footer a { font-size: .9em; }
    .footer.variation img { height: 46px; }
    .footer.variation .col-md-3 img { height: 48px; }
    .footer.variation .col-md-3 { font-size: .8em; padding-left: 78px; }
    .footer.variation .col-md-3:nth-of-type(3) img { height: 28px; }
    .footer.variation .col-md-3:nth-of-type(3) { padding-left: 60px; }
}

@media screen and (max-width: 1165px) {
    #get-involved div { padding: 90px 6%; }
    #get-involved p:first-of-type { font-size: 1.5em; }

    #mid-menu strong { font-size: 1.3em; }
    #mid-menu a p { line-height: 1.2em; }

    #timeline-row > div { background-position: 70% 0; background-size: 140%; }
    #timeline-row h2 { font-size: 3em; width: 29%; }
    #timeline { width: 58.5%; }

    .page-header { height: 320px; }
    #resource-row h3 { font-size: 1.6em; }

    .footer > div > div { width: 20%; }
    .footer > div > div:nth-of-type(2) { width: 30%; }
    .footer > div > div:nth-of-type(3) { width: 30%; }
    .footer > div > div:nth-of-type(4) { display: none; }
    .footer > div > div:nth-of-type(5) { width: 20%; }
    .footer.variation > div > div { width: 30%; }
    .footer.variation > div > div:nth-of-type(2) { width: 35%; }
    .footer.variation > div > div:nth-of-type(3) { width: 35%; }
    .footer.variation > div > div:nth-of-type(4) { clear: both; display: block; margin-left: 20%; margin-top: 18px; width: 30%; }
    .footer.variation > div > div:nth-of-type(5) { margin-top: 18px; width: 30%; }

    #crmWebToEntityForm { width: 100% !important; }
}
    
@media screen and (max-width: 992px) {
    .vertical-center > div { margin: 0; }
    h1 { font-size: 2.2em; margin: 20px 0 6px; }
    h2 { font-size: 1.7em; margin: 12px 0 0; }
    h3 { font-size: 1.4em; margin: 20px 0 0; }
    h4 { font-size: 1.3em; margin: 28px 0 0; }
    h5 { font-size: 1.2em; margin: 26px 0 0; }
    h6 { font-size: 1.1em; margin: 26px 0 0; }
    p, li { font-size: .9em; line-height: 1.3em; }
    .button { font-size: .8em; border-radius: 12px; padding: 4px 12px 3px; }
    table tr { font-size: .8em; padding: 2px; }

    .header { border-bottom-width: 8px; font-size: .85em; padding: 10px 12px 36px; }
    .header img { margin-left: -67px; width: 134px; }
    .menu { bottom: auto; padding: 8px 2px; top: 4px; }
    .menu li { padding: 0 16px 0 8px;  }

    #home-top-row p { font-size: 1.5em; width: 60%; }
    #home-top-row p:last-of-type { font-size: 1.1em; width: 90%; }
    #alert-banner { font-size: 1.5em; padding: 54px 3% 14px; }


    h2 { font-size: 2.4em; }
    .page-header { height: 270px; }
    .page-header.contact-page { height: 360px; }
    .page-header h2 { font-size: 3.4em; }

    #study-area h2 { margin-bottom: 4px; }
    #study-area p { font-size: .8em; line-height: 1.2em; margin-left: 3%; width: 24%; }
    #study-area p:last-of-type { line-height: 1.1em; }

    #get-involved h2 { margin-top: -5%; }
    #get-involved div { padding: 32px 6% 44px; }

    #mid-menu .col-md-3 { float: left; width: 50%; }
    #mid-menu a { border-bottom: 1px solid #fff; height: 138px; padding: 18px 6%; }
    #mid-menu strong { font-size: 1.1em;}
    #mid-menu div:nth-of-type(2) a { border-right: 0; }

    #timeline-row > div { background-position: 80% 0; background-size: 160%; }
    #timeline-row > div span { font-size: .7em; }
    #timeline-row h2 { font-size: 2em; width: 21%; }
    #timeline-row p { font-size: .8em; width: 120px; }
    #timeline p:nth-of-type(2) { top: 15%; }
    #timeline p:nth-of-type(2):before { margin-top: -8px; }
    #timeline p:nth-of-type(8) { top: 58%; }
    #timeline p:nth-of-type(8):before { margin-top: -70%; }
    #timeline { width: 68.3%; }

    #resource-row .col-md-6 { float: left; padding: 0 4% 36px; width: 50%; }
    #resource-row h3 { font-size: 1.3em; margin-top: 35px; }
    #resource-row h4 { font-size: 1.1em; }

    #map-area { border-top-width: 8px; height: 540px;  }

    .footer .menu { padding: 8px 0 2px; text-align: center; }
    .footer > div > div { float: left; width: 30%; }
    .footer > div > div:nth-of-type(2) { width: 35%; }
    .footer > div > div:nth-of-type(3) { width: 35%; }
    .footer > div > div:nth-of-type(5) { width: 100%; }
    .footer.variation > div > div { text-align: center; width: 100%; }
    .footer.variation > div > div:nth-of-type(2) { margin: 0 2% 0 4%; text-align: left; width: 44%; }
    .footer.variation > div > div:nth-of-type(3) { margin: 0 2% 0 4%; text-align: left; width: 44%; }
    .footer.variation > div > div:nth-of-type(4) { margin-left: 0; margin-top: 6px; width: 50%; }
    .footer.variation > div > div:nth-of-type(5) { margin-top: 6px; width: 50%; }
}

@media screen and (max-width: 790px) {
    #map-area { height: 400px; }
     #form-area { padding: 0; }
     #form-area form { height: 73%; margin: -66px auto 0; padding: 6px 12px; width: 84%; }
     #form-area.showing form { margin-top: 84px; }
     label { font-size: .8em; margin: 4px 0 1px; }
     input[type="text"],
     textarea { font-size: .9em; }
     #form-area form input[type="submit"] { font-size: .8em; margin: 2px 0 12px;  }
     #thank-you { left: 14px; padding: 2px 14px 5px; width: 210px; }
     #thank-you p { font-size: .85em; line-height: 1.2em; }
     #thank-you.showing { top: 74px; }
     #back-to-site-link { font-size: .9em; height: 26px; padding: 4px 8px; }
     #alert-banner { font-size: 1.2em; padding: 50px 3% 10px; }
    
    #timeline p:nth-of-type(6) { width: auto; }

     #buttons { padding: 0; top: 0; }
     #buttons div { box-shadow: 0; font-size: .8em; height: 30px; left: 0; line-height: 30px; top: 0; width: 180px; }
     #buttons div img { display: inline-block; height: 18px; margin: 0 4px 0 0; }
     #buttons #view-comment-button { left: 0; top: 30px; }
     #buttons #cancel-add-button { left: 0; width: 210px; }
     #buttons.adding #cancel-add-button { top: 0; }
     #buttons #cancel-form-button { left: 0; width: 210px; }
     #buttons.commenting #cancel-form-button { left: 0; top: 30px; }
}

@media screen and (max-width: 750px) {
    .header { text-align: center; }
    .menu { font-size: .9em; position: static; }

    #home-top-row { border-bottom-width: 8px; padding: 50px 10px 22px; }
    #home-top-row p { font-size: 1.2em; width: 78%; }
    #home-top-row p:last-of-type { font-size: .9em; line-height: 1.2em; margin-top: 20px; width: 94%; }

    h2 { font-size: 1.6em; }
    
    #study-area { background-size: 100%; }
    #study-area h2 { margin: 18px 3% 0; text-align: center; width: 94%; }
    #study-area h2:after { display: none; }
    #study-area div {float: none; width: 100%; }
    #study-area p { font-size: .8em; position: static; width: 94%; }
    #study-area p:last-of-type { left: 2%; padding-top: 12px; position: absolute; top: auto; width: 24%;  }

    #get-involved { border-width: 6px 0; }
    #get-involved p:first-of-type { font-size: 1.2em; line-height: 1em; }

    #mid-menu a { font-size: .8em; padding-top: 10px; }
    #mid-menu a p { line-height: 1.1em; }

    #timeline-row > div { background-position: 100% 0; background-size: 200%; border-width: 6px 0; height: 1200px; padding-bottom: 48px; }
    #timeline-row h2 { border: 0; margin: 0; padding: 14px 0; position: static; text-align: center; width: 100%; }
    #timeline-row h2:after { display: none; }
    #timeline { border-left: 0; border-top: 2px dashed #dfd3b0; margin-bottom: 100px; position: relative; width: 100%; }
    #timeline h3 { font-size: 1.2em; }

    .page-header.contact-page { height: 280px; padding-top: 52px; }
    .page-header.contact-page h2 { font-size: 2em; }
    .page-header.contact-page h3 { font-size: 1.1em; }
    .page-header.contact-page p { font-size: .9em; }

    .footer h3 { font-size: 1.1em; }
    .footer > div > div { float: left; font-size: .85em; text-align: center; width: 100%; }
    .footer > div > div:nth-of-type(2) { padding: 12px 0 18px; width: 50%; }
    .footer > div > div:nth-of-type(3) { padding: 12px 0 18px; width: 50%; }
    .footer img { height: 60px; }
}

@media screen and (max-width: 486px) {
    #study-area p:last-of-type { margin-top: 0; width: 90%; }
    #study-area div { overflow: auto; }
    #study-area div img { width: 600px; }

    #get-involved { background-size: 200% 100%; }
    #get-involved h2 { border: 0; padding: 34px 0 10px; position: static; text-align: center; width: 100%;  }
    #get-involved div { border-right: 0; border-top: 2px dashed #dfd3b0; padding: 14px 8% 24px; width: 100%; }
    #get-involved p { font-size: .8em; }
    #get-involved p:first-of-type { font-size: 1.1em; line-height: 1em; }

    #mid-menu a { height: 160px; }

    #timeline { margin: 0; padding-top: 18px; }
    #timeline > div { display: none; }
    #timeline-row > div { height: auto; padding: 32px 8%; }
    #timeline h3 { margin-right: 58px; margin-top: 3%; position: static; }
    #timeline h3:before,
    #timeline h3:after { display: none; }
    #timeline .ada-element { font-size: 1em; margin-left: 12px; position: static; }
    #timeline p { margin: 8px 0 !important; position: static; text-align: left !important; width: auto !important; }
    #timeline p:before,
    #timeline p:after { display: none; }
    
    .page-header { height: 200px; }
    .page-header h2 { font-size: 2.3em; }

    #resource-row .col-md-6 { width: 100%; }

    .footer.variation > div > div:nth-of-type(2) { margin: 0 2% 0 14%; text-align: left; width: 84%; }
    .footer.variation > div > div:nth-of-type(3) { margin: 0 2% 0 18%; text-align: left; width: 80%; }
    .footer.variation > div > div:nth-of-type(4) { margin-left: 0; margin-top: 6px; width: 100%; }
    .footer.variation > div > div:nth-of-type(5) { margin-top: 6px; width: 100%; }

    #crmWebToEntityForm { margin: 60px auto 0 !important; width: 90% !important; }
    #crmWebToEntityForm td:nth-of-type(1) { display: block; padding: 0 !important; text-align: center !important; width: 100% !important; }
    #crmWebToEntityForm td:nth-of-type(2) { display: block; width: 100% !important; }
    #crmWebToEntityForm td:nth-of-type(3) { display: none; }
    #crmWebToEntityForm tr:last-of-type td { padding: 0 !important; text-align: center !important; }
}