body.dark-mode .cs-button-solid {
    background-color: var(--secondaryLight);
    color: #1a1a1a;
}
body.dark-mode .cs-button-solid:before {
    background-color: #fff;
}
.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;
}
.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;
}
.cs-button-solid:hover:before {
    width: 100%;
}

/* ^^^ remove everything above this comment and place in global stylesheet ^^^ */

/*-- -------------------------- -->
<---          Banner            -->
<--- -------------------------- -*/
/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #Aboutbanner-328 {
        /* 144px - 252px */
        padding-top: clamp(9rem, 25vw, 15.75rem);
        /* 80px - 140px */
        padding-bottom: clamp(5rem, 13vw, 8.75rem);
        position: relative;
        z-index: 1;
    }
    #Aboutbanner-328 .cs-container {
        width: 100%;
        max-width: 80rem;
        margin: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    #Aboutbanner-328 .cs-int-title {
        /* 39px - 49px */
        font-size: clamp(2.4375rem, 4.5vw, 3.0625rem);
        font-weight: 900;
        line-height: 1.2em;
        text-align: center;
        max-width: 43.75rem;
        margin: 0 auto 0.75rem;
        color: var(--bodyTextColorWhite);
        position: relative;
    }
    #Aboutbanner-328 .cs-breadcrumbs {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    #Aboutbanner-328 .cs-link {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 1.5vw, 1rem);
        line-height: 1.2em;
        text-decoration: none;
        color: var(--bodyTextColorWhite);
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    #Aboutbanner-328 .cs-link:hover {
        text-decoration: underline;
    }
    #Aboutbanner-328 .cs-link:last-of-type {
        /* remove the chevron on the last list item */
    }
    #Aboutbanner-328 .cs-link:last-of-type::after {
        display: none;
    }
    #Aboutbanner-328 .cs-link:after {
        /* chevron - added as pseudo to make adding and removing them easier */
        content: "";
        width: 0.4375rem;
        height: 0.75rem;
        margin-left: 0.75rem;
        margin-right: 0.75rem;
        background: url("https://csimg.nyc3.digitaloceanspaces.com/Banners/chevron-right.svg");
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }
    #Aboutbanner-328 .cs-link.cs-active {
        color: var(--primaryLight);
    }
    #Aboutbanner-328 .cs-background {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        z-index: -1;
    }
    #Aboutbanner-328 .cs-background:before {
        /* black overlay box */
        content: "";
        width: 100%;
        height: 100%;
        background: #000;
        opacity: 0.72;
        position: absolute;
        display: block;
        top: 0;
        left: 0;
        z-index: 1;
    }
    #Aboutbanner-328 .cs-background img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        object-fit: cover;
        object-position: top;
    }
}

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

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

    #ABoutRPsbs-328 .cs-text:last-of-type,
    #AboutRPsbsr-328 .cs-text:last-of-type {
        margin-bottom: 2rem;
    }
    #ABoutRPsbs-328 .cs-quote,
    #AboutRPsbsr-328 .cs-quote {
        margin: 0 0 2rem 0;
        /* 16px - 32px */
        padding: clamp(1rem, 3vw, 2rem);
        background-color: #f7f7f7;
        border-radius: 1rem;
        position: relative;
    }
    #ABoutRPsbs-328 .cs-quote-text,
    #AboutRPsbsr-328 .cs-quote-text {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 1.5vw, 1rem);
        line-height: 1.5em;
        margin: 0 0 1rem;
        color: #767676;
        display: block;
    }
    #ABoutRPsbs-328 .cs-name,
    #AboutRPsbsr-328 .cs-name {
        font-size: 1rem;
        line-height: 1.2em;
        text-transform: uppercase;
        font-weight: bold;
        margin: 0 0 0.25rem;
        color: var(--headerColor);
        display: block;
    }
    #ABoutRPsbs-328 .cs-job,
    #AboutRPsbsr-328 .cs-job {
        font-size: 0.875rem;
        line-height: 1.5em;
        color: #767676;
        display: block;
    }
    #ABoutRPsbs-328 .cs-quote-icon,
    #AboutRPsbsr-328 .cs-quote-icon {
        /* 60px - 136px */
        width: clamp(3.75rem, 10vw, 8.5rem);
        height: auto;
        position: absolute;
        bottom: 0rem;
        /* 16px - 32px */
        right: clamp(1rem, 4vw, 2rem);
    }
    #ABoutRPsbs-328 .cs-image-group,
    #AboutRPsbsr-328 .cs-image-group {
        /* scaling the font size with the view width */
        font-size: min(2.31vw, 0.7em);
        /* using ems so we can use font size to scale the whole section */
        width: 39.4375em;
        height: 39.75em;
        position: relative;
    }
    #ABoutRPsbs-328 .cs-picture,
    #AboutRPsbsr-328 .cs-picture {
        border-radius: 1.5em;
        /* clips img tag corners */
        overflow: hidden;
        position: absolute;
        display: block;
    }
    #ABoutRPsbs-328 .cs-picture img,
    #AboutRPsbsr-328 .cs-picture img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        /* makes image act like a background image */
        object-fit: cover;
    }
    #ABoutRPsbs-328 .cs-picture1,
    #AboutRPsbsr-328 .cs-picture1 {
        width: 32.625em;
        height: 36.3125em;
        left: 0;
        top: 0;
    }
    #ABoutRPsbs-328 .cs-picture2,
    #AboutRPsbsr-328 .cs-picture2 {
        width: 25.875em;
        height: 25em;
        background-color: #fff;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 40px;
        /* 6px - 12px */
        border: clamp(0.375em, 1.5vw, 0.75em) solid #ffffff;
        right: 0;
        bottom: 0;
    }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
    #ABoutRPsbs-328 .cs-container,
    #AboutRPsbsr-328 .cs-container {
        flex-flow: row;
        justify-content: space-between;
        gap: 3.25rem;
    }
    #ABoutRPsbs-328 .cs-image-group,
    #AboutRPsbsr-328 .cs-image-group {
        font-size: min(1.2vw, 1em);
        flex: none;
    }
    #ABoutRPsbs-328 .cs-content,
    #AboutRPsbsr-328 .cs-content {
        margin: 0;
    }
}

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

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #AboutRPsbsr-328 {
        background-color: #f7f7f7;
    }
    #AboutRPsbsr-328 .cs-picture1 {
        left: auto;
        right: 0;
    }
    #AboutRPsbsr-328 .cs-picture2 {
        right: auto;
        left: 0;
    }
    #AboutRPsbsr-328 .cs-quote {
        background-color: rgba(0, 0, 0, 0.05);
    }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
    #AboutRPsbsr-328 .cs-image-group {
        /* sends it to the right in the 2nd position */
        order: 2;
    }
}

