/* Added fallbacks to help with CLS, feel free to remove if it doesn't help on your project */
/* Colours */
/* Fluid heading sizes - set your min/max sizes and you're done! */
/* Some device sizes to use with min-width */
/* adjusted breakpoints for above */
/* 100% widths look better than "Snapping" IMO */
/* Utility */
/* Additional Spacers -- don't think you'll need more than 7, but if you do -- maybe just use a custom class  :)  */
.intro {
  background-color: #F8F8F8; }
  .intro .content-area {
    padding: 0 1rem; }
    @media (min-width: 1025px) {
      .intro .content-area {
        max-width: 650px; } }
    .intro .content-area h2 {
      position: relative;
      margin: 0 auto 2rem auto;
      padding-bottom: 1.25rem; }
      .intro .content-area h2:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        margin: 0;
        width: 76px;
        height: 4px;
        background-color: #51806A; }
  @media (min-width: 1025px) {
    .intro .img-wrap {
      position: absolute;
      height: 100%;
      top: 0;
      bottom: 0;
      right: 0; }
      .intro .img-wrap img,
      .intro .img-wrap picture {
        position: absolute;
        object-fit: cover;
        object-position: top;
        height: 100% !important;
        max-height: 100% !important;
        width: 100% !important;
        max-width: 100% !important; }
        .intro .img-wrap img img,
        .intro .img-wrap picture img {
          max-width: 100% !important; } }

.sec-communities {
  padding-top: 110px;
  padding-bottom: 90px; }
  .sec-communities .intro-content h2 {
    position: relative;
    max-width: 1354px;
    margin: 0 auto 2rem auto;
    padding-bottom: 1.25rem; }
    .sec-communities .intro-content h2:after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 0 auto;
      width: 76px;
      height: 4px;
      background-color: #51806A; }
  .sec-communities .card {
    background-color: #f8f8f8;
    padding: 4rem 3rem; }
    .sec-communities .card h3 {
      font-weight: 500;
      color: #292926;
      margin-bottom: 10px;
      margin-top: 30px;
      font-family: "Montserrat", "Arial Narrow", "Verdana", serif;
      font-size: clamp(1.5rem, calc( 24px + (24 - 24) * (( 100vw - 320px ) / (1920 - 320))), 1.5rem); }
    .sec-communities .card h6 {
      margin-bottom: 0; }

.prime-spot .content-area {
  padding: 0 1rem; }
  .prime-spot .content-area h2 {
    position: relative;
    margin: 0 auto 2rem auto;
    padding-bottom: 1.25rem; }
    .prime-spot .content-area h2:after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      margin: 0;
      width: 76px;
      height: 4px;
      background-color: #51806A; }

@media (min-width: 1025px) {
  .prime-spot .img-wrap {
    position: absolute;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0; }
    .prime-spot .img-wrap img,
    .prime-spot .img-wrap picture {
      position: absolute;
      object-fit: cover;
      object-position: top;
      height: 100% !important;
      max-height: 100% !important;
      width: 100% !important;
      max-width: 100% !important; }
      .prime-spot .img-wrap img img,
      .prime-spot .img-wrap picture img {
        max-width: 100% !important; } }

.store-front .content-area {
  padding: 0 1rem; }
  .store-front .content-area h2 {
    position: relative;
    margin: 0 auto 2rem auto;
    padding-bottom: 1.25rem; }
    .store-front .content-area h2:after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      margin: 0;
      width: 76px;
      height: 4px;
      background-color: #51806A; }

.store-front img,
.store-front picture {
  width: 100% !important;
  max-width: 100% !important; }

@media (min-width: 1025px) {
  .store-front .img-wrap {
    position: absolute;
    height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    width: 47.7%; }
    .store-front .img-wrap img,
    .store-front .img-wrap picture {
      position: absolute;
      object-fit: cover;
      object-position: top;
      height: 100% !important;
      max-height: 100% !important; }
      .store-front .img-wrap img img,
      .store-front .img-wrap picture img {
        max-width: 100% !important; } }

.set-up {
  padding-top: 110px;
  padding-bottom: 90px; }
  .set-up .intro-content h2 {
    position: relative;
    max-width: 1354px;
    margin: 0 auto 2rem auto;
    padding-bottom: 1.25rem; }
    .set-up .intro-content h2:after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 0 auto;
      width: 76px;
      height: 4px;
      background-color: #51806A; }
  .set-up .card {
    background-color: #f8f8f8;
    padding: 4rem 3rem; }
    .set-up .card h3 {
      font-weight: 500;
      color: #292926;
      margin-bottom: 10px;
      margin-top: 30px;
      font-family: "Montserrat", "Arial Narrow", "Verdana", serif;
      font-size: clamp(1.5rem, calc( 24px + (24 - 24) * (( 100vw - 320px ) / (1920 - 320))), 1.5rem); }
    .set-up .card h6 {
      margin-bottom: 0; }

.faqs h2 {
  position: relative;
  max-width: 1354px;
  margin: 0 auto 2rem auto;
  padding-bottom: 1.25rem; }
  .faqs h2:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 76px;
    height: 4px;
    background-color: #51806A; }
