:root {
    /* Add these styles to your global stylesheet, which is used across all site pages. You only need to do this once. All elements in the library derive their variables and base styles from this central sheet, simplifying site-wide edits. For instance, if you want to modify how your h2's appear across the site, you just update it once in the global styles, and the changes apply everywhere. */
    --primary: #52b105;
    --primaryLight: #52b105;
    --secondary: #52b105;
    --secondaryLight: #52b105;
    --headerColor: #1a1a1a;
    --bodyTextColor: #4e4b66;
    --bodyTextColorWhite: #fafbfc;
    /* 13px - 16px */
    --topperFontSize: clamp(0.8125rem, 1.6vw, 1rem);
    /* 31px - 49px */
    --headerFontSize: clamp(1.9375rem, 3.9vw, 3.0625rem);
    --bodyFontSize: 1rem;
    /* 60px - 100px top and bottom */
    --sectionPadding: clamp(3.75rem, 7.82vw, 6.25rem) 1rem;
}

body {
    margin: 0;
    padding: 0;
}

*, *:before, *:after {
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
}
.cs-topper {
    font-size: var(--topperFontSize);
    line-height: 1.2em;
    text-transform: uppercase;
    text-align: inherit;
    letter-spacing: .1em;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 0.25rem;
    display: block;
}

.cs-title {
    font-size: var(--headerFontSize);
    font-weight: 900;
    line-height: 1.2em;
    text-align: inherit;
    max-width: 43.75rem;
    margin: 0 0 1rem 0;
    color: var(--headerColor);
    position: relative;
}

.cs-text {
    font-size: var(--bodyFontSize);
    line-height: 1.5em;
    text-align: inherit;
    width: 100%;
    max-width: 40.625rem;
    margin: 0;
    color: var(--bodyTextColor);
}
                            /*-- -------------------------- -->
<---         Services           -->
<--- -------------------------- -*/

