/* home page overlap */
.erx-main-wrapper.after_login .erx-body-container #erx-content .grid-stack .grid-stack-item:first-of-type {
  width: 100vw;
  position: absolute;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  overflow: visible;
  margin-bottom: -40px;
}

.erx-main-wrapper.after_login .grid-stack-item-content {
  left: 0 !important;
  right: 0 !important;
}

.img-overlay-wrap-home {
  position: relative;
  display: inline-block; /* <= shrinks container to image size */
  width: 100%;
  max-width: 100%;
}
@media screen and (min-width: 1612px) {
  .img-overlay-wrap-home {
    width: 100%;
    max-width: 100%;
  }
}

.img-overlay-wrap-home img { /* <= optional, for responsiveness */
   display: block;
   width: 100%;
   max-width: 100%;
   height: auto;
}
@media screen and (min-width: 1612px) {
  .img-overlay-wrap-home img {
    width: 120%;
    max-width: 120%;
  }
}

.img-overlay-wrap-home svg {
  position: absolute;
  bottom:0;
  left: 0;
}

.img-overlay-wrap-home p  {
  position:absolute;
  right:3.7rem;
  bottom:25%;
  font: 20px "Zilla Slab", serif;
  color:white;
}
@media screen and (min-width: 40em) {
  .img-overlay-wrap-home p {
    font: 24px "Zilla Slab", serif;
  }
}
@media screen and (min-width: 64em) {
  .img-overlay-wrap-home p {
    font: 32px "Zilla Slab", serif;
  }
}

.img-overlay-wrap-home h1 {
  position: absolute;
  left: 5px;
  right: 0;
  bottom: 0;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  max-width: 117rem;
}
@media screen and (min-width: 40em) {
  .img-overlay-wrap-home h1 {
    padding-left: 3.7rem;
    padding-right: 3.7rem;
  }
}
@media screen and (min-width: 64em) {
  .img-overlay-wrap-home h1 {
    bottom: 3.7rem;
  }
}
@media screen and (min-width: 1243px) {
  .img-overlay-wrap-home h1 {
    padding-left: 0;
    padding-right: 0;
  }
}

p.right-text  {
  position:absolute;
  top: 60px;
  left: 2rem;
  right: 2rem;
  font: 18px "Zilla Slab", serif;
  color:white;
  display: none;
  
}
p.right-text br {
  display: none;
}

@media screen and (min-width: 564px) {
  p.right-text  {
    right:2rem;
    top: -5px;
    left: unset;
    width: 51%;
    max-width: 275px;
    float: right !important;
    display: block;
  }
}

@media screen and (min-width: 40em) {
  p.right-text {
    font-size: 24px;
    top: -13px;
    width: 56%;
    max-width: 375px;
  }
}
@media screen and (min-width: 64em) {
  p.right-text {
    font-size: 32px;
    top: 18px;
    width: 50%;
    max-width: 495px;
  }

  .site-header {
    min-height: 173px;
  }
}




/*Shadow for H1 over image*/
h1.shadow {
  text-shadow: 0 0.2rem 0.4rem rgb(0 0 0 / 50%);
}



/*  ----  Alerts  ----  */
.alert-background {
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  color: #ffffff;
  background: #567B8A;
  padding: 20px;
  line-height: 1.3;
}

.alert-subtext {
  font: 18px 'Zilla Slab', serif;
  padding-bottom: 15px;
  display: block;
}

.alert-background .btn--light {
    border: 0.2rem solid #ffffff;
    color: #ffffff;
    letter-spacing: 0.5px;
    background: none;
    line-height: 1.5;
    text-transform: uppercase;
    transition: background 0.2s ease-out;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 1.6rem;
    width: 148px;
    padding: 1rem;
}

.alert-background div:nth-of-type(3) {
  margin-left: 70px;
}

.alert-background .medium-2 {
     max-width: 70px;
}

i.fas.fa-envelope,
i.fas.fa-exclamation,
i.fas.fa-info,
i.fas.fa-user-clock,
i.fas.fa-globe {
  border-radius: 50px;
  background: #ffffff;
  width: 50px;
  height: 50px;
  font-size: 29px;
  text-align: center;
  color: #577B8A;
  padding: 11px;
  margin: 0 20px 0 0;
}

i.fas.fa-user-clock {
  font-size: 25px;
}