/*-- -------------------------- -->
<---           Stats            -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #AboutStrip-328 {
        padding: var(--sectionPadding);
        background-color: #1a1a1a;
    }
    #AboutStrip-328 .cs-stat-group {
        width: 100%;
        /* changes to 1280px at desktop */
        max-width: 37.5rem;
        margin: auto;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        gap: 2.5rem;
    }
    #AboutStrip-328 .cs-item {
        list-style: none;
        width: 18.125rem;
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    #AboutStrip-328 .cs-item:hover .cs-picture {
        background-color: #fff;
        box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
        transform: scale(1.05);
    }
    #AboutStrip-328 .cs-picture {
        width: 5rem;
        height: 5rem;
        /* 12px - 20px */
        margin-right: clamp(0.75rem, 3vw, 1.25rem);
        border-radius: 50%;
        border: 1px solid var(--secondaryLight);
        display: flex;
        justify-content: center;
        align-items: center;
        /* prevents flexbox from squishing it */
        flex: none;
        transition:
            background-color 0.3s,
            box-shadow 0.3s,
            transform 0.6s;
    }
    #AboutStrip-328 .cs-flex-group {
        display: flex;
        justify-content: center;
        align-items: flex-start;
        flex-direction: column;
    }
    #AboutStrip-328 .cs-icon {
        width: 2.0625rem;
        height: auto;
    }
    #AboutStrip-328 .cs-header {
        font-size: 1.25rem;
        color: var(--bodyTextColorWhite);
        font-weight: 900;
        line-height: 1.2em;
        margin: 0;
        margin-bottom: 0.75rem;
        display: block;
    }
    #AboutStrip-328 .cs-link,
    #AboutStrip-328 .cs-hours {
        font-size: var(--bodyFontSize);
        line-height: 1.5em;
        text-decoration: none;
        color: #828282;
        display: block;
        transition: color.3s;
    }
    #AboutStrip-328 .cs-link:hover {
        color: var(--primary);
    }
}
/* Tablet - 650px */
@media only screen and (min-width: 40.625rem) {
    #AboutStrip-328 .cs-stat-group {
        flex-direction: row;
        flex-wrap: wrap;
        column-gap: 1.25rem;
        row-gap: 2rem;
    }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
    #AboutStrip-328 .cs-stat-group {
        max-width: 80rem;
        flex-wrap: nowrap;
        justify-content: space-evenly;
    }
}

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

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #Aboutsbs-328 {
        padding: var(--sectionPadding);
        background-color: #f7f7f7;
    }
    #Aboutsbs-328 .cs-container {
        width: 100%;
        /* changes to 1280px at desktop */
        max-width: 34.375rem;
        margin: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        /* 48px - 64px */
        gap: clamp(3rem, 6vw, 4rem);
    }
    #Aboutsbs-328 .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;
    }
    #Aboutsbs-328 .cs-text {
        margin-bottom: 1rem;
    }
    #Aboutsbs-328 .cs-text:last-of-type {
        margin-bottom: 2rem;
    }
    #Aboutsbs-328 .cs-circles {
        width: 100%;
        /* changes at desktop */
        max-width: 23.375rem;
        margin: auto;
        /* 40px - 48px */
        margin-top: clamp(2.5rem, 3vw, 3rem);
        display: flex;
        align-items: flex-start;
        gap: 1.25rem;
    }
    #Aboutsbs-328 .cs-circle {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        flex: 1;
        aspect-ratio: 1;
    }
    #Aboutsbs-328 .cs-ring-wrapper {
        position: relative;
        margin: 0 0 0.5rem 0;
    }
    #Aboutsbs-328 .cs-number {
        /* 20px - 39px */
        font-size: clamp(1.25rem, 3vw, 2.4375rem);
        font-weight: 900;
        /* prevents mouse from interacting with it */
        pointer-events: none;
        line-height: 1.2em;
        color: var(--headerColor);
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    #Aboutsbs-328 .cs-desc {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 1.4vw, 1rem);
        line-height: 1.5em;
        text-align: center;
        width: 100%;
        color: var(--bodyTextColor);
    }
    #Aboutsbs-328 .cs-ring {
        --ring-width: 8px;
        width: calc(100% - var(--ring-width));
        aspect-ratio: 1;
        overflow: visible;
        pointer-events: none;
        rotate: -90deg;
        scale: 1 -1;
    }
    #Aboutsbs-328 .cs-ring circle {
        fill: none;
        stroke: #f7f7f7;
        stroke-width: var(--ring-width);
    }
    #Aboutsbs-328 .cs-ring circle:last-of-type {
        stroke: var(--secondaryLight);
        stroke-linecap: round;
        stroke-dasharray: calc(var(--ratio) * 314%) 314%;
        transition: stroke-dasharray 1s;
    }
    #Aboutsbs-328 .cs-circle:hover .cs-ring {
        --ratio: 0 !important;
    }
    #Aboutsbs-328 .cs-picture {
        /* set font size to scale with view width, stopping at 68% the value of em */
        font-size: min(2.16vw, 0.68em);
        width: 32.5em;
        height: 42.5em;
        /* margin top and bottom to match the exact amount the grey square overflows the parent for consistent spacing */
        margin: 3em 0;
        position: relative;
        display: block;
    }
    #Aboutsbs-328 .cs-picture:before {
        /* grey box */
        content: "";
        width: 100%;
        height: 100%;
        border-radius: 0.75rem;
        background: #bababa;
        opacity: 1;
        position: absolute;
        display: block;
        top: 0;
        left: 0;
        transform: rotate(15deg);
    }
    #Aboutsbs-328 .cs-picture img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        border-radius: 0.625rem;
        object-fit: cover;
    }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
    #Aboutsbs-328 .cs-container {
        max-width: 80rem;
        /* set to horizontal arrangement */
        flex-direction: row;
        justify-content: center;
        /* 77px - 160px */
        gap: clamp(4.8125rem, 11vw, 10rem);
    }
    #Aboutsbs-328 .cs-content {
        text-align: left;
        align-items: flex-start;
    }
    #Aboutsbs-328 .cs-picture {
        font-size: min(1.1vw, 1em);
        margin: 3.5em 0 3.5em 5em;
        /* prevent flexbox from squishing it */
        flex: none;
    }
    #Aboutsbs-328 .cs-circles {
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    #Aboutsbs-328 .cs-ring-wrapper {
        /* breaks the children out of the container.  They can now be arrnaged as if thy are all children of the cs-circle */
        display: contents;
    }
    #Aboutsbs-328 .cs-ring {
        /* make the ring position absolute so it can sit on top of the other elements that are centered relatively in the cs-circle */
        width: 100%;
        height: auto;
        position: absolute;
        top: 0;
        left: 0;
    }
    #Aboutsbs-328 .cs-number {
        /* make the number relative positioning so it and the cs-desc can position themselves around each other */
        position: relative;
        top: auto;
        left: auto;
        transform: none;
    }
    #Aboutsbs-328 .cs-desc {
        position: relative;
        bottom: auto;
        left: auto;
        transform: none;
    }
}