/* Mobile */
@media only screen and (min-width: 0rem) {
    #services-218 {
        padding: var(--sectionPadding);
    }
    #services-218 .cs-container {
        width: 100%;
        /* changes to 1280px at tablet */
        max-width: 34.375rem;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 48px - 64px */
        gap: clamp(3rem, 6vw, 4rem);
    }
    #services-218 .cs-content {
        /* set text align to left if content needs to be left aligned */
        text-align: left;
        width: 100%;
        max-width: 32.625rem;
        margin-right: auto;
        display: flex;
        flex-direction: column;
        /* centers content horizontally, set to flex-start to left align */
        align-items: flex-start;
    }

    #services-218 .cs-text {
        margin-bottom: 1rem;
    }
    #services-218 .cs-text:last-of-type {
        margin-bottom: 2rem;
    }
    #services-218 .cs-button-solid {
        font-size: 1rem;
        /* 46px - 56px */
        line-height: clamp(2.875rem, 5.5vw, 3.5rem);
        text-decoration: none;
        font-weight: 700;
        text-align: center;
        margin: 0;
        color: #fff;
        min-width: 9.375rem;
        padding: 0 1.5rem;
        background-color: var(--primary);
        border-radius: 0.25rem;
        display: inline-block;
        position: relative;
        z-index: 1;
        /* prevents padding from adding to the width */
        box-sizing: border-box;
    }
    #services-218 .cs-button-solid:before {
        content: "";
        position: absolute;
        height: 100%;
        width: 0%;
        background: #000;
        opacity: 1;
        top: 0;
        left: 0;
        z-index: -1;
        border-radius: 0.25rem;
        transition: width 0.3s;
    }
    #services-218 .cs-button-solid:hover:before {
        width: 100%;
    }
    #services-218 .cs-card-group {
        width: 100%;
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        gap: 2rem;
    }
    #services-218 .cs-item {
        list-style: none;
        width: 100%;
        margin-right: 0.625rem;
        /* padding left and right changes on tablet */
        padding: 2.75rem 2rem;
        /* prevents padding and border from affecting height and width */
        box-sizing: border-box;
        background-color: #fafbfc;
        border: 1px solid #dad9e3;
        border-radius: 0.3125rem;
        position: relative;
    }
    #services-218 .cs-item:before {
        /* top right box */
        content: "";
        width: 45%;
        max-width: 11.25rem;
        height: 50%;
        max-height: 9rem;
        background: var(--primary);
        border-radius: 1rem;
        position: absolute;
        display: block;
        top: -0.625rem;
        right: -0.625rem;
        z-index: -1;
    }
    #services-218 .cs-icon {
        /* 60px - 77px */
        width: clamp(3.75rem, 7.6vw, 4.8125rem);
        height: auto;
        margin-bottom: 2.5rem;
        display: block;
    }
    #services-218 .cs-h3 {
        /* 20px - 25px */
        font-size: clamp(1.25rem, 1.5vw, 1.5625rem);
        line-height: 1.2em;
        margin: 0;
        margin-bottom: 1rem;
        color: var(--headerColor);
        font-weight: bold;
    }
    #services-218 .cs-item-text {
        font-size: 1rem;
        line-height: 1.5em;
        margin: 0;
        color: var(--bodyTextColor);
    }
    #services-218 .cs-watermark {
        display: none;
        margin-right: 200px; /*code */
    }
}
/* Tablet */
@media only screen and (min-width: 48rem) {
    #services-218 .cs-container {
        max-width: 80rem;
        position: relative;
    }
    #services-218 .cs-content {
        width: 50%;
    }
    #services-218 .cs-card-group {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
    }
    #services-218 .cs-item {
        grid-column: span 4;
        grid-row: span 1;
        margin: 0;
        /* makes each card the same height if you add or remove lines of text */
        align-self: stretch;
    }
    #services-218 .cs-watermark {
        width: 30%;
        max-width: 14rem;
        height: auto;
        position: absolute;
        top: 0;
        right: 0;
        display: block;
    }
}

                                /*-- -------------------------- -->
<---            FAQ             -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0em) {
    #faq-254 {
        padding: var(--sectionPadding);
        background: #fafbfc;
    }
    #faq-254 .cs-container {
        width: 100%;
        /* changes to 1280px at tablet */
        max-width: 34.375rem;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 48px - 64px */
        gap: clamp(3rem, 6vw, 4rem);
    }
    #faq-254 .cs-content {
        /* set text align to left if content needs to be left aligned */
        text-align: center;
        width: 100%;
        display: flex;
        flex-direction: column;
        /* centers content horizontally, set to flex-start to left align */
        align-items: center;
    }

    #faq-254 .cs-faq-group {
        padding: 0;
        margin: 0;
        margin-bottom: 3rem;
    }
    #faq-254 .cs-faq-item {
        list-style: none;
        border-bottom: 1px solid #dad9e3;
        transition: border-bottom 0.3s;
    }
    #faq-254 .cs-faq-item.active {
        border-bottom: 1px solid var(--primary);
    }
    #faq-254 .cs-faq-item.active .cs-button:before {
        transform: rotate(180deg);
    }
    #faq-254 .cs-faq-item.active .cs-button:after {
        opacity: 0;
        transform: rotate(360deg);
    }
    #faq-254 .cs-faq-item.active .cs-item-p {
        height: auto;
        /* 12px - 16px */
        margin-bottom: clamp(0.75rem, 1.3vw, 1rem);
        opacity: 1;
    }
    #faq-254 .cs-button {
        /* 16px - 20px */
        font-size: clamp(1rem, 2vw, 1.25rem);
        line-height: 1.2em;
        text-align: left;
        font-weight: bold;
        /* 12px - 16px */
        padding: clamp(0.75rem, 1.3vw, 1rem) 0;
        background: transparent;
        border: none;
        color: var(--headerColor);
        display: block;
        width: 100%;
        position: relative;
    }
    #faq-254 .cs-button:hover {
        cursor: pointer;
    }
    #faq-254 .cs-button:before {
        /* plus sign */
        content: "";
        width: 0.75rem;
        height: 0.125rem;
        background: var(--headerColor);
        opacity: 1;
        position: absolute;
        display: block;
        top: 50%;
        right: 0.25rem;
        transition: transform 0.3s;
    }
    #faq-254 .cs-button:after {
        /* plus sign */
        content: "";
        width: 0.75rem;
        height: 0.125rem;
        background: var(--headerColor);
        opacity: 1;
        position: absolute;
        display: block;
        top: 50%;
        right: 0.25rem;
        transform: rotate(90deg);
        transform-origin: center;
        transition:
            opacity 0.5s,
            transform 0.3s;
    }
    #faq-254 .cs-item-p {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 1.5vw, 1rem);
        line-height: 1.5em;
        width: 90%;
        height: 0;
        margin: 0;
        opacity: 0;
        color: var(--bodyTextColor);
        /* clips the text so it doesn't show up */
        overflow: hidden;
        transition:
            opacity 0.3s,
            margin-bottom 0.3s;
    }
    #faq-254 .cs-cta {
        text-align: center;
        /* 48px - 64px top & bottom */
        /* 40px - 56px left & right */
        padding: clamp(3rem, 4.9vw, 4rem) clamp(2.5rem, 4vw, 3.5rem);
        background: var(--primaryLight);
        border-radius: 1rem;
        /* prevents padding from adding to width and height */
        box-sizing: border-box;
    }
    #faq-254 .cs-h3 {
        /* 25px - 31px */
        font-size: clamp(1.5625rem, 3vw, 1.9375rem);
        line-height: 1.2em;
        font-weight: bold;
        text-align: center;
        margin: 0;
        margin-bottom: 1rem;
        color: var(--headerColor);
    }
    #faq-254 .cs-cta-p {
        /* 16px - 20px */
        font-size: clamp(1rem, 2vw, 1.25rem);
        text-align: center;
        line-height: 1.5em;
        margin: 0;
        /* 32px - 48px */
        margin-bottom: clamp(2rem, 3.9vw, 3rem);
    }
    #faq-254 .cs-button-solid {
        font-size: 1rem;
        /* 46px - 56px */
        line-height: clamp(2.875rem, 5.5vw, 3.5rem);
        text-decoration: none;
        font-weight: 700;
        text-align: center;
        margin: 0;
        color: #fff;
        min-width: 9.375rem;
        padding: 0 1.5rem;
        background-color: var(--primary);
        border-radius: 0.25rem;
        display: inline-block;
        position: relative;
        z-index: 1;
        /* prevents padding from adding to the width */
        box-sizing: border-box;
    }
    #faq-254 .cs-button-solid:before {
        content: "";
        position: absolute;
        height: 100%;
        width: 0%;
        background: #000;
        opacity: 1;
        top: 0;
        left: 0;
        z-index: -1;
        border-radius: 0.25rem;
        transition: width 0.3s;
    }
    #faq-254 .cs-button-solid:hover:before {
        width: 100%;
    }
}
/* Tablet - 768px */
@media only screen and (min-width: 48em) {
    #faq-254 .cs-container {
        max-width: 67.5rem;
    }
    #faq-254 .cs-flex-group {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        /* 16px - 48px */
        gap: clamp(1rem, 3.5vw, 3rem);
    }
    #faq-254 .cs-faq-group {
        margin: 0;
    }
    #faq-254 .cs-cta {
        width: 38.5%;
        max-width: 25.8125rem;
        /* prevents flexbox from squishing it */
        flex: none;
    }
}
 /*-- -------------------------- -->
<---          Content           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #content-1638 {
    padding: var(--sectionPadding);
    background-color: #f7f7f7;
    position: relative;
    z-index: 1;
  }
  #content-1638 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 100px */
    gap: clamp(3rem, 9vw, 6.25rem);
  }
  #content-1638 .cs-content {
    /* set text align to left if content needs to be left aligned */
    text-align: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    /* centers content horizontally, set to flex-start to left align */
    align-items: flex-start;
  }
  #content-1638 .cs-flex {
    max-width: 38rem;
  }
  #content-1638 .cs-h3 {
    font-size: 1.25rem;
    line-height: 1.2em;
    font-weight: 700;
    margin: 0 0 1rem 0;
    color: var(--headerColor);
  }
  #content-1638 .cs-text {
    margin-bottom: 1rem;
  }
  #content-1638 .cs-text:last-of-type {
    margin-bottom: 2rem;
  }
  #content-1638 .cs-button-solid {
    font-size: 1rem;
    /* 46px - 56px */
    line-height: clamp(2.875rem, 5.5vw, 3.5rem);
    text-decoration: none;
    font-weight: 700;
    text-align: center;
    margin: 0;
    color: #fff;
    min-width: 9.375rem;
    padding: 0 1.5rem;
    background-color: var(--primary);
    display: inline-block;
    position: relative;
    z-index: 1;
    /* prevents padding from adding to the width */
    box-sizing: border-box;
  }
  #content-1638 .cs-button-solid:before {
    content: '';
    position: absolute;
    height: 100%;
    width: 0%;
    background: #000;
    opacity: 1;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width .3s;
  }
  #content-1638 .cs-button-solid:hover:before {
    width: 100%;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #content-1638:before {
    height: 63%;
  }
  #content-1638 .cs-content {
    flex-direction: row;
    justify-content: flex-start; /*Originally space-between */
    align-items: flex-start;
    /* margin-left: 190px; Code */
    gap: 2.5rem;         /* Gap originally 2.5 */
  }
  #content-1638 .cs-flex {
    width: 50%;    /* Width originally 50% */
    text-align: left;
    max-width: 38rem;
  }
  #content-1638 .cs-title {
    margin: 0;
  }
}