i.fab.fa-instagram, 
i.fab.fa-linkedin-in {
    border-radius: 50px;
    background: #597C31;
    width: 80px;
    height: 80px;
    font-size: 45px;
    text-align: center;
    color: #ffffff;
    padding: 18px;
    margin: 0 20px 10px 0;
}

@media screen and (min-width: 40em) {
   .alert-background {
     justify-content: space-around;
   }
  .alert-subtext {
    padding-bottom: 0;
  }
  .alert-background div:nth-of-type(3) {
    margin-left: 0;
  }
  .alert-background .btn--light {
    float: right;
  }
  i.fas.fa-envelope,
  i.fas.fa-exclamation,
  i.fas.fa-info,
  i.fas.fa-user-clock {
    padding-bottom: 0;
    margin-bottom: 0;
  }
}

@media screen and (min-width: 750px) and (max-width: 1023px) {
  .alert-background .medium-6 {
    width: 55% !important;
  }
}

@media screen and (min-width: 64em) {
  .alert-background div:nth-of-type(3) {
    margin-left: 0;
  }
}


/*SVG code for above image*/
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1240" height="154" viewBox="0 0 1240 154">
  <defs>
    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
      <stop offset="0" stop-opacity="0"/>
      <stop offset="0.5" stop-opacity="0.506"/>
      <stop offset="1" stop-opacity="0.796"/>
    </linearGradient>
  </defs>
  <rect id="Rectangle_392" data-name="Rectangle 392" width="1240" height="154" fill="url(#linear-gradient)"/>
</svg>


/* + Grad Hero */
.grad--hero {
  position: relative;
  background-color: #ffffff;
  width: 100%;
}
@media screen and (min-width: 40em) {
  .grad--hero {
    background-color: #006644;
  }
}

.grad--hero__image {
  position: relative;
  z-index: 1;
  max-height: 750px;
  overflow: hidden;
}
.grad--hero__image img {
  vertical-align: middle;
  position: relative;
  z-index: 1;
  width: 100%;
  max-height: 750px;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (min-width: 40em) {
  .grad--hero__image:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(26, 26, 26, 0.8)), color-stop(50%, rgba(26, 26, 26, 0)), to(rgba(26, 26, 26, 0)));
    background-image: linear-gradient(to top right, rgba(26, 26, 26, 0.8), rgba(26, 26, 26, 0) 50%, rgba(26, 26, 26, 0));
  }
  .section__header .grad--hero__image:before {
    background-image: none;
  }
}
@media (max-height: 800px) {
  .grad--hero__image {
    max-height: 70vh;
  }
}

@media screen and (min-width: 40em) {
  .grad--hero__image {
    margin-bottom: 0;
  }
}
/*
.grad--hero__image:before {
  content: "";
  display: block;
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: linear-gradient(to top right, rgba(26, 26, 26, 0.8), rgba(26, 26, 26, 0) 50%, rgba(26, 26, 26, 0));

  @at-root .section__header & {
    background-image: none;
  }
}

.grad--hero__image img {
  vertical-align: middle;
  position: relative;
  z-index: 1;
  width: 100%;
  max-height: 750px;
  object-fit: cover;
  margin-bottom: 1rem;
}

@media (max-height: 800px) {
  .grad--hero__image {
    max-height: 70vh;
  }
}
*/
.grad--hero__text {
  color: #006644;
  margin-top: 2rem;
}
.grad--hero__text a:link {
  color: #006644;
  text-decoration: underline;
}
.grad--hero__text h1, .grad--hero__text h2, .grad--hero__text h3, .grad--hero__text h4, .grad--hero__text h5, .grad--hero__text h6 {
  color: #006644;
}
@media screen and (min-width: 40em) {
  .grad--hero__text {
    bottom: 0;
    color: #ffffff;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 3;
  }
  .grad--hero__text a:link {
    color: #ffffff;
    text-decoration: underline;
  }
  .grad--hero__text .padded-row {
    padding-bottom: 3.75rem;
  }
  .grad--hero__text h1, .grad--hero__text h2, .grad--hero__text h3, .grad--hero__text h4, .grad--hero__text h5, .grad--hero__text h6 {
    color: #ffffff;
    margin: 0;
    text-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.5);
  }
}
@media screen and (min-width: 64em) {
  .grad--hero__text .padded-row {
    padding-bottom: 7rem;
  }
}

.alert-background {
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  color: #ffffff;
  background: #567B8A;
  padding: 20px;
}

.alert-subtext {
  font: 18px 'Zilla Slab', serif;
}