/*-- -------------------------- -->
<---       Meet The Team        -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #AboutMeet-328 {
        padding: var(--sectionPadding);
    }
    #AboutMeet-328 .cs-container {
        width: 100%;
        max-width: 80rem;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        /* 48px - 64px */
        gap: clamp(3rem, 6vw, 4rem);
    }
    #AboutMeet-328 .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;
    }
    #AboutMeet-328 .cs-card-group {
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        gap: 1rem;
    }
    #AboutMeet-328 .cs-item {
        list-style: none;
        width: 100%;
        min-height: 18.875rem;
        position: relative;
        aspect-ratio: 1.08609272;
    }
    #AboutMeet-328 .cs-item:hover .cs-background img {
        transform: scale(1.1);
    }
    #AboutMeet-328 .cs-info {
        padding: 0.625rem 0;
        background-color: rgba(255, 255, 255, 0.06);
        border-radius: 0.5rem;
        -webkit-backdrop-filter: blur(18px);
        backdrop-filter: blur(18px);
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        position: absolute;
        /* 12px - 16px */
        bottom: clamp(0.75rem, 1.4vw, 1rem);
        left: clamp(0.75rem, 1.4vw, 1rem);
        right: clamp(0.75rem, 1.4vw, 1rem);
        z-index: 10;
    }
    #AboutMeet-328 .cs-name {
        font-size: 1.25rem;
        font-weight: 700;
        color: var(--primaryLight);
        line-height: 1.2em;
        margin: 0;
        display: block;
    }
    #AboutMeet-328 .cs-job {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 1.5vw, 1rem);
        line-height: 1.5em;
        color: #fff;
        display: block;
    }
    #AboutMeet-328 .cs-background {
        width: 100%;
        height: 100%;
        border-radius: 0.75rem;
        /* clips the corners of the img tag */
        overflow: hidden;
        position: absolute;
        top: 0;
        left: 0;
        display: block;
    }
    #AboutMeet-328 .cs-background img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        object-fit: cover;
        transition: transform 0.6s;
    }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
    #AboutMeet-328 .cs-card-group {
        max-width: 62.1875rem;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
    }
    #AboutMeet-328 .cs-item {
        aspect-ratio: 0.74172185;
        width: 100%;
        max-width: 19.0625rem;
    }
}

