html {
  scroll-behavior: smooth; }

body {
  margin: 0;
  padding: 0;
  font-family: 'Quicksand', sans-serif;
  position: relative; }
  body::before, body::after {
    content: '';
    display: block;
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100vh;
    background: url("images/background.png") top no-repeat;
    background-size: 100%;
    opacity: .6; }
  body::before {
    top: 0;
    transform: scaleX(-1); }
  body::after {
    bottom: 0;
    transform: rotateZ(180deg); }

input {
  font-family: 'Quicksand', sans-serif; }

header {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  max-width: 1360px;
  margin: 0 auto;
  padding: 29px 15px;
  box-sizing: border-box;
  font-size: 18px;
  font-weight: 500; }
  @media (min-width: 1024px) {
    header {
      flex-direction: row; } }
  header img {
    width: 192px; }
  header a {
    margin: 20px 0;
    color: #000000;
    text-decoration: none; }
    header a:hover {
      text-decoration: underline; }

.feature {
  display: flex;
  flex-direction: column;
  margin: 78px auto; }
  @media (min-width: 1024px) {
    .feature {
      flex-direction: row;
      align-items: flex-start;
      width: 83.3333333333%;
      max-width: 1133.3333333333px; } }
  .feature:nth-child(2) {
    margin-top: 0; }
    @media (min-width: 1024px) {
      .feature:nth-child(2) {
        margin-top: 78px; } }
  .feature:nth-last-child(2) {
    margin-bottom: 0; }
    @media (min-width: 1024px) {
      .feature:nth-last-child(2) {
        margin-bottom: 78px; } }
  .feature strong, .feature h1, .feature h2 {
    margin: 0;
    padding: 0;
    font-size: 36px;
    font-weight: 500;
    line-height: 42px;
    text-transform: uppercase; }
    @media (min-width: 1024px) {
      .feature strong, .feature h1, .feature h2 {
        font-size: 42px;
        line-height: 46px; } }
    .feature strong span, .feature h1 span, .feature h2 span {
      color: #73A7C1; }
  @media (min-width: 1024px) {
    .feature h1 {
      font-size: 48px; } }
  .feature p {
    margin: 20px 0;
    padding: 0;
    font-size: 20px;
    line-height: 32px; }
  .feature .button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 14px 25px;
    color: #000000;
    font-size: 17px;
    font-weight: bold;
    text-transform: capitalize;
    text-decoration: none;
    background-color: #ADBC4F;
    border-radius: 50px;
    box-shadow: 0px 15px 30px rgba(0, 0, 0, 0.15); }
    .feature .button::after {
      content: '';
      display: inline-block;
      width: 28px;
      height: 28px;
      margin-left: 8px;
      background: url("images/mdi_arrow_downward.svg") center no-repeat;
      background-size: 100%; }
    @media (min-width: 1024px) {
      .feature .button {
        font-size: 20px; } }
  .feature table {
    width: 100%;
    margin: 0;
    padding: 20px 0;
    font-size: 15px; }
    @media (min-width: 375px) {
      .feature table {
        font-size: 17px; } }
    @media (min-width: 1024px) {
      .feature table {
        font-size: 22px; } }
    .feature table tr {
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 48px;
      border-bottom: #C4C4C4 solid 1px; }
      .feature table tr:last-child {
        border: none; }
      .feature table tr td:last-child {
        text-align: right; }
  .feature .content {
    padding: 0 15px;
    box-sizing: border-box; }
    @media (min-width: 1024px) {
      .feature .content {
        width: 50%; }
        .feature .content .button {
          margin-top: 34px; } }
  .feature .image {
    position: relative;
    padding: 0 15px;
    box-sizing: border-box;
    margin-bottom: 40px; }
    @media (min-width: 1024px) {
      .feature .image {
        order: 1;
        width: 50%;
        margin-bottom: 0; } }
    .feature .image img {
      display: block;
      width: 90%;
      margin-left: auto; }
      @media (min-width: 1024px) {
        .feature .image img {
          width: 80%; } }
      .feature .image img:last-child {
        margin-bottom: 75px; }
    .feature .image .tagline {
      display: flex;
      align-items: center;
      width: 235px;
      margin: 20px auto;
      font-size: 21px;
      text-transform: uppercase; }
      .feature .image .tagline span {
        color: #73A7C1;
        font-size: 98px;
        line-height: 78px; }
      @media (min-width: 1024px) {
        .feature .image .tagline {
          width: 265px;
          font-size: 25px; }
          .feature .image .tagline span {
            color: #73A7C1;
            font-size: 120px;
            line-height: 93px; } }
    .feature .image::after {
      content: '';
      display: block;
      position: absolute;
      z-index: -1;
      background: #C4C4C4;
      background: radial-gradient(#C4C4C4 20%, transparent 20%) 0 0 repeat;
      background-size: 3px 3px;
      left: 15px;
      bottom: 0;
      width: calc(90% - 30px);
      height: 240px; }
      @media (min-width: 1024px) {
        .feature .image::after {
          width: calc(80% - 30px); } }
  .feature.alt .image {
    order: 0; }
    .feature.alt .image img {
      margin-left: 0;
      margin-right: auto; }
    .feature.alt .image::after {
      left: auto;
      right: 15px; }
  .feature.full {
    display: block;
    padding: 0 15px;
    box-sizing: border-box; }

.callout {
  position: relative;
  padding: 30px 0;
  color: #F8F6E0;
  font-size: 36px;
  font-weight: 500;
  line-height: 48px;
  overflow: hidden; }
  @media (min-width: 1024px) {
    .callout {
      line-height: 52px; } }
  .callout::before, .callout::after {
    content: '';
    display: block;
    position: absolute;
    z-index: -1;
    background: #C4C4C4;
    background: radial-gradient(#C4C4C4 20%, transparent 20%) 0 0 repeat;
    background-size: 3px 3px;
    width: 100%;
    height: calc(6vw + 60px);
    clip-path: polygon(0 0, 100% 6vw, 100% 100%, 0 calc(100% - 6vw)); }
  .callout::before {
    top: 0; }
  .callout::after {
    bottom: 0; }
  @media (min-width: 1024px) {
    .callout {
      padding: 50px 0; }
      .callout::before {
        left: calc(50% * 5 / 6 - 50%); }
      .callout::after {
        right: calc(50% * 5 / 6 - 50%); } }
  @media (min-width: 1360px) {
    .callout::before {
      left: calc(1360px * 5 / 12 - 50%); }
    .callout::after {
      right: calc(1360px * 5 / 12 - 50%); } }
  .callout .inner {
    background-color: #36A693;
    clip-path: polygon(0 0, 100% 6vw, 100% 100%, 0 calc(100% - 6vw)); }
  .callout span {
    color: #F4CF70;
    font-weight: 700; }
  .callout p {
    margin: 0 auto;
    padding: 10vw 15px;
    box-sizing: border-box;
    text-transform: uppercase;
    text-align: center; }
    @media (min-width: 1024px) {
      .callout p {
        width: 83.3333333333%;
        max-width: 1133.3333333333px; } }
  .callout.alt {
    transform: scaleX(-1); }
    .callout.alt p {
      transform: scaleX(-1); }

footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 1360px;
  margin: 0 auto;
  padding: 30px 15px;
  box-sizing: border-box;
  font-size: 14px;
  line-height: 17px;
  text-align: center; }
  footer > * {
    margin: 30px 0; }
  @media (min-width: 1024px) {
    footer {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      grid-template-areas: "logo social-icons social-icons" "address copyright info"; }
      footer .logo {
        grid-row: logo;
        grid-column: logo;
        margin: 0;
        text-align: left; }
      footer .social-icons {
        grid-row: social-icons;
        grid-column: social-icons;
        margin: 0;
        text-align: right; }
      footer .address {
        grid-row: address;
        grid-column: address;
        text-align: left; }
      footer .copyright {
        grid-row: copyright;
        grid-column: copyright; }
      footer .info {
        grid-row: info;
        grid-column: info;
        text-align: right; } }
  footer img {
    width: 192px; }
  footer a {
    color: #000000;
    font-weight: 500; }
  footer .social-icons {
    display: flex;
    justify-content: space-between;
    width: 100%;
    max-width: 330px;
    font-size: 0; }
    @media (min-width: 1024px) {
      footer .social-icons {
        margin-left: auto; } }
    footer .social-icons a {
      width: 40px;
      height: 40px;
      font-weight: normal;
      text-decoration: none;
      background-size: 100%; }
    footer .social-icons .linkedin {
      background-image: url("images/linkedin.svg"); }
    footer .social-icons .facebook {
      background-image: url("images/facebook.svg"); }
    footer .social-icons .twitter {
      background-image: url("images/twitter.svg"); }
    footer .social-icons .instagram {
      background-image: url("images/instagram.svg"); }
    footer .social-icons .youtube {
      background-image: url("images/youtube.svg"); }

.feature #mc_embed_signup {
  font-size: 20px;
  line-height: 32px; }
  @media (min-width: 1024px) {
    .feature #mc_embed_signup form {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; }
      .feature #mc_embed_signup form .mc-field-group {
        width: calc(50% - 15px); }
        .feature #mc_embed_signup form .mc-field-group.input-group {
          width: 60%; }
      .feature #mc_embed_signup form .submission {
        width: 40%;
        text-align: right; } }
  .feature #mc_embed_signup h2,
  .feature #mc_embed_signup .indicates-required,
  .feature #mc_embed_signup strong {
    display: none; }
  .feature #mc_embed_signup label {
    display: block; }
  .feature #mc_embed_signup input[type="text"],
  .feature #mc_embed_signup input[type="email"],
  .feature #mc_embed_signup input[type="phone"] {
    width: 100%;
    height: 52px;
    padding: 0 16px;
    font-size: 20px;
    line-height: 32px;
    border: #C4C4C4 solid 1px; }
  .feature #mc_embed_signup .mc-field-group {
    margin-bottom: 32px; }
  .feature #mc_embed_signup .input-group {
    font-size: 12px;
    font-weight: 500;
    line-height: 18px; }
    .feature #mc_embed_signup .input-group input {
      position: absolute;
      opacity: 0; }
    .feature #mc_embed_signup .input-group ul {
      margin: 0;
      padding: 0; }
    .feature #mc_embed_signup .input-group li {
      margin: 0;
      padding: 10px 0;
      list-style: none; }
    .feature #mc_embed_signup .input-group label {
      min-height: 24px;
      padding-left: 40px;
      background-image: url('data:image/svg+xml,<svg class="bi bi-square" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">\a 				<path fill-rule="evenodd" d="M14 1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/>\a 			</svg>');
      background-size: 24px;
      background-position: left top;
      background-repeat: no-repeat; }
    .feature #mc_embed_signup .input-group input:checked + label {
      background-image: url('data:image/svg+xml,<svg class="bi bi-check-square-fill" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">\a 				<path fill-rule="evenodd" d="M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm10.03 4.97a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>\a 			</svg>'); }
  .feature #mc_embed_signup input.mce_inline_error {
    border-color: #73A7C1; }
  .feature #mc_embed_signup div.mce_inline_error {
    padding: 5px 0 0 15px;
    color: #73A7C1;
    background-color: transparent; }
  .feature #mc_embed_signup .response {
    margin-bottom: 32px; }
    .feature #mc_embed_signup .response a {
      color: #000000; }
  .feature #mc_embed_signup #mc-embedded-subscribe {
    display: none; }
  .feature #mc_embed_signup .button {
    display: inline-flex;
    width: 100%;
    padding: 14px 0;
    text-align: center;
    cursor: pointer; }
    @media (min-width: 1024px) {
      .feature #mc_embed_signup .button {
        width: auto;
        padding: 14px 25px; } }
    .feature #mc_embed_signup .button::after {
      background: url("images/send_icon.svg") center no-repeat;
      background-size: 100%; }
