/* ----------- 4K Resolution Media Queries ----------- */

@media all and (min-height:901px) {
  .hero:not(.hero .thanks) {
    height: 650px;	/* Sets a static height for the hero */
  }
}

/* ----------- < 1440px Media Queries ----------- */

@media all and (max-width:1439px) {
  header {
    padding: 0 20px;	/* Brings the nav elements closer to the edges of the viewport */
  }
  /* Safe area insets for the header when rendered on an iPhone X, XS, XR or XS Max */
  /* in landscape orientation */
  @supports(padding:max(0px)) {
    header {
      padding-left: max(20px, env(safe-area-inset-left));
      padding-right: max(20px, env(safe-area-inset-right));
    }
  }
}

/* ----------- < 1240px Media Queries by Section ----------- */

/* Font Size */
@media all and (max-width:1239px) {
  h1 {
    font-size: 1.953em;
  }
  h2 {
    font-size: 1.563em;
  }
  h3, h4, blockquote, .lead, .label {
    font-size: 1.25em;
  }
  p {
    font-size: 1em;
  }
  .fine-print {
    font-size: 0.8em;
  }
}

/* Header */
@media all and (max-width:1239px) {
  nav {
    height: 90px;
  }
  .logo-module {
    height: 50px;
  }
  a {
    font-size: 16px;
  }
  a .logo-large {
    display: none;	/* Hides the large banner logo */
    									/* for viewports less than 1240px wide */
  }
  .button-round {
    padding: 14.5px 30px;
    border: 2px solid #0d2e21;
    border-radius: 25px;
  }
  .icon {
    height: 16px;
  }
}
@media all and (min-width:1240px) {
  a .logo-small {
    display: none;	/* Hides the small banner logo */
    									/* for viewports wider than 1239px */
  }
}

/* Hero */
@media all and (max-width:1239px) {
  .hero, .hero .thanks {
    height: auto;
    background-image: none; /* Hides the hero background image */
    													/* for viewports less than 1240px wide */
  }
  .hero-content {
    height: auto;
    padding: 90px 0;
    
    flex-direction: column; /* Displays items in columns vertically */
  }
  .hero-text {
    width: 382px;
    color: #0d2e21;
    margin: 0 0 60px 0;
    
    text-shadow: none;	/* Hides the hero text's text shadow */
    										/* for viewports less than 1240px wide */
  }
  .thanks .hero-text {
    width: 382px;
  }
  .hero-text p {
    color: #666;
  }
  .form-table {
    width: 420px; /* This allows for Formsite's wacky padding */
  }
}
@media all and (min-width:1240px) {
  .hero-image {
    display: none;	/* Hides the hero image */
    									/* for viewports wider than 1239px */
  }
}

/* What and Why Sections */
@media all and (max-width:1239px) {
  section:not(.hero) {
    padding: 90px 0;
  }
  .headline-text, .section-content {
    flex-direction: column;	/* Displays items in columns vertically */
  }
  .headline-text {
    margin-bottom: 40px;
  }
  .headline-text h2, .text-block {
    width: 382px;
  }
  .text-block {
    margin: 0 0 60px 0;
  }
  .image-block.right {
    margin: 0 0 0 26.34px;
  }
  .image-block.left {
    margin: 0 26.34px 0 0;
  }
  section:not(.hero) img {
    width: 355.66px;
  }
  .square-1 {
    top: 100%;
  }
  .square-2 {
    top: 0;
  }
  .square-3 {
    top: 50%;
  }
  .square-1, .square-2, .square-3 {
    height: 289.8px;
    width: 289.8px;
  }
  .square-1 {
    border: 13.17px solid #0d2e21;

    transform: translate(-26.34px, -382px);
  }
  .square-2 {
    border: 13.17px solid #4b6e61;

    transform: translate(92.2px, -26.34px);
  }
  .square-3 {
    border: 13.17px solid #a3b1aa;

    transform: translate(-26.34px, 139.06px);
  }
  .bg-secondary .section-content:not(:last-child) {
    margin-bottom: 90px;
  }
  .bg-secondary .section-content:nth-child(odd) .text-column, .image-block.left img {
    margin: 0 0 60px 0;
  }
}

/* Testimonials Section */
@media all and (max-width:1239px) {
  .testimonial {
    padding: 40px 20px;
    margin: 0 0 60px 0;
  }
  .testimonial:last-child {
    margin: 0;
  }
  .avatar {
    flex-direction: column;	/* Displays items in columns vertically */
  }
  .avatar img {
    margin: 0 0 30px 0;
  }
  .label-text, blockquote {
    width: 342px;
    text-align: center;
  }
  blockquote {
    margin-top: 40px;
  }
}

/* CTA Section */
@media all and (max-width:1239px) {
  .bg-primary h1 {
    width: 382px;
    margin: 0 0 50px 0;
  }
  .button-square {
    width: 382px;
    padding: 20px 0;
    margin: 0;

    border: 2px solid #fff;
  }
}

/* ----------- Mobile Media Queries by Section ----------- */

/* Header */
@media all and (max-width:500px) {
  a .logo-small, a .logo-large {
    display: none;	/* Hides the banner logos */
    									/* for viewports less than 501 px wide */
  }
}
@media all and (min-width:501px) {
  a .logo-icon {
    display: none;	/* Hides the logo icon */
    									/* for viewports wider than 500px */
  }
}

/* Hero */
@media all and (max-width:500px) {
  .hero-text, .thanks .hero-text {
    width: calc(100vw - 40px);
  }
  .form-table {
    width: calc(100vw - 2px);
    margin: 0;
  }
}

/* What and Why Sections */
@media all and (max-width:500px) {
  .headline-text h2, .text-block {
    width: calc(100vw - 40px);
  }
  .image-block.right {
    margin: 0 0 0 6.16vw;
  }
  .image-block.left {
    margin: 0 6.16vw 0 0;
  }
  section:not(.hero) img {
   width: 83.17333333333333vw;
	}
  .square-1, .square-2, .square-3 {
    height: 67.77066666666667vw;
    width: 67.77066666666667vw;
  }
  .square-3 {
    top: 100%;
  }
  .square-1 {
    border: 3.08vw solid #0d2e21;

    transform: translate(-6.16vw, -89.33333333333333vw);
  }
  .square-2 {
    border: 3.08vw solid #4b6e61;

    transform: translate(21.562666666666665vw, -6.16vw);
  }
  .square-3 {
    border: 3.08vw solid #a3b1aa;

    transform: translate(-6.16vw, -89.33333333333333vw);
  }
}

/* Testimonials Section */
@media all and (max-width:500px) {
  .testimonial {
    margin: 0 0 60px 0;
  }
  .testimonial:last-child {
    margin: 0;
  }
  .label-text, blockquote {
    width: calc(100vw - 80px);
  }
}

/* CTA Section */
@media all and (max-width:500px) {
  .bg-primary h1 {
    width: calc(100vw - 40px);
    margin: 0 0 50px 0;
  }
  .button-square {
    width: calc(100vw - 40px);
  }
}