/*-- -------------------------- -->
<---          Gallery           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #gallery-1449 {
    padding: var(--sectionPadding);
  }
  #gallery-1449 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
    position: relative;
    z-index: 1;
  }
  #gallery-1449 .cs-content {
    text-align: center;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
  }
  #gallery-1449 .cs-title {
    margin: 0;
  }
  #gallery-1449 .cs-button-group {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 1rem;
    /* 20px - 32px */
    column-gap: clamp(1.25rem, 2vw, 2rem);
  }
  #gallery-1449 .cs-button {
    font-size: 1rem;
    line-height: 1.5em;
    color: var(--bodyTextColor);
    background-color: transparent;
    border: none;
    position: relative;
    z-index: 1;
    transition: color 0.3s;
  }
  #gallery-1449 .cs-button:before {
    content: '';
    width: 100%;
    height: 4px;
    background: var(--primary);
    opacity: 0;
    border-radius: 4px 4px 0 0;
    position: absolute;
    display: block;
    bottom: 0;
    left: 0;
    transition: opacity 0.3s, bottom 0.3s;
  }
  #gallery-1449 .cs-button:hover {
    color: var(--primary);
    cursor: pointer;
  }
  #gallery-1449 .cs-button:hover:before {
    opacity: 1;
    bottom: -0.625rem;
  }
  #gallery-1449 .cs-button.cs-active {
    color: var(--primary);
  }
  #gallery-1449 .cs-button.cs-active:before {
    opacity: 1;
    bottom: -0.625rem;
  }
  #gallery-1449 .cs-gallery-wrapper {
    width: 100%;
    position: relative;
    z-index: 1;
  }
  #gallery-1449 .cs-gallery {
    width: 100%;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(19.0625rem, 1fr));
    /* 16px - 20px */
    gap: clamp(1rem, 1.5vw, 1.25rem);
    position: relative;
    perspective: 700px;
    transform-style: preserve-3d;
    transition: transform 0.7s, opacity 0.3s, visibility 0.5s, top 0.3s, left 0.3s;
    /* makes the transfrom scaling orgin the top left corner, dictates the direction by which the scale transforms animate towards */
    transform-origin: left top;
  }
  #gallery-1449 .cs-gallery.cs-hidden {
    /* by using visibility:hidden instead of display:none, we can see the animations from the opacity and transforms, display:none won't render animations. */
    visibility: hidden;
    /* prevents the mouse from interacting with it */
    pointer-events: none;
    /* hidden galleries have a 0 opacity, and we animate the opacity to 1 when they become active */
    opacity: 0;
    /* this top and left value help control the animation, by setting it to position absolute and left 0, the gallery won't fly off screen to the left, it will stop its position to be at the left edge of the .cs-container (left: 0). Same for the top:0 value, the gallery won't go past that posiiton when it animates */
    top: 0;
    left: 0;
    position: absolute;
    /* prevents the hidden galleries from overflowing the section, and makes a nice animations to transition to and from */
    transform: scaleY(0) scaleX(0);
  }
  #gallery-1449 .cs-gallery.cs-hidden .cs-image {
    /* when gallery is hidden, add these styles to the cs-image to animate from when cs-hidden is removed from the .cs-gallery */
    transform: translateY(2.1875rem) rotateX(90deg);
    opacity: 0;
  }
  #gallery-1449 .cs-image {
    /* 260px - 360px */
    min-height: clamp(16.25rem, 60vw, 20rem);
    border-radius: 1rem;
    /* clips the image corners */
    overflow: hidden;
    display: block;
    position: relative;
    /* when .cs-hidden is removed from the .cs-gallery, reset these values and animate between their hidden styles */
    transform: translateY(0rem) rotateX(0);
    opacity: 1;
    transition: opacity 0.6s, transform 0.6s;
  }
  #gallery-1449 .cs-image:nth-of-type(1) {
    /* the transition delays change at desktop */
    /* these delays stagger the reveal of each image so they all go one after the other and not all at once */
    transition-delay: 0.1s;
  }
  #gallery-1449 .cs-image:nth-of-type(2) {
    transition-delay: 0.2s;
  }
  #gallery-1449 .cs-image:nth-of-type(3) {
    transition-delay: 0.3s;
  }
  #gallery-1449 .cs-image:nth-of-type(4) {
    transition-delay: 0.4s;
  }
  #gallery-1449 .cs-image:nth-of-type(5) {
    transition-delay: 0.5s;
  }
  #gallery-1449 .cs-image:nth-of-type(6) {
    transition-delay: 0.6s;
  }
  #gallery-1449 .cs-image:nth-of-type(7) {
    transition-delay: 0.7s;
  }
  #gallery-1449 .cs-image:nth-of-type(8) {
    transition-delay: 0.8s;
  }
  #gallery-1449 .cs-image img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    /* makes it act like a background image */
    object-fit: cover;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #gallery-1449 .cs-content {
    text-align: left;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
  }
  #gallery-1449 .cs-button {
    margin-bottom: 0.625rem;
  }
}
 /*-- -------------------------- -->
<---     Mobile Navigation      -->
<--- -------------------------- -*/
/* Mobile - 1023px */
@media only screen and (max-width: 63.9375rem) {
  body.cs-open {
    overflow: hidden;
  }
  #cs-navigation {
    width: 100%;
    /* prevents padding and border from affecting height and width */
    box-sizing: border-box;
    padding: 0.75rem 1rem;
    background-color: #fff;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    position: fixed;
    z-index: 10000;
  }
  #cs-navigation:before {
    content: "";
    width: 100%;
    height: 0vh;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    display: block;
    position: absolute;
    top: 100%;
    right: 0;
    z-index: -1100;
    transition: height 0.5s, opacity 0.5s;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
  #cs-navigation.cs-active:before {
    height: 150vh;
    opacity: 1;
  }
  #cs-navigation.cs-active .cs-ul-wrapper {
    opacity: 1;
    transform: scaleY(1);
    transition-delay: 0.15s;
  }
  #cs-navigation.cs-active .cs-li {
    opacity: 1;
    transform: translateY(0);
  }
  #cs-navigation .cs-container {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  #cs-navigation .cs-logo {
    width: 40%;
    max-width: 9.125rem;
    height: 100%;
    margin: 0 auto 0 0;
    /* prevents padding and border from affecting height and width */
    box-sizing: border-box;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
  }
  #cs-navigation .cs-logo img {
    width: 100%;
    height: 100%;
    /* ensures the image never overflows the container. It stays contained within it's width and height and expands to fill it then stops once it reaches an edge */
    object-fit: contain;
  }
  #cs-navigation .cs-toggle {
    /* 44px - 48px */
    width: clamp(2.75rem, 6vw, 3rem);
    height: clamp(2.75rem, 6vw, 3rem);
    margin: 0 0 0 auto;
    background-color: transparent;
    border: none;
    border-radius: 0.25rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #cs-navigation .cs-active .cs-line1 {
    top: 50%;
    transform: translate(-50%, -50%) rotate(225deg);
  }
  #cs-navigation .cs-active .cs-line2 {
    top: 50%;
    transform: translate(-50%, -50%) translateY(0) rotate(-225deg);
    transform-origin: center;
  }
  #cs-navigation .cs-active .cs-line3 {
    opacity: 0;
    bottom: 100%;
  }
  #cs-navigation .cs-box {
    /* 24px - 28px */
    width: clamp(1.5rem, 2vw, 1.75rem);
    /* 14px - 16px */
    height: clamp(0.875rem, 1.5vw, 1rem);
    position: relative;
  }
  #cs-navigation .cs-line {
    width: 100%;
    height: 2px;
    background-color: #1a1a1a;
    border-radius: 2px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  #cs-navigation .cs-line1 {
    top: 0;
    transition: transform 0.5s, top 0.3s, left 0.3s;
    animation-duration: 0.7s;
    animation-timing-function: ease;
    animation-direction: normal;
    animation-fill-mode: forwards;
    transform-origin: center;
  }
  #cs-navigation .cs-line2 {
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    transition: top 0.3s, left 0.3s, transform 0.5s;
    animation-duration: 0.7s;
    animation-timing-function: ease;
    animation-direction: normal;
    animation-fill-mode: forwards;
  }
  #cs-navigation .cs-line3 {
    bottom: 0;
    transition: bottom 0.3s, opacity 0.3s;
  }
  #cs-navigation .cs-ul-wrapper {
    width: 100%;
    height: auto;
    padding-bottom: 2.4em;
    background-color: #fff;
    box-shadow: inset rgba(0, 0, 0, 0.2) 0px 8px 24px;
    opacity: 0;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: -1;
    overflow: hidden;
    transform: scaleY(0);
    transition: transform 0.4s, opacity 0.3s;
    transform-origin: top;
  }
  #cs-navigation .cs-ul {
    width: 100%;
    height: auto;
    max-height: 65vh;
    margin: 0;
    padding: 3rem 0 0 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 1.25rem;
    overflow: scroll;
  }
  #cs-navigation .cs-li {
    text-align: center;
    list-style: none;
    width: 100%;
    margin-right: 0;
    opacity: 0;
    /* transition from these values */
    transform: translateY(-4.375rem);
    transition: transform 0.6s, opacity 0.9s;
  }
  #cs-navigation .cs-li:nth-of-type(1) {
    transition-delay: 0.05s;
  }
  #cs-navigation .cs-li:nth-of-type(2) {
    transition-delay: 0.1s;
  }
  #cs-navigation .cs-li:nth-of-type(3) {
    transition-delay: 0.15s;
  }
  #cs-navigation .cs-li:nth-of-type(4) {
    transition-delay: 0.2s;
  }
  #cs-navigation .cs-li:nth-of-type(5) {
    transition-delay: 0.25s;
  }
  #cs-navigation .cs-li:nth-of-type(6) {
    transition-delay: 0.3s;
  }
  #cs-navigation .cs-li:nth-of-type(7) {
    transition-delay: 0.35s;
  }
  #cs-navigation .cs-li:nth-of-type(8) {
    transition-delay: 0.4s;
  }
  #cs-navigation .cs-li:nth-of-type(9) {
    transition-delay: 0.45s;
  }
  #cs-navigation .cs-li:nth-of-type(10) {
    transition-delay: 0.5s;
  }
  #cs-navigation .cs-li:nth-of-type(11) {
    transition-delay: 0.55s;
  }
  #cs-navigation .cs-li:nth-of-type(12) {
    transition-delay: 0.6s;
  }
  #cs-navigation .cs-li:nth-of-type(13) {
    transition-delay: 0.65s;
  }
  #cs-navigation .cs-li-link {
    /* 16px - 24px */
    font-size: clamp(1rem, 2.5vw, 1.5rem);
    line-height: 1.2em;
    text-decoration: none;
    margin: 0;
    color: var(--headerColor);
    display: inline-block;
    position: relative;
  }
  #cs-navigation .cs-li-link:before {
    /* active state underline */
    content: "";
    width: 100%;
    height: 1px;
    background: currentColor;
    opacity: 1;
    display: none;
    position: absolute;
    bottom: -0.125rem;
    left: 0;
  }
  #cs-navigation .cs-li-link.cs-active:before {
    display: block;
  }
  #cs-navigation .cs-button-solid {
    display: none;
  }
}
/*-- -------------------------- -->
<---     Desktop Navigation     -->
<--- -------------------------- -*/
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #cs-navigation {
    width: 100%;
    /* prevents padding and border from affecting height and width */
    box-sizing: border-box;
    padding: 0 1rem;
    background-color: #fff;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    position: fixed;
    z-index: 10000;
  }
  #cs-navigation .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1.5rem;
  }
  #cs-navigation .cs-toggle {
    display: none;
  }
  #cs-navigation .cs-logo {
    width: 18.4%;
    max-width: 21.875rem;
    height: 4.0625rem;
    /* margin-right auto pushes everything away from it to the right */
    margin: 0 auto 0 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
  }
  #cs-navigation .cs-logo img {
    width: 100%;
    height: 100%;
    /* ensures the image never overflows the container. It stays contained within it's width and height and expands to fill it then stops once it reaches an edge */
    object-fit: contain;
  }
  #cs-navigation .cs-ul {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    /* 20px - 36px */
    gap: clamp(1.25rem, 2.6vw, 2.25rem);
  }
  #cs-navigation .cs-li {
    list-style: none;
    padding: 2rem 0;
    /* prevent flexbox from squishing it */
    flex: none;
  }
  #cs-navigation .cs-li-link {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1vw, 1rem);
    line-height: 1.5em;
    text-decoration: none;
    margin: 0;
    color: var(--bodyTextColor);
    display: block;
    position: relative;
  }
  #cs-navigation .cs-li-link:hover:before {
    width: 100%;
  }
  #cs-navigation .cs-li-link.cs-active:before {
    width: 100%;
  }
  #cs-navigation .cs-li-link:before {
    /* active state underline */
    content: "";
    width: 0%;
    height: 2px;
    background: var(--primary);
    opacity: 1;
    display: block;
    position: absolute;
    bottom: 0rem;
    left: 0;
    transition: width 0.3s;
  }
  #cs-navigation .cs-button-solid {
    font-size: 1rem;
    font-weight: 700;
    /* 46px - 56px */
    line-height: clamp(2.875em, 5.5vw, 3.5em);
    text-align: center;
    text-decoration: none;
    min-width: 9.375rem;
    margin: 0;
    /* prevents padding from adding to the width */
    box-sizing: border-box;
    padding: 0 1.5rem;
    color: #fff;
    background-color: var(--primary);
    border-radius: 0.25rem;
    display: inline-block;
    position: relative;
    z-index: 1;
  }
  #cs-navigation .cs-button-solid:before {
    content: "";
    width: 0%;
    height: 100%;
    background: #000;
    opacity: 1;
    border-radius: 0.25rem;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width 0.3s;
  }
  #cs-navigation .cs-button-solid:hover:before {
    width: 100%;
  }
}
   /*-- -------------------------- -->
<---          Reviews           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #reviews-2248 {
    /* Centers the button */
    text-align: center;
    padding: var(--sectionPadding);
    background-color: #FBF5F1;
  }
  #reviews-2248 .cs-container {
    width: 100%;
    /* changes to 1280px at tablet */
    max-width: 34.375rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
  }
  #reviews-2248 .cs-content {
    /* set text align to left if content needs to be left aligned */
    text-align: center;
    width: 100%;
    display: flex;
    flex-direction: column;
    /* centers content horizontally, set to flex-start to left align */
    align-items: center;
  }
  #reviews-2248 .cs-title {
    margin-bottom: 0;
  }
  #reviews-2248 .cs-button-solid {
    font-size: 1rem;
    /* 46px - 56px */
    line-height: clamp(2.875rem, 5.5vw, 3.5rem);
    text-decoration: none;
    font-weight: 700;
    text-align: center;
    margin: 0;
    color: #fff;
    min-width: 9.375rem;
    padding: 0 1.5rem;
    background-color: var(--primary);
    border-radius: 0.25rem;
    display: inline-block;
    position: relative;
    z-index: 1;
    /* prevents padding from adding to the width */
    box-sizing: border-box;
  }
  #reviews-2248 .cs-button-solid:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 0%;
    background: #000;
    opacity: 1;
    top: 0;
    left: 0;
    z-index: -1;
    border-radius: 0.25rem;
    transition: width 0.3s;
  }
  #reviews-2248 .cs-button-solid:hover:before {
    width: 100%;
  }
  #reviews-2248 .cs-button-solid {
    /* places it at the bottom of the container in the 3rd position */
    order: 3;
  }
  #reviews-2248 .cs-card-group {
    width: 100%;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    /* 16px - 20px */
    row-gap: clamp(1rem, 2.5vw, 1.25rem);
  }
  #reviews-2248 .cs-item {
    text-align: left;
    list-style: none;
    /* 32px - 40px top & bottom */
    /* 16px - 32px left & right */
    padding: clamp(2rem, 5vw, 2.5rem) clamp(1rem, 4vw, 2rem);
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    align-items: flex-start;
    grid-column: span 12;
    position: relative;
    z-index: 1;
  }
  #reviews-2248 .cs-item:before {
    /* background color */
    content: '';
    width: 100%;
    height: 100%;
    background: var(--primary);
    opacity: 0.1;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    z-index: -1;
  }
  #reviews-2248 .cs-wrapper {
    height: auto;
    width: auto;
    margin-bottom: 1rem;
    position: relative;
    z-index: 1;
  }
  #reviews-2248 .cs-wrapper:before {
    content: '';
    width: 100vw;
    height: 2px;
    background: var(--primary);
    opacity: 1;
    position: absolute;
    display: block;
    top: 50%;
    left: calc(100% + 1rem);
    transform: translateY(-50%);
  }
  #reviews-2248 .cs-info {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    /* 8px - 16px */
    gap: clamp(0.8rem, 2vw, 1rem);
  }
  #reviews-2248 .cs-picture {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    display: block;
    flex: none;
    position: relative;
    z-index: 1;
  }
  #reviews-2248 .cs-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
  }
  #reviews-2248 .cs-quote {
    width: 1.25rem;
    height: auto;
    margin-top: -0.5rem;
    display: block;
  }
  #reviews-2248 .cs-item-text {
    font-size: 1rem;
    text-align: inherit;
    line-height: 1.5em;
    /* 32px - 40px */
    margin: 0 0 clamp(2rem, 4vw, 2.5rem);
    color: var(--bodyTextColor);
  }
  #reviews-2248 .cs-name {
    font-size: 1.25rem;
    line-height: 1.2em;
    font-weight: 700;
    margin: 0;
    color: var(--headerColor);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  #reviews-2248 .cs-desc {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    font-weight: 400;
    line-height: 1.5em;
    margin: 0;
    color: var(--bodyTextColor);
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #reviews-2248 .cs-container {
    max-width: 80rem;
  }
  #reviews-2248 .cs-content {
    display: flex;
  }
  #reviews-2248 .cs-card-group {
    flex-direction: row;
    /* 16px - 20px */
    column-gap: clamp(1rem, 2.5vw, 1.25rem);
  }
  #reviews-2248 .cs-item {
    grid-column: span 4;
  }
}
   /*-- -------------------------- -->
<---          Footer            -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #cs-footer-309 {
        padding: var(--sectionPadding);
        background-color: #fff;
        /* Navigation Links */
    }
    #cs-footer-309 .cs-container {
        width: 100%;
        /* reset on desktop */
        max-width: 43.75rem;
        margin: auto;
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 2.5rem;
    }
    #cs-footer-309 .cs-logo-group {
        /* takes up all the space, lets the other ul's wrap below it */
        width: 100%;
        position: relative;
    }
    #cs-footer-309 .cs-logo {
        width: 11.125rem;
        height: auto;
        display: block;
        margin-bottom: 1.5rem;
    }
    #cs-footer-309 .cs-logo-img {
        width: 100%;
        height: auto;
    }
    #cs-footer-309 .cs-logo-img.dark {
        display: none;
    }
    #cs-footer-309 .cs-text {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 2.5vw, 1rem);
        line-height: 1.5em;
        margin: 0;
        width: 78%;
        /* changes to 305px at desktop */
        max-width: 26.25rem;
        color: var(--headerColor);
    }
    #cs-footer-309 .cs-nav {
        width: 100%;
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: center;
        align-items: flex-start;
        flex-direction: column;
        gap: 0.75rem;
    }
    #cs-footer-309 .cs-nav-li {
        list-style: none;
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
    }
    #cs-footer-309 .cs-header {
        font-size: 1rem;
        line-height: 1.2em;
        text-transform: uppercase;
        font-weight: 700;
        margin-bottom: 0.75rem;
        color: var(--headerColor);
        position: relative;
        display: block;
    }
    #cs-footer-309 .cs-nav-link {
        font-size: 1rem;
        text-decoration: none;
        line-height: 1.5em;
        color: var(--headerColor);
        position: relative;
        display: inline-block;
        transition: color 0.3s;
    }
    #cs-footer-309 .cs-nav-link:before {
        /* underline */
        content: "";
        width: 0%;
        height: 0.125rem;
        background: currentColor;
        opacity: 1;
        position: absolute;
        display: block;
        bottom: -0.125rem;
        left: 0;
        transition: width 0.3s;
    }
    #cs-footer-309 .cs-nav-link:hover {
        color: var(--primary);
    }
    #cs-footer-309 .cs-nav-link:hover:before {
        width: 100%;
    }
    #cs-footer-309 .cs-icon {
        width: 1.5rem;
        height: auto;
        margin-right: 0.75rem;
    }
    #cs-footer-309 .cs-bottom {
        max-width: 80rem;
        margin: auto;
        margin-top: 2rem;
        padding-top: 1.5rem;
        border-top: 1px solid #484848;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    #cs-footer-309 .cs-copyright,
    #cs-footer-309 .cs-copyright-link {
        font-size: 1rem;
        line-height: 1.5em;
        color: var(--headerColor);
    }
    #cs-footer-309 .cs-copyright-link {
        text-decoration: none;
        transition: color 0.3s;
    }
    #cs-footer-309 .cs-copyright-link:hover {
        color: var(--primary);
    }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
    #cs-footer-309 .cs-container {
        row-gap: 0;
        flex-direction: row;
        justify-content: space-between;
        row-gap: 2.5rem;
    }
    #cs-footer-309 .cs-nav {
        width: auto;
    }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
    #cs-footer-309 .cs-container {
        max-width: 80rem;
        flex-wrap: nowrap;
        /* align everything to the right */
        justify-content: flex-end;
        column-gap: 5.25rem;
    }
    #cs-footer-309 .cs-logo-group {
        width: 30%;
        max-width: 24.1875rem;
        /* pushes away from everything to the right */
        margin-right: auto;
    }
    #cs-footer-309 .cs-text {
        width: 100%;
    }
}