/*-- -------------------------- -->
<---          Contact           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #AboutContact-328 {
        padding: var(--sectionPadding);
        position: relative;
        z-index: 1;
    }
    #AboutContact-328 .cs-container {
        width: 100%;
        /* changes to 1280px at desktop */
        max-width: 34.375rem;
        margin: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        gap: 3.25rem;
    }
    #AboutContact-328 .cs-topper {
        color: var(--secondaryLight);
    }
    #AboutContact-328 .cs-title {
        color: var(--bodyTextColorWhite);
    }
    #AboutContact-328 .cs-content {
        text-align: left;
    }
    #AboutContact-328 .cs-form {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.75rem;
    }
    #AboutContact-328 .cs-label {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 1.5vw, 1rem);
        width: 100%;
        color: #fff;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        gap: 0.25rem;
    }
    #AboutContact-328 .cs-input {
        font-size: 1rem;
        width: 100%;
        height: 3.5rem;
        padding: 0;
        padding-left: 1.5rem;
        border-radius: 0.5rem;
        color: #fff;
        background: rgba(255, 255, 255, 0.12);
        backdrop-filter: blur(15px);
        border: none;
        /* prevents padding from adding to height and width */
        box-sizing: border-box;
    }
    #AboutContact-328 .cs-input::placeholder {
        color: #f7f7f7;
        opacity: 0.5;
    }
    #AboutContact-328 .cs-textarea {
        min-height: 7.5rem;
        padding-top: 1.5rem;
        margin-bottom: 0.75rem;
        font-family: inherit;
    }
    #AboutContact-328 .cs-submit {
        width: 17.6875rem;
        text-transform: uppercase;
        color: var(--headerColor);
        background-color: var(--secondaryLight);
        border: none;
        transition: color 0.3s;
    }
    #AboutContact-328 .cs-submit:hover {
        cursor: pointer;
    }
    #AboutContact-328 .cs-right {
        width: 100%;
        /* 16px - 24px */
        padding: clamp(1rem, 3.5vw, 1.5rem);
        border-radius: 1.5rem;
        background-color: rgba(255, 255, 255, 0.12);
        -webkit-backdrop-filter: blur(15px);
        backdrop-filter: blur(15px);
        display: flex;
        /* prevents padding from adding to height and width */
        box-sizing: border-box;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        /* 24px - 32px */
        gap: clamp(1.5rem, 4vw, 2rem);
    }
    #AboutContact-328 .cs-map {
        width: 100%;
        /* 300px - 425px */
        height: clamp(18.75rem, 63.4vw, 26.5625rem);
        border-radius: 1.5rem;
        /* clips the corners of the img tag */
        overflow: hidden;
        position: relative;
        display: block;
    }
    #AboutContact-328 .cs-map:before {
        content: "";
        position: absolute;
        display: block;
        /* 32px - 48px */
        width: clamp(2rem, 4vw, 3rem);
        height: clamp(2rem, 4vw, 3rem);
        background: url("https://csimg.nyc3.digitaloceanspaces.com/Contact-Page/pin-red.svg");
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        opacity: 1;
        /* 148px - 220px */
        top: clamp(9.25rem, 30.7vw, 13.75rem);
        /* push to the center line of the div */
        left: 50%;
        /* push X amount of pixels from it's current position off the center line */
        margin-left: 0.625rem;
        z-index: 10;
    }
    #AboutContact-328 .cs-map img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
    #AboutContact-328 .cs-contact-group {
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: center;
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }
    #AboutContact-328 .cs-item {
        list-style: none;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }
    #AboutContact-328 .cs-header {
        font-size: 1.25rem;
        line-height: 1.2em;
        font-weight: 700;
        margin-bottom: 0.75rem;
        color: var(--secondaryLight);
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 0.25rem;
    }
    #AboutContact-328 .cs-link {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 1.5vw, 1rem);
        line-height: 1.5em;
        text-decoration: none;
        color: var(--bodyTextColorWhite);
        transition: color 0.3s;
    }
    #AboutContact-328 .cs-link:hover {
        color: var(--secondary);
    }
    #AboutContact-328 .cs-background {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        z-index: -1;
    }
    #AboutContact-328 .cs-background:before {
        /* top right box */
        content: "";
        width: 100%;
        height: 100%;
        background: var(--primary);
        opacity: 0.92;
        position: absolute;
        display: block;
        top: 0;
        left: 0;
        z-index: 1;
    }
    #AboutContact-328 .cs-background img {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
}
/* Tablet - 650px */
@media only screen and (min-width: 40.625rem) {
    #AboutContact-328 .cs-contact-group {
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
    }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
    #AboutContact-328 .cs-container {
        max-width: 80rem;
        flex-direction: row;
        justify-content: space-between;
        gap: 3.25rem;
    }
    #AboutContact-328 .cs-content {
        max-width: 32.625rem;
    }
    #AboutContact-328 .cs-title,
    #AboutContact-328 .cs-topper {
        text-align: left;
        margin-left: 0;
    }
    #AboutContact-328 .cs-title {
        max-width: 32.625rem;
    }
    #AboutContact-328 .cs-email,
    #AboutContact-328 .cs-phone {
        width: 48%;
    }
    #AboutContact-328 .cs-button-solid {
        margin-left: 0;
    }
    #AboutContact-328 .cs-right {
        width: 51.6%;
        max-width: 41.125rem;
        /* prevent flexbox from squishing it */
        flex: none;
    }
}
/* Desktop - 1300px - Parallax Effect */
@media only screen and (min-width: 81.25rem) {
    #AboutContact-328 {
        background: url("https://csimg.nyc3.digitaloceanspaces.com/Contact-Page/round-table.jpg");
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        /* makes parallax effect */
        background-attachment: fixed;
    }
}