i.fas.fa-envelope,
i.fas.fa-exclamation,
i.fas.fa-info,
i.fas.fa-user-clock {
  border-radius: 50px;
  background: #ffffff;
  width: 50px;
  height: 50px;
  font-size: 29px;
  text-align: center;
  color: #577B8A;
  padding: 11px;
  margin: 0 20px 10px 0;
}

i.fas.fa-user-clock {
  font-size: 25px;
}

i.fab.fa-instagram, 
i.fab.fa-linkedin-in {
    border-radius: 50px;
    background: #597C31;
    width: 80px;
    height: 80px;
    font-size: 45px;
    text-align: center;
    color: #ffffff;
    padding: 18px;
    margin: 0 20px 10px 0;
}


/*button in alert*/
.alert-background .btn--light { 
    border: 0.2rem solid #ffffff;
    color: #ffffff;
    letter-spacing: 0.5px;
    background: none;
    line-height: 1.5;
    text-transform: uppercase;
    transition: background 0.2s ease-out;
    font-family: "Oswald", sans-serif;
    font-weight: 400;
    font-size: 1.6rem;
}



/*SVG code for above image*/
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1240" height="154" viewBox="0 0 1240 154">
  <defs>
    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
      <stop offset="0" stop-opacity="0"/>
      <stop offset="0.5" stop-opacity="0.506"/>
      <stop offset="1" stop-opacity="0.796"/>
    </linearGradient>
  </defs>
  <rect id="Rectangle_392" data-name="Rectangle 392" width="1240" height="154" fill="url(#linear-gradient)"/>
</svg>


/* + Grad Hero */
.grad--hero {
  position: relative;
  background-color: #ffffff;
  width: 100%;
}
@media screen and (min-width: 40em) {
  .grad--hero {
    background-color: #006644;
  }
}

.grad--hero__image {
  position: relative;
  z-index: 1;
  max-height: 750px;
  overflow: hidden;
}
.grad--hero__image img {
  vertical-align: middle;
  position: relative;
  z-index: 1;
  width: 100%;
  max-height: 750px;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (min-width: 40em) {
  .grad--hero__image:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: -webkit-gradient(linear, left bottom, right top, from(rgba(26, 26, 26, 0.8)), color-stop(50%, rgba(26, 26, 26, 0)), to(rgba(26, 26, 26, 0)));
    background-image: linear-gradient(to top right, rgba(26, 26, 26, 0.8), rgba(26, 26, 26, 0) 50%, rgba(26, 26, 26, 0));
  }
  .section__header .grad--hero__image:before {
    background-image: none;
  }
}
@media (max-height: 800px) {
  .grad--hero__image {
    max-height: 70vh;
  }
}

@media screen and (min-width: 40em) {
  .grad--hero__image {
    margin-bottom: 0;
  }
}
/*
.grad--hero__image:before {
  content: "";
  display: block;
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: linear-gradient(to top right, rgba(26, 26, 26, 0.8), rgba(26, 26, 26, 0) 50%, rgba(26, 26, 26, 0));

  @at-root .section__header & {
    background-image: none;
  }
}

.grad--hero__image img {
  vertical-align: middle;
  position: relative;
  z-index: 1;
  width: 100%;
  max-height: 750px;
  object-fit: cover;
  margin-bottom: 1rem;
}

@media (max-height: 800px) {
  .grad--hero__image {
    max-height: 70vh;
  }
}
*/
.grad--hero__text {
  color: #006644;
  margin-top: 2rem;
}
.grad--hero__text a:link {
  color: #006644;
  text-decoration: underline;
}
.grad--hero__text h1, .grad--hero__text h2, .grad--hero__text h3, .grad--hero__text h4, .grad--hero__text h5, .grad--hero__text h6 {
  color: #006644;
}
@media screen and (min-width: 40em) {
  .grad--hero__text {
    bottom: 0;
    color: #ffffff;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 3;
  }
  .grad--hero__text a:link {
    color: #ffffff;
    text-decoration: underline;
  }
  .grad--hero__text .padded-row {
    padding-bottom: 3.75rem;
  }
  .grad--hero__text h1, .grad--hero__text h2, .grad--hero__text h3, .grad--hero__text h4, .grad--hero__text h5, .grad--hero__text h6 {
    color: #ffffff;
    margin: 0;
    text-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.5);
  }
}
@media screen and (min-width: 64em) {
  .grad--hero__text .padded-row {
    padding-bottom: 7rem;
  }
}

iframe#widget2 {
  width: 100% !important;
  max-width: 620px;
}