/*-- -------------------------- -->
<---       Side By Side         -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    @keyframes floatAnimation {
        0% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(-2rem);
        }
        100% {
            transform: translateY(0);
        }
    }
    @keyframes floatAnimation2 {
        0% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(-3rem);
        }
        100% {
            transform: translateY(0);
        }
    }
    #sbs-1362 {
        padding: var(--sectionPadding);
        position: relative;
        overflow: hidden;
        z-index: 1;
    }
    #sbs-1362 .cs-container {
        width: 100%;
        /* changes to 1280px at desktop */
        max-width: 36.5rem;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 48px - 64px */
        gap: clamp(3rem, 6vw, 4rem);
    }
    #sbs-1362 .cs-content {
        /* set text align to left if content needs to be left aligned */
        text-align: left;
        width: 100%;
        max-width: 39.375rem;
        display: flex;
        flex-direction: column;
        /* centers content horizontally, set to flex-start to left align */
        align-items: flex-start;
    }

    #sbs-1362 .cs-topper {
        color: #767676;
    }
    #sbs-1362 .cs-title {
        /* 23 characters wide including spaces */
        max-width: 26ch;
    }
    #sbs-1362 .cs-text {
        margin-bottom: 1rem;
    }
    #sbs-1362 .cs-text:last-of-type {
        margin-bottom: 1.5rem;
    }
    #sbs-1362 .cs-card-group {
        width: 100%;
        max-width: 39.375rem;
        margin: 0 0 1.5rem 0;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(15.625rem, 1fr));
        align-items: center;
        gap: clamp(1rem, 2vw, 1.25rem);
    }
    #sbs-1362 .cs-item {
        list-style: none;
        /* 16px - 24px */
        padding: clamp(1rem, 3vw, 1.5rem);
        /* prevents padding from affecting height and width */
        box-sizing: border-box;
        background-color: #f7f7f7;
        border-radius: 1rem;
        border: 1px solid #e8e8e8;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
    #sbs-1362 .cs-h3 {
        font-size: 1.25rem;
        line-height: 1.2em;
        font-weight: 700;
        margin: 0;
        color: var(--headerColor);
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 0.5rem;
    }
    #sbs-1362 .cs-h3-icon {
        width: 2rem;
        height: auto;
        display: block;
    }
    #sbs-1362 .cs-item-text {
        font-size: 0.875rem;
        line-height: 1.5em;
        margin: 0;
        color: var(--bodyTextColor);
    }
    #sbs-1362 .cs-ul {
        width: 100%;
        margin: 0 0 1.5rem 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
    #sbs-1362 .cs-li {
        font-size: var(--bodyFontSize);
        list-style: none;
        line-height: 1.5em;
        width: 100%;
        color: var(--bodyTextColor);
        display: flex;
        justify-content: flex-start;
        /* push icon top the top so if the list item goes to two lines the icon stays at the top */
        align-items: flex-start;
        gap: 0.5rem;
    }
    #sbs-1362 .cs-icon {
        width: 1.5rem;
        height: auto;
        /* adds extra space between the icon and top of parent so it's more centered */
        margin-top: 1px;
        display: block;
    }
    #sbs-1362 .cs-button-solid {
        font-size: 1rem;
        line-height: 3.5rem;
        text-decoration: none;
        font-weight: 700;
        overflow: hidden;
        margin: 0;
        color: #fff;
        padding: 0 3rem;
        border-radius: 1.875rem;
        background-color: var(--primary);
        display: inline-block;
        position: relative;
        z-index: 1;
        transition: color 0.3s;
    }
    #sbs-1362 .cs-button-solid:before {
        content: "";
        position: absolute;
        display: block;
        height: 100%;
        width: 0%;
        background: #1a1a1a;
        opacity: 1;
        top: 0;
        left: 0;
        z-index: -1;
        transition: width 0.3s;
    }
    #sbs-1362 .cs-button-solid:hover {
        color: var(--primary);
    }
    #sbs-1362 .cs-button-solid:hover:before {
        width: 100%;
    }
    #sbs-1362 .cs-image-group {
        width: 100%;
        max-width: 36.625rem;
        /* Changes to auto at desktop */
        height: 32.5rem;
        /* 32px - 48px */
        border-radius: clamp(2rem, 4vw, 3rem);
        /* clips the corners of the children around the border radius */
        overflow: hidden;
        position: relative;
    }
    #sbs-1362 .cs-background {
        width: 100%;
        height: 100%;
        /* makes it cover the parent dimensions */
        object-fit: cover;
        display: block;
    }
    #sbs-1362 .cs-background img {
        width: 100%;
        height: 100%;
        /* makes it cover the parent like a backgorund image */
        object-fit: cover;
        display: block;
    }
    #sbs-1362 .cs-box {
        text-align: left;
        width: 100%;
        max-width: 19rem;
        padding: 2rem;
        /* prevents padding from affecting height and width */
        box-sizing: border-box;
        background-color: var(--primary);
        /* 48px - 80px */
        border-radius: 2rem;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.5rem;
        position: absolute;
        /* 12px - 20px */
        right: clamp(0.75rem, 1.9vw, 1.5rem);
        /* 12px - 20px */
        bottom: clamp(0.75rem, 1.9vw, 1.5rem);
    }
    #sbs-1362 .cs-box-icon {
        width: 3.75rem;
        height: auto;
        display: block;
    }
    #sbs-1362 .cs-desc {
        font-size: 1.25rem;
        line-height: 1.2em;
        text-align: inherit;
        font-weight: 700;
        width: 100%;
        margin: 0;
        color: var(--bodyTextColorWhite);
    }
    #sbs-1362 .cs-bubbles {
        font-size: min(2.5vw, 0.7em);
        width: 26.1875em;
        height: 26.6875em;
        position: absolute;
        /* changes to 160px at larger desktop */
        right: -16.25em;
        /* changes to 30px at large desktop */
        bottom: -3.125em;
        z-index: -1;
    }
    #sbs-1362 .cs-bubbles:before {
        /* white border bubble */
        content: "";
        width: 20.625em;
        height: 20.625em;
        background: transparent;
        border: 1px solid #1a1a1a;
        border-radius: 50%;
        opacity: 1;
        position: absolute;
        display: block;
        top: 0;
        right: 0;
        animation-name: floatAnimation;
        animation-duration: 5s;
        animation-timing-function: ease-in-out;
        animation-fill-mode: forwards;
        animation-iteration-count: infinite;
    }
    #sbs-1362 .cs-bubbles:after {
        /* orange bubble */
        content: "";
        width: 16.25em;
        height: 16.25em;
        background: var(--primary);
        opacity: 0.15;
        border-radius: 50%;
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: -1;
        animation-name: floatAnimation2;
        animation-duration: 14s;
        animation-timing-function: ease-in-out;
        animation-fill-mode: forwards;
        animation-iteration-count: infinite;
    }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
    #sbs-1362 .cs-container {
        max-width: 80rem;
        flex-direction: row;
        justify-content: space-between;
        align-items: stretch;
    }
    #sbs-1362 .cs-image-group {
        height: auto;
    }
    #sbs-1362 .cs-bubbles {
        font-size: min(2.5vw, 1em);
    }
}
/* Large Desktop 1600px */
@media only screen and (min-width: 100rem) {
    #sbs-1362 .cs-bubbles {
        margin-left: 40.625rem;
        right: auto;
        left: 50%;
        bottom: 1.875rem;
    }
}