/*-- -------------------------- -->
<---          Reviews           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
    #reviews-245 {
        padding: var(--sectionPadding);
        background: #f1f1f4;
    }
    #reviews-245 .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);
    }
    #reviews-245 .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;
    }

    #reviews-245 .cs-card-group {
        width: 100%;
        padding: 0;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        row-gap: 2rem;
    }
    #reviews-245 .cs-item {
        text-align: left;
        list-style: none;
        width: 100%;
        /* max-width set at tablet */
        /* pushes up by the same amount the cs-item-img overlaps the card */
        margin: 3rem 0 0 0;
        /* 16px - 36px left and right */
        /* 24px - 36px on the bottom */
        padding: 3.75rem clamp(1rem, 2.7vw, 2.25rem)
            clamp(1.25rem, 2.7vw, 2.25rem);
        /* prevents padding and border from affecting height and width */
        box-sizing: border-box;
        box-shadow: 0px 20px 39px 0px rgba(0, 0, 0, 0.05);
        border-radius: 0.25rem;
        background: #fff;
        position: relative;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        align-items: center;
    }
    #reviews-245 .cs-item-img {
        width: 4.5rem;
        height: 4.5rem;
        position: absolute;
        top: -3rem;
    }
    #reviews-245 .cs-item-text {
        font-size: 1rem;
        line-height: 1.5em;
        margin: 0 0 1.5rem;
        color: var(--bodyTextColor);
    }
    #reviews-245 .cs-flex-group {
        width: 100%;
        padding-top: 1.5rem;
        border-top: 1px solid #dad9e3;
        display: flex;
        justify-content: flex-end;
        align-items: flex-end;
        flex-wrap: wrap;
    }
    #reviews-245 .cs-reviewer {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 1.4vw, 1rem);
        line-height: 1.5em;
        font-weight: 700;
        width: 40%;
        margin: 0 auto 0 0;
        display: block;
        color: var(--headerColor);
    }
    #reviews-245 .cs-desc,
    #reviews-245 .cs-rating {
        /* 14px - 16px */
        font-size: clamp(0.875rem, 1.4vw, 1rem);
        font-weight: 400;
        line-height: 1.5em;
        color: #7d799c;
        display: block;
    }
    #reviews-245 .cs-rating {
        margin-right: 0.5rem;
    }
    #reviews-245 .cs-item-stars {
        width: 6em;
        height: 1em;
        /* centers it with the rating to the left */
        margin-bottom: 0.1875rem;
    }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
    #reviews-245 .cs-container {
        max-width: 80rem;
    }
    #reviews-245 .cs-card-group {
        flex-direction: row;
        justify-content: center;
        align-items: stretch;
        flex-wrap: wrap;
        /* 16px - 20px */
        column-gap: clamp(1rem, 1.5vw, 1.25rem);
        row-gap: 4rem;
    }
    #reviews-245 .cs-item {
        /* we do this so it's stackable. You can add new any number of reviews you want and they will stack and center in the middle. We dont use grid because if you have an odd number of reviews, they don't stay centered.  They align with their grid lines. If you want 4 reviews in a row, lower the width under 22.5vw to get the desired sizes fit 4 in a row and then stack when you add more*/
        width: clamp(31.5%, 30vw, 32.3%);
        max-width: 25.8125rem;
        align-content: space-between;
    }
    #reviews-245 .cs-flex-group {
        /* push contents to the left */
        justify-content: flex-start;
    }
    #reviews-245 .cs-reviewer {
        width: 100%;
        margin-bottom: 0.5rem;
    }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
    #reviews-245 .cs-flex-group {
        flex-wrap: nowrap;
    }
    #reviews-245 .cs-reviewer {
        margin: 0;
    }
    #reviews-245 .cs-item-stars {
        margin-bottom: 0.3125rem;
    }
}