/* GENERAL */
body, html {font-family: 'Roboto', sans-serif;  margin: 0px; height: 100%; overflow-x: hidden; padding: 0px;  }
html { width: 100%; height: 100%; padding: 0px; margin: 0px; }
.sr-only {  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;}


/* TYPE */
h1 { color: #002437; font-weight: 700; text-align: center; text-transform: uppercase; padding-bottom: 0; margin-bottom: 0; font-size: 62px;}
.hr {border-bottom: 15px solid #7ac143; margin: 0 auto; width: 57%; margin-top: -8px; padding-top: 0;}
.connected .hr {border-bottom: 12px solid #7ac143; margin: 0 auto; width: 28%; margin-top: -8px; padding-top: 0;}
h2 { color: #363636; font-weight: 100; text-align: center; text-transform: uppercase;  margin-bottom: 50px; font-size: 40px; margin-top: 0; letter-spacing: 8px;}
p { color: #363636; font-weight: 300; text-align: center;}
h3 {text-align: center; font-weight: 700;}
.connected h3 {font-weight: 300; font-size: 20px; text-align: left; margin-bottom: 0; padding-bottom: 0;font-weight: bolder; }
.greenline {border-bottom: solid 2px #439539; width: 90%; margin-bottom: 15px;}
a {text-decoration: none;}
a:hover {text-decoration: none;}

/* HEADER */
.header {width: 100%;}
.header img {width: 202px; display: block; padding: 15px;}
.grayline {border-bottom: solid 2px #e7e7e7; padding-top: 15px; margin-bottom: 25px;}

.comment-button {background-color: #7ac143; padding: 20px; margin-top: 43px; float: right; margin-right: 25px;}
.comment-button a {color: white; text-align: center;}
.comment-button:hover {background-color: #439539; transition: all 0.5s;}

.green-button {background-color: #7ac143; padding: 20px; width: 40%; text-align: center; margin: 0 auto 25px;}
a .green-button  {color: white; text-align: center;}
.green-button:hover {background-color: #439539; transition: all 0.5s;}

.content {width: 75%; margin: 30px auto; min-height: 100%;}

/* MAP */
#map { overflow: hidden; padding-top: 56.25%; position: relative; margin-bottom: 100px;}
#map iframe { border: 0; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }



.connected p {text-align: left;}
.legend {display: block; text-align: center; margin: 0 auto 50px;}
.legend div {display: inline-block; }
.dash1 { border: 5px solid #000; width: 25px; height: 0px; margin-right: 10px;}
.dash2 { border: 5px solid #e0d46a; width: 20px; height: 0px; margin-right: 10px;}
.legend p {text-align:left; vertical-align: top; display: inline-block; margin-right: 10px;}
.legend svg {vertical-align: middle; margin-right: 10px;}

img.legendsub { vertical-align: text-bottom; margin-right: 10px;}

/* FOOTER */

#footer { right: 0; bottom: 0; left: 0; font-weight: 300; padding: 0; display: block; width: 100%; }
.footer-top { padding: 1.4rem 0; background-color: #439539; color: #fff; text-align: center;}
.footer-top .footer-logo {margin: 0; border-right: 1px solid #fff; border-bottom: 0; padding: .2rem 2rem 1rem 0; vertical-align: middle; display: inline-block;}
.footer-top a {padding: 0.3rem; vertical-align: middle; font-size: 1.36rem; }
.footer-top img {width: 100px; height: auto;}

.footer-social { min-width: 50px; margin: 0; vertical-align: middle; border-bottom: 0; padding: 1rem 2rem 1rem 0; display: inline-block; text-align: center; }
.social-linkgroup { width: 100%;}
.social-linkgroup ul li { display: inline-block!important; margin: 0; padding: 0; list-style: none;}
.social-icon {padding: 0 10px;}
.social-icon .fab {color: white;}
.social-icon .fas {color: white; }
ul.footer-items {margin: 0; padding: 0;}

.footer-bottom {background-color: #7ac143; padding: 5px 0;}
.footer-bottom p { color: #fff; font-size: 12px; text-align: center; margin-bottom: 0;}


/* ZOHO COMMENT FORM */
.zcwf_title {display: none;}
.zcwf_lblTopBottom .crmWebToEntityForm {margin-top: 0; padding: 0!important; width: 100%!important; max-width:100%!important;}

#crmWebToEntityForm {margin-top: 0; padding: 0!important; width: 100%!important; max-width:100%!important;}

.zcwf_row .zcwf_col_lab label {font-family: 'Roboto', sans-serif!important; font-size: 15px!important; color: #363636!important; font-weight: 400!important; padding-bottom: 0!important;}

.zcwf_lblTopBottom .zcwf_col_fld input[type=text], .zcwf_lblTopBottom .zcwf_col_fld textarea { margin-top: 10px; border-left: 4px #7ac143 solid!important; border-right:none; border-top: none; border-bottom: none; background-color: #e7e7e7; height: 34px; margin-top: 0; padding-top:0; }


/* #crmWebToEntityForm {margin-top: -80px!important; margin-bottom: 50px!important; width: 95%!important; margin-right: 0!important; margin-left: 0!important; font-family: 'Roboto', sans-serif!important;} */
#crmWebToEntityForm table tbody tr td strong {display: none;}
#crmWebToEntityForm table {border: none; width: 95%!important;}
#crmWebToEntityForm td {background-color: white; width: 95%!important;}
#crmWebToEntityForm td {border-bottom: 2px solid #77ada4;}
#crmWebToEntityForm tr td {padding: 5px; }
#crmWebToEntityForm tr td:nth-of-type(2) {display: none; }
#crmWebToEntityForm td span {font-family: 'Roboto', sans-serif!important; font-size: 15px!important; color: #363636!important; font-weight: 300!important; }

.wrapper { width: 75%; margin: 0 auto; }
.wrapper h1 { font-size: 48px; font-family: 'Roboto', sans-serif; margin-bottom: 10px;}
.input { margin-top: 10px; border-left: 4px #7ac143 solid; border-right:none; border-top: none; border-bottom: none; background-color: #e7e7e7; height: 34px;}

textarea { margin-top: 10px; border-left: 4px #7ac143 solid; border-right:none; border-top: none; border-bottom: none; background-color: #e7e7e7; height: 80px;}


label[for="email"],
label[for="first"],
label[for="last"],
label[for="phone"],
label[for="city"],
label[for="state"],
label[for="zip"],
label[for="comment"]{ padding-bottom: 6px; border-bottom: 2.5px solid #747474; width: 100%;}
#crmWebToEntityForm input[type="reset"] { display: none; }
.zcwf_col_fld input[type="submit"] { font-size: 1.2em !important; padding: 8px 16px; color: #000; background-color:  #7ac143;}
#crmWebToEntityForm input[type="submit"]:hover { background-color: white; color: #fca70d; border-left: 4px #439539 solid; transition-duration: 0.3s;}

.thankyou p {margin-top: 50px;}

h1 { margin-top: 40px;  }
.container { width: 1170px; }
#footer { margin-top: 36px; }
#crmWebToEntityForm.zcwf_lblTopBottom .zcwf_col_fld input[type=text], 
#crmWebToEntityForm.zcwf_lblTopBottom .zcwf_col_fld textarea { border-left:4px solid #7ac143 !important; }

@media screen and (max-width: 1229px) {
    /* .thankyou {height: 286px;} */

}
@media screen and (max-width: 992px) {
    .header .row > .col-sm-12 {width: 50%;}
    .comment-button {margin-right: 15px;}
}

@media screen and (max-width: 767px) {
    .header .row > .col-sm-12 {width: 100%;}
    .header img {width: 250px; margin: 0 auto;}
    .comment-button {width: 45%; margin: 0 auto; text-align: center; float: none; padding: 10px;}
    /* .thankyou {height: 526px;} */

}


@media screen and (max-width: 640px) {
    .header img {width: 150px; margin: 0 auto;}
    .content {min-height: 100%; width: 95%;}
    #map { margin-bottom: 20px; height: 550px; width: 100%;}
    .comment-button {width: 75%; margin: 0 auto; text-align: center; float: none; padding: 10px;}
    h2 {margin-bottom: 25px;}
    /* .thankyou {height: 346px;} */

}

@media screen and (max-width: 418px) {
    /* .thankyou {height: 346px;} */
}

@media screen and (max-width: 376px) {
li.footer-logo {display:none!important;}
.connected .hr {width: 75%;}
/* .thankyou {height: 367px;} */

}