@media only screen and (min-width: 64rem) {

  .paragraphforlandscaping {

  text-align: left; 
  border-left: 3px solid #52b105;
  margin-left: 20%;
  border-width: 10px; 
  font-size: 18px;
  padding-left: 10px;

  }
} 

  .paragraphforlandscaping {

  text-align: center; 
  border-left: 3px solid #52b105;
  margin-left: 15%;
  margin-right: 15%;
  border-width: 10px; 
  font-size: 18px;
  padding-left: 5px; 
  
}


/*-- -------------------------- -->
<---       Side By Side         -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #sbs-867 {
        padding: var(--sectionPadding);
    }
    #sbs-867 .cs-container {
        width: 100%;
        /* changes to 1280px at desktop */
        max-width: 34.375rem;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 48px - 64px */
        gap: clamp(3rem, 7vw, 4rem);
    }
    #sbs-867 .cs-content {
        /* set text aling to left if content needs to be left aligned */
        text-align: left;
        width: 100%;
        max-width: 33.875rem;
        /* prevents padding from affecting width and height */
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        /* centers content horizontally, set to flex-start to left align */
        align-items: flex-start;
    }

    #sbs-867 .cs-title {
        /* 17 characters wide including spaces */
        max-width: 17ch;
    }
    #sbs-867 .cs-text {
        margin-bottom: 1rem;
    }
    #sbs-867 .cs-text:last-of-type {
        margin-bottom: 2rem;
    }
    #sbs-867 .cs-button-solid {
        font-size: 1rem;
        /* 46px - 56px */
        line-height: clamp(2.875rem, 5.5vw, 3.5rem);
        text-decoration: none;
        font-weight: 700;
        text-align: center;
        margin: 0;
        color: #fff;
        min-width: 9.375rem;
        padding: 0 1.5rem;
        background-color: var(--primary);
        border-radius: 0.25rem;
        display: inline-block;
        position: relative;
        z-index: 1;
        /* prevents padding from adding to the width */
        box-sizing: border-box;
    }
    #sbs-867 .cs-button-solid:before {
        content: "";
        position: absolute;
        height: 100%;
        width: 0%;
        background: #000;
        opacity: 1;
        top: 0;
        left: 0;
        z-index: -1;
        border-radius: 0.25rem;
        transition: width 0.3s;
    }
    #sbs-867 .cs-button-solid:hover:before {
        width: 100%;
    }
    #sbs-867 .cs-picture {
        display: block;
        position: relative;
        width: 100%;
        max-width: 39.375rem;
        /* 400px - 775px */
        height: clamp(25rem, 70vw, 48.4375rem);
        box-shadow: 0px 2.80579px 42.0868px rgba(0, 0, 0, 0.16);
        /* 100px - 200px */
        border-radius: 0 clamp(6.25rem, 17vw, 12.5rem) 0
            clamp(6.25rem, 17vw, 12.5rem);
        /* clips img tag corners */
        overflow: hidden;
    }
    #sbs-867 .cs-picture img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
}
/* Tablet - 768px */
@media only screen and (min-width: 64rem) {
    #sbs-867 {
        padding: var(--sectionPadding);
    }
    #sbs-867 .cs-container {
        flex-direction: row;
        max-width: 80rem;
        justify-content: space-between;
    }
    #sbs-867 .cs-content {
        width: 53%;
        /* reset the padding, add the section padding back to the section container */
        padding: 0;
    }
    #sbs-867 .cs-picture {
        width: 47vw;
        position: relative;
    }
}

 /*-- -------------------------- -->
<---       Side By Side         -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #sbs-598 {
        position: relative;
    }
    #sbs-598 .cs-container {
        width: 100%;
        max-width: 80rem;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 48px - 64px */
        gap: clamp(3rem, 6vw, 4rem);
    }
    #sbs-598 .cs-content {
        /* set text align to left if content needs to be left aligned */
        text-align: left;
        width: 100%;
        max-width: 32.625rem;
        /* moved section padding to cs-content so the cs-background can be full width */
        padding: var(--sectionPadding);
        /* prevents padding and border from affecting height and width */
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        /* centers content horizontally, set to flex-start to left align */
        align-items: flex-start;
    }

    #sbs-598 .cs-text {
        margin-bottom: 1rem;
    }
    #sbs-598 .cs-text:last-of-type {
        margin-bottom: 2rem;
    }
    #sbs-598 .cs-button-solid {
        font-size: 1rem;
        /* 46px - 56px */
        line-height: clamp(2.875rem, 5.5vw, 3.5rem);
        text-decoration: none;
        font-weight: 700;
        text-align: center;
        margin: 0;
        color: #fff;
        min-width: 9.375rem;
        padding: 0 1.5rem;
        background-color: var(--primary);
        border-radius: 0.25rem;
        display: inline-block;
        position: relative;
        z-index: 1;
        /* prevents padding from adding to the width */
        box-sizing: border-box;
    }
    #sbs-598 .cs-button-solid:before {
        content: "";
        position: absolute;
        height: 100%;
        width: 0%;
        background: #000;
        opacity: 1;
        top: 0;
        left: 0;
        z-index: -1;
        border-radius: 0.25rem;
        transition: width 0.3s;
    }
    #sbs-598 .cs-button-solid:hover:before {
        width: 100%;
    }
    #sbs-598 .cs-background {
        display: block;
        position: relative;
        width: 100%;
        height: 16rem;
        z-index: 1;
    }
    #sbs-598 .cs-background img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
    #sbs-598 {
        /* 90px - 150px */
        /* returned section padding to the section container, this Stitch has 1.5X padding top and bottom than the normal Stitch */
        padding: clamp(5.625rem, 9vw, 9.375rem) 1rem;
    }
    #sbs-598 .cs-container {
        flex-direction: row;
        justify-content: flex-end;
    }
    #sbs-598 .cs-background {
        width: 50%;
        height: auto;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 50%;
    }
    #sbs-598 .cs-content {
        width: 45%;
        padding: 0;
    }
}

/*-- -------------------------- -->
<---        Content Page        -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #content-page-713 {
        padding: var(--sectionPadding);
        background-color: #fff;
        /* clips the wave background from causing overflow issues when it goes off screen */
        overflow: hidden;
        position: relative;
        z-index: 1;
    }
    #content-page-713 .cs-container {
        width: 100%;
        max-width: 80rem;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 48px - 64px */
        gap: clamp(3rem, 6vw, 4rem);
        position: relative;
    }
    #content-page-713 .cs-content {
        /* set text align to left if content needs to be left aligned */
        text-align: left;
        width: 100%;
        max-width: 46.125rem;
        display: flex;
        flex-direction: column;
        /* centers content horizontally, set to flex-start to left align */
        align-items: flex-start;
    }
    #content-page-713 .cs-content img {
        width: 100%;
        height: auto;
        margin: 1rem 0;
        display: block;
    }
    #content-page-713 .cs-title {
        font-size: var(--headerFontSize);
        font-weight: 900;
        line-height: 1.2em;
        text-align: inherit;
        width: 100%;
        max-width: 100%;
        margin: 0 0 1rem 0;
        color: var(--headerColor);
        position: relative;
    }
    #content-page-713 h2,
    #content-page-713 h3,
    #content-page-713 h4,
    #content-page-713 h5,
    #content-page-713 h6 {
        font-weight: 700;
        text-align: inherit;
        margin: 0 0 1rem 0;
        color: var(--headerColor);
    }
    #content-page-713 h2 {
        font-size: 2rem;
        margin-top: 2rem;
    }
    #content-page-713 h3 {
        font-size: 1.5rem;
        color: var(--primary);
    }
    #content-page-713 h4,
    #content-page-713 h5,
    #content-page-713 h6 {
        font-size: 1.25rem;
    }
    #content-page-713 .cs-button-solid {
        margin-bottom: 2rem;
    }
    #content-page-713 .cs-color {
        color: var(--primary);
    }
    #content-page-713 p {
        font-size: var(--bodyFontSize);
        line-height: 1.5em;
        text-align: inherit;
        width: 100%;
        margin: 0 0 1rem 0;
        color: var(--bodyTextColor);
    }
    #content-page-713 p:last-of-type {
        margin-bottom: 2rem;
    }
    #content-page-713 p a {
        font-size: inherit;
        line-height: inherit;
        text-decoration: underline;
        color: var(--primary);
    }
    #content-page-713 ol,
    #content-page-713 ul {
        padding-left: 1.5rem;
        margin: 0 0 2rem 0;
        color: var(--bodyTextColor);
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }
    #content-page-713 ul li {
        list-style: none;
        color: inherit;
        position: relative;
    }
    #content-page-713 ul li:before {
        /* custom list bullet */
        content: "";
        width: 3px;
        height: 3px;
        background: currentColor;
        opacity: 1;
        border-radius: 50%;
        position: absolute;
        display: block;
        top: 0.625rem;
        left: -0.75rem;
    }
    #content-page-713 .cs-image-group {
        /* scales the whole section down and ties the font size to the vw and stops at 70% of the vale of 1em, changes at desktop */
        font-size: min(1vw, 1em);
        /* everything inside this box is in ems so we can scale it all down proportionally with a font size */
        width: 33.875em;
        height: 48.3125em;
        display: none;
        /* prevents flexbox from squishing it */
        flex: none;
        position: relative;
        /* flips it horizontally */
        transform: scaleX(-1);
    }
    #content-page-713 .cs-picture {
        width: 33.875em;
        height: 40.4375em;
        border-radius: 17.8125em;
        border: 0.75em solid #ffffff;
        background-color: #f7f7f7;
        /* prevents border from affecting height and width */
        box-sizing: border-box;
        /* clips img tag corners */
        overflow: hidden;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
    }
    #content-page-713 .cs-picture img {
        width: 100%;
        height: 100%;
        /* makes it act like a background image */
        object-fit: cover;
        position: absolute;
        top: 0;
        left: 0;
        /* flips the image to its original orientation */
        transform: scaleX(-1);
    }
    #content-page-713 .cs-flower {
        width: 22.625em;
        height: auto;
        display: block;
        position: absolute;
        bottom: -2.375em;
        right: -3em;
        z-index: -1;
        transform: rotate(142deg);
    }
    #content-page-713 .cs-sense {
        width: 5em;
        height: auto;
        position: absolute;
        top: -0.25em;
        left: 0.625em;
        transform: rotate(90deg);
    }
    #content-page-713 .cs-background {
        display: none;
    }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
    #content-page-713 .cs-container {
        flex-direction: row;
        align-items: flex-start;
    }
    #content-page-713 .cs-image-group {
        display: block;
    }
    #content-page-713 .cs-background {
        width: 20%;
        height: 100%;
        background-color: #f7f7f7;
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        z-index: -1;
    }
    #content-page-713 .cs-background img {
        width: 100%;
        height: 100%;
        opacity: 0.2;
        object-fit: cover;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
    }
}
/* Large Desktop 1300px */
@media only screen and (min-width: 81.25rem) {
    #content-page-713 .cs-image-group {
        /* position absolute so we can have it overflow the container as seen in the design. */
        font-size: inherit;
        position: absolute;
        top: 0rem;
        right: -6.25rem;
    }
    #content-page-713 .cs-background {
        width: 50%;
        /* with the left edge always positioned at the center line, we push left of the center line by 335px.  This ensures that this element will stay exactly in this position no matter how wide the screen gets */
        margin-left: 20.9375rem;
        right: auto;
        /* sets the left edge of the element to be at the center line */
        left: 50%;
    }
}
/*-- -------------------------- -->
<---          Gallery           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #gallery-1446 {
        padding: var(--sectionPadding);
    }
    #gallery-1446 .cs-container {
        width: 100%;
        max-width: 80rem;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 48px - 64px */
        gap: clamp(3rem, 6vw, 4rem);
        position: relative;
    }
    #gallery-1446 .cs-content {
        text-align: left;
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-end;
        gap: 1.5rem;
    }
    #gallery-1446 .cs-title {
        margin: 0;
    }
    #gallery-1446 .cs-gallery {
        width: 100%;
        padding: 0;
        margin: 0;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(19.0625rem, 1fr));
        /* 16px - 20px */
        gap: clamp(1rem, 1.5vw, 1.25rem);
        position: relative;
    }
    #gallery-1446 .cs-image {
        /* 260px - 360px */
        min-height: clamp(16.25rem, 60vw, 20rem);
        border-radius: 1rem;
        /* clips the image corners */
        overflow: hidden;
        display: block;
        position: relative;
    }
    #gallery-1446 .cs-image img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        /* makes it act like a background image */
        object-fit: cover;
    }
}
                                
                                                                                              
/* === Reviews: small 5/5 badge (CSS-only) === */
#reviews-2248 .cs-name {
  /* already a column flex in your CSS; keep it that way */
  position: relative;
}

#reviews-2248 .cs-name::after {
  content: "★★★★★ 5/5";
  font-size: 0.9rem;          /* small; adjust if you want */
  line-height: 1;
  margin-top: 0.15rem;        /* sits right under the name */
  letter-spacing: 0.02em;
  color: var(--primary);      /* matches your site’s accent color */
  display: inline-block;
}