@font-face {
  font-family: "YoungSerif";
  src: url("./fonts/YoungSerif-Regular.ttf");
  font-style: normal;
}

: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: #b472a6;
  --primaryLight: #d1a0c7;
  --secondary: #72b4a6;
  --secondaryLight: #a0d1c7;
  --headerColor: #2a2a2a;
  --bodyTextColor: #4e4b66;
  --bodyTextColorWhite: #fafbfc;
  /* 13px - 16px */
  --topperFontSize: clamp(0.8125rem, 1.6vw, 1rem);
  /* 31px - 49px */
  --headerFontSize: clamp(1.9375rem, 3.9vw, 3.0625rem);
  --bodyFontSize: clamp(1.1rem, 1.5vw, 1.25rem);
  /* 60px - 100px top and bottom */
  --sectionPadding: clamp(3.75rem, 7.82vw, 6.25rem) 1rem;
}

body {
  margin: 0;
  padding: 0;
  font-family: Arial, Helvetica, sans-serif;
  background: linear-gradient(90deg, #ffe6e6, #ffffff);
}
h1,
h2,
h3 {
  font-family: YoungSerif;
  font-style: italic;
}
*,
*: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: 0.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);
}

/*-- -------------------------- -->
<---     Mobile Navigation      -->
<--- -------------------------- -*/

/* Mobile - 1023px */
@media only screen and (max-width: 1023px) {
  body.cs-open {
    overflow: hidden;
  }
  body.scroll #cs-navigation {
    /* 53px, same height as the cs-top-container */
    transform: translateY(-3.3125rem);
  }
  #cs-navigation {
    width: 100%;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    background-color: #fff;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    position: fixed;
    z-index: 10000;
    transition: transform 0.3s;
  }
  #cs-navigation:before {
    content: "";
    width: 100%;
    height: 0vh;
    background: rgba(0, 0, 0, 0.6);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    position: absolute;
    display: block;
    top: 100%;
    right: 0;
    z-index: -1100;
    opacity: 0;
    transition: height 0.5s, opacity 0.5s;
  }
  #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 {
    transform: translateY(0);
    opacity: 1;
  }
  #cs-navigation .cs-top-bar {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #cs-navigation .cs-top-container {
    width: 100%;
    padding: 1rem 1.5rem;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    background-color: #f7f7f7;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
  }
  #cs-navigation .cs-top-contact {
    width: auto;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    /* 16px - 24px */
    gap: clamp(1rem, 2vw, 1.5rem);
  }
  #cs-navigation .cs-top-link {
    font-size: 0.875rem;
    line-height: 1.5em;
    text-decoration: none;
    margin: 0;
    color: var(--bodyTextColor);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5rem;
    position: relative;
  }
  #cs-navigation .cs-top-link:nth-of-type(2) {
    display: none;
  }
  #cs-navigation .cs-link-icon {
    width: 1rem;
    height: auto;
    display: block;
  }
  #cs-navigation .cs-top-social {
    visibility: visible;
    opacity: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    transition: opacity 0.3s, visibility 0.3s, height 0.3s;
  }
  #cs-navigation .cs-social-link {
    text-decoration: none;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
  }
  #cs-navigation .cs-social-icon {
    width: 1.25rem;
    height: auto;
    display: block;
  }
  #cs-navigation .cs-container {
    width: 100%;
    padding: 1.25rem 1rem;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: relative;
  }
  #cs-navigation .cs-logo {
    width: auto;
    height: 2.5rem;
    margin: 0 auto 0 0;
    padding: 0;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    order: 1;
    z-index: 10;
  }
  #cs-navigation .cs-logo img {
    width: auto;
    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-nav {
    order: 2;
  }
  #cs-navigation .cs-toggle {
    width: 2.875rem;
    height: 2.875rem;
    margin: 0 0 0 auto;
    background-color: var(--primary);
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: transform 0.6s;
  }
  #cs-navigation .cs-toggle.cs-active {
    transform: rotate(180deg);
  }
  #cs-navigation .cs-active .cs-line1 {
    top: 50%;
    transform: translate(-50%, -50%) rotate(225deg);
  }
  #cs-navigation .cs-active .cs-line2 {
    top: 50%;
    transform-origin: center;
    transform: translate(-50%, -50%) translateY(0) rotate(-225deg);
  }
  #cs-navigation .cs-active .cs-line3 {
    bottom: 100%;
    opacity: 0;
  }
  #cs-navigation .cs-box {
    /* 24px - 28px */
    width: clamp(1.5rem, 2vw, 1.75rem);
    height: 0.75rem;
    position: relative;
  }
  #cs-navigation .cs-line {
    width: 100%;
    height: 2px;
    border-radius: 2px;
    background-color: #fafbfc;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  #cs-navigation .cs-line1 {
    top: 0;
    transform-origin: center;
    transition: transform 0.5s, top 0.3s, left 0.3s;
    animation-duration: 0.7s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
    animation-direction: normal;
  }
  #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-fill-mode: forwards;
    animation-direction: normal;
  }
  #cs-navigation .cs-line3 {
    bottom: 0;
    transition: bottom 0.3s, opacity 0.3s;
  }
  #cs-navigation .cs-ul-wrapper {
    width: 100%;
    height: auto;
    padding-bottom: 3rem;
    opacity: 0;
    background-color: #fff;
    box-shadow: inset rgba(0, 0, 0, 0.2) 0px 8px 24px;
    overflow: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: -1;
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.4s, opacity 0.3s;
  }
  #cs-navigation .cs-ul {
    margin: 0;
    padding: 3rem 0 0 0;
    width: 100%;
    height: auto;
    max-height: 65vh;
    overflow: scroll;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
  }
  #cs-navigation .cs-li {
    width: 100%;
    text-align: center;
    list-style: none;
    margin-right: 0;
    /* transition from these values */
    transform: translateY(-4.375rem);
    opacity: 0;
    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.cs-active {
    color: var(--primary);
  }
  #cs-navigation .cs-li-link:hover {
    color: var(--primary);
  }
  #cs-navigation .cs-button-solid {
    display: none;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #cs-navigation .cs-top-link:nth-of-type(2) {
    display: flex;
  }
}

/*-- -------------------------- -->
<---     Navigation Dropdown    -->
<--- -------------------------- -*/

/* Mobile - 1023px */
@media only screen and (max-width: 1023px) {
  #cs-navigation .cs-li {
    text-align: center;
    width: 100%;
    display: block;
  }
  #cs-navigation .cs-dropdown {
    position: relative;
    color: var(--bodyTextColorWhite);
  }
  #cs-navigation .cs-dropdown.cs-active .cs-drop-ul {
    height: auto;
    opacity: 1;
    visibility: visible;
    margin: 0.75rem 0 0 0;
    padding: 0.75rem 0;
  }
  #cs-navigation .cs-dropdown.cs-active .cs-drop-link {
    opacity: 1;
  }
  #cs-navigation .cs-dropdown .cs-li-link {
    position: relative;
    transition: opacity 0.3s;
  }
  #cs-navigation .cs-drop-icon {
    width: 0.9375rem;
    height: auto;
    position: absolute;
    top: 50%;
    right: -1.25rem;
    transform: translateY(-50%);
  }
  #cs-navigation .cs-drop-ul {
    width: 100%;
    height: 0;
    margin: 0;
    padding: 0;
    background-color: var(--primary);
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    transition: padding 0.3s, margin 0.3s, height 0.3s, opacity 0.3s,
      visibility 0.3s;
  }
  #cs-navigation .cs-drop-li {
    list-style: none;
  }
  #cs-navigation .cs-li-link.cs-drop-link {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 2vw, 1.25rem);
    color: #fff;
  }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #cs-navigation .cs-dropdown {
    position: relative;
  }
  #cs-navigation .cs-dropdown:hover {
    cursor: pointer;
  }
  #cs-navigation .cs-dropdown:hover .cs-drop-ul {
    transform: scaleY(1);
    opacity: 1;
    visibility: visible;
  }
  #cs-navigation .cs-dropdown:hover .cs-drop-li {
    opacity: 1;
    transform: translateY(0);
  }
  #cs-navigation .cs-drop-icon {
    width: 0.75rem;
    height: auto;
    margin-left: 0.25rem;
    display: inline-block;
  }
  #cs-navigation .cs-drop-ul {
    min-width: 12.5rem;
    margin: 0;
    padding: 0;
    background-color: #fff;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 10px 16px;
    border-bottom: 5px solid var(--primary);
    /* if you have 8 or more links in your dropdown nav, uncomment the columns property to make the list into 2 even columns. Change it to 3 or 4 if you need extra columns. Then remove the transition delays on the cs-drop-li so they don't have weird scattered animations */
    position: absolute;
    top: 100%;
    z-index: -100;
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.3s, visibility 0.3s, opacity 0.3s;
  }
  #cs-navigation .cs-drop-li {
    list-style: none;
    font-size: 1rem;
    text-decoration: none;
    opacity: 0;
    width: 100%;
    height: auto;
    display: block;
    transform: translateY(-0.625rem);
    transition: opacity 0.6s, transform 0.6s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(1) {
    transition-delay: 0.05s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(2) {
    transition-delay: 0.1s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(3) {
    transition-delay: 0.15s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(4) {
    transition-delay: 0.2s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(5) {
    transition-delay: 0.25s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(6) {
    transition-delay: 0.3s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(7) {
    transition-delay: 0.35s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(8) {
    transition-delay: 0.4s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(9) {
    transition-delay: 0.45s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(10) {
    transition-delay: 0.5s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(11) {
    transition-delay: 0.55s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(12) {
    transition-delay: 0.6s;
  }
  #cs-navigation .cs-drop-li:nth-of-type(13) {
    transition-delay: 0.65s;
  }
  #cs-navigation .cs-li-link.cs-drop-link {
    font-size: 1rem;
    white-space: nowrap;
    line-height: 1.5em;
    text-decoration: none;
    width: 100%;
    padding: 0.75rem;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    color: var(--bodyTextColor);
    display: block;
    transition: color 0.3s, background-color 0.3s;
  }
  #cs-navigation .cs-li-link.cs-drop-link:hover {
    color: var(--primary);
    background-color: #f7f7f7;
  }
  #cs-navigation .cs-li-link.cs-drop-link:before {
    display: none;
  }
}

/*-- -------------------------- -->
<---     Desktop Navigation     -->
<--- -------------------------- -*/

/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  body.scroll #cs-navigation {
    /* 53px, the ssme height as the cs-top-container */
    transform: translateY(-3.3125rem);
  }
  #cs-navigation {
    width: 100%;
    padding: 0;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    background-color: #fff;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    position: fixed;
    z-index: 10000;
    transition: transform 0.3s;
  }
  #cs-navigation .cs-top-bar {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #cs-navigation .cs-top-container {
    width: 100%;
    max-width: 80rem;
    padding: 1rem;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 3.125rem;
    position: relative;
    z-index: 1;
  }
  #cs-navigation .cs-top-container:before {
    /* grey background */
    content: "";
    width: 100vw;
    height: 100%;
    background: #f7f7f7;
    opacity: 1;
    position: absolute;
    display: block;
    top: 0;
    left: 50%;
    z-index: -1;
    transform: translateX(-50%);
  }
  #cs-navigation .cs-top-contact {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1.5rem;
  }
  #cs-navigation .cs-top-link {
    font-size: 0.875rem;
    line-height: 1.5em;
    text-decoration: none;
    margin: 0;
    color: var(--bodyTextColor);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5rem;
    position: relative;
  }
  #cs-navigation .cs-top-link:hover {
    text-decoration: underline;
  }
  #cs-navigation .cs-link-icon {
    width: 1rem;
    height: auto;
    display: block;
  }
  #cs-navigation .cs-top-social {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
  }
  #cs-navigation .cs-social-link {
    text-decoration: none;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: transform 0.3s;
  }
  #cs-navigation .cs-social-link:hover {
    transform: scale(1.1);
  }
  #cs-navigation .cs-social-icon {
    width: 1.25rem;
    height: auto;
    display: block;
  }
  #cs-navigation .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    padding: 0 1rem;
    /* prevents padding from affectin gheight */
    box-sizing: border-box;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1.5rem;
    position: relative;
  }
  #cs-navigation .cs-toggle {
    display: none;
  }
  #cs-navigation .cs-logo {
    /* 40px - 44px */
    height: clamp(2.5rem, 4vw, 2.75rem);
    /* 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: auto;
    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;
    gap: 3rem;
  }
  #cs-navigation .cs-li {
    list-style: none;
    padding: 1.9375rem 0;
    /* prevent flexbox from squishing it */
    flex: none;
  }
  #cs-navigation .cs-li-link {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.3vw, 1rem);
    line-height: 1.5em;
    text-decoration: none;
    margin: 0;
    color: var(--headerColor);
    display: block;
    position: relative;
    transition: color 0.3s;
  }
  #cs-navigation .cs-li-link:hover {
    color: var(--primary);
  }
  #cs-navigation .cs-li-link.cs-active {
    font-weight: 700;
    color: var(--headerColor);
  }
  #cs-navigation .cs-button-solid {
    font-size: 1rem;
    /* 46px - 56px */
    line-height: clamp(2.875em, 5.5vw, 3.5em);
    text-decoration: none;
    font-weight: 700;
    text-align: center;
    margin: 0;
    color: #fff;
    padding: 0 2rem;
    background-color: var(--primary);
    overflow: hidden;
    display: inline-block;
    position: relative;
    z-index: 1;
    /* prevents padding from adding to the width */
    box-sizing: border-box;
    transition: color 0.3s;
  }
  #cs-navigation .cs-button-solid:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 0%;
    background: #1a1a1a;
    opacity: 1;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width 0.3s;
  }
  #cs-navigation .cs-button-solid:hover:before {
    width: 100%;
  }
  #cs-navigation .cs-nav-button {
    line-height: 2.875rem;
    margin-left: 1.5rem;
  }
}

/*-- -------------------------- -->
<---          Hero              -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #hero-1932 {
    width: 100%;
    padding: var(--sectionPadding);
    background-color: #faf6f2;
    overflow: hidden;
    position: relative;
    z-index: 1;
    padding-top: 200px;
  }
  #hero-1932:before {
    content: "";
    width: 100%;
    height: 100%;
    background: #f6eddf;
    opacity: 0.84;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
  }
  #hero-1932 .cs-container {
    width: 100%;
    /* changes to 1280px at desktop */
    max-width: 36.5rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* 48px - 80px */
    gap: clamp(3rem, 6vw, 5rem);
  }
  #hero-1932 .cs-content {
    /* set text align to left if content needs to be left aligned */
    text-align: left;
    width: 100%;
    max-width: 35.625rem;
    display: flex;
    flex-direction: column;
    /* centers content horizontally, set to flex-start to left align */
    align-items: flex-start;
    position: relative;
    z-index: 3;
  }
  #hero-1932 .cs-topper {
    color: var(--secondary);
  }
  #hero-1932 .cs-text {
    margin-bottom: 0.75rem;
  }
  #hero-1932 .cs-text:last-of-type {
    margin-bottom: 2rem;
  }
  #hero-1932 .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;
    background-color: var(--primary);
    overflow: hidden;
    color: #fff;
    border: none;
    border-radius: 6.25rem;
    display: inline-block;
    position: relative;
    z-index: 1;
    transition: color 0.3s;
  }
  #hero-1932 .cs-button-solid:before {
    content: "";
    width: 0;
    height: 100%;
    background: #000;
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width 0.3s;
  }
  #hero-1932 .cs-button-solid:hover {
    color: #fff;
  }
  #hero-1932 .cs-button-solid:hover:before {
    width: 100%;
  }
  #hero-1932 .cs-info {
    width: 100%;
    margin-top: clamp(3rem, 6vw, 5rem);
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 1rem;
  }
  #hero-1932 .cs-info-pic {
    width: 6.9375em;
    height: 4.8125em;
    border-radius: 1rem;
    position: relative;
  }
  #hero-1932 .cs-wrapper {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
  }
  #hero-1932 .cs-address {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2em;
    color: var(--headerColor);
    display: block;
  }
  #hero-1932 .cs-icon {
    width: 1.5rem;
    height: auto;
    margin-right: 0.25rem;
  }
  #hero-1932 .cs-slogan {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5em;
    color: var(--bodyTextColor);
    display: block;
  }
  #hero-1932 .cs-image-group {
    font-size: min(2.29vw, 0.9rem);
    width: 34.9375em;
    height: 42.5em;
    display: block;
    position: relative;
    z-index: 2;
  }
  #hero-1932 .cs-picture {
    width: 32.625em;
    height: 42.5em;
    box-sizing: border-box;
    background-color: #dab692;
    overflow: hidden;
    border: 8px solid #dab692;
    border-radius: 16.25rem;
    position: absolute;
    left: 0;
    z-index: -1;
  }
  #hero-1932 .cs-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    transition: transform 0.7s;
  }
  #hero-1932 .cs-graphic {
    height: auto;
    position: absolute;
  }
  #hero-1932 .cs-peach {
    width: 5.375em;
    height: auto;
    top: 0.375em;
    left: 5.6875em;
  }
  #hero-1932 .cs-swirl {
    width: 9.8125em;
    height: auto;
    top: 1.5625em;
    left: 0;
    z-index: 0;
  }
  #hero-1932 .cs-dots {
    width: 15.375em;
    height: auto;
    bottom: 0;
    right: 0;
    z-index: -10;
  }
  #hero-1932 .cs-leaf {
    width: 13.4375em;
    height: auto;
    left: 0;
    bottom: 0;
  }
  #hero-1932 .cs-button {
    width: 10em;
    height: auto;
    top: 25.5em;
    right: 0;
  }
  #hero-1932 .cs-info-text {
    /* 14px - 20px */
    font-size: clamp(0.875rem, 3.5vw, 1.25rem);
    font-weight: 600;
    line-height: 1.6em;
    text-align: center;
    max-width: 13.9375em;
    margin: 0;
    color: var(--bodyTextColorWhite);
  }
  #hero-1932 .cs-brown-lines {
    width: 46.625em;
    height: auto;
    right: 20.6875em;
    top: 24.6875em;
    z-index: -10;
    transform: rotate(-36deg);
  }
  #hero-1932 .cs-background {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
  #hero-1932 .cs-background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #hero-1932 .cs-container {
    max-width: 80rem;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
  }
  #hero-1932 .cs-content {
    /* 48px - 64px */
    padding: clamp(3rem, 5vw, 4rem) 0;
    order: 2;
  }
  #hero-1932 .cs-image-group {
    font-size: min(1.27vw, 1rem);
    height: auto;
    min-height: 42.5em;
    flex: none;
  }
  #hero-1932 .cs-picture {
    height: 100%;
  }
}
/* Large Desktop - 1600px */
@media only screen and (min-width: 100rem) {
  #hero-1932 .cs-background {
    background: url("https://csimg.nyc3.cdn.digitaloceanspaces.com/Images/MISC/dermatology-banner.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
  }
  #hero-1932 .cs-background img {
    display: none;
  }
}

/*-- -------------------------- -->
<---         Services           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #services-1829 {
    padding: var(--sectionPadding);
    overflow: hidden;
    position: relative;
  }
  #services-1829:before {
    content: "";
    width: 100%;
    height: 100%;
    /* background: #f6eddf; */
    opacity: 0.9;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
  #services-1829 .cs-container {
    width: 100%;
    max-width: 55rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
    position: relative;
  }
  #services-1829 .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;
    z-index: 1;
  }
  #services-1829 .cs-title {
    max-width: none;
  }
  #services-1829 .cs-card-group {
    width: 100%;
    /* changes to 100% at tablet */
    max-width: 22.5rem;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    flex-direction: column;
    align-items: stretch;
    /* 16px - 20px */
    gap: clamp(1rem, 2vw, 1.25rem);
  }
  #services-1829 .cs-item {
    list-style: none;
    width: 100%;
    box-sizing: border-box;
    /* 368px - 428px, changes to a clamp at desktop */
    padding-top: clamp(23rem, 60vw, 26.75rem);
    border-radius: 16.25rem;
    overflow: hidden;
    grid-column: span 12;
    position: relative;
    z-index: 1;
  }
  #services-1829 .cs-item:before {
    /* color border */
    content: "";
    border-radius: 16.25rem;
    border: 5px solid var(--primary);
    opacity: 0.3;
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    z-index: 2;
    /* prevents mouse from interacting with it */
    pointer-events: none;
  }
  #services-1829 .cs-item:after {
    /* color border white bg */
    content: "";
    border-radius: 16.25rem;
    border: 5px solid #fff;
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    z-index: 1;
    /* prevents mouse from interacting with it */
    pointer-events: none;
  }
  #services-1829 .cs-item:hover .cs-flex:before {
    opacity: 1;
  }
  #services-1829 .cs-item:hover .cs-h3,
  #services-1829 .cs-item:hover .cs-job {
    color: var(--bodyTextColorWhite);
  }
  #services-1829 .cs-item:hover .cs-picture img {
    transform: scale(1.1);
  }
  #services-1829 .cs-link {
    text-decoration: none;
    height: 100%;
    display: flex;
    align-items: stretch;
    justify-content: stretch;
  }
  #services-1829 .cs-flex {
    text-align: center;
    width: 100%;
    padding: 1rem 0 1.5rem 0;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 1;
  }
  #services-1829 .cs-flex:before {
    /* background color */
    content: "";
    width: 100%;
    height: 100%;
    background-color: var(--primary);
    opacity: 0.3;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: opacity 0.3s;
  }
  #services-1829 .cs-h3 {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2em;
    width: 70%;
    margin: 0;
    color: var(--headerColor);
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    z-index: 1;
  }
  #services-1829 .cs-picture {
    width: auto;
    height: 100%;
    box-sizing: border-box;
    /* clips img tag from overflowing it on hover */
    overflow: hidden;
    object-fit: cover;
    display: block;
    position: absolute;
    top: 1px;
    right: 1px;
    left: 1px;
    z-index: -4;
  }
  #services-1829 .cs-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    transition: transform 0.7s;
  }
  #services-1829 .cs-background {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
  #services-1829 .cs-background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* makes the top of the image start at the top of the parent */
    object-position: top;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: none; /* Removes Graphic */
  }
  #services-1829 .cs-graphic1 {
    /* 200px - 548px */
    width: clamp(12.5rem, 30vw, 34.25rem);
    height: auto;
    opacity: 0.5;
    display: block;
    position: absolute;
    top: calc(0 / 16 * 1rem);
    left: 0;
    z-index: 0;
  }
  #services-1829 .cs-graphic2 {
    width: calc(548 / 16 * 1rem);
    height: auto;
    opacity: 0.5;
    display: block;
    position: absolute;
    right: 0;
    bottom: calc(0 / 16 * 1rem);
    z-index: 0;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #services-1829:before {
    /* background: linear-gradient(
      89deg,
      rgba(255, 243, 236, 0.9) 44.46%,
      rgba(255, 243, 236, 0) 78.47%
    );
    opacity: 1; */
  }
  #services-1829 .cs-card-group {
    width: 60%;
    max-width: 100%;
  }
  #services-1829 .cs-item {
    height: auto;
    /* 216px - 336px */
    padding-top: clamp(13.5rem, 23vw, 21rem);
    align-items: stretch;
    grid-column: span 6;
  }
  #services-1829 .cs-flex {
    height: auto;
  }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #services-1829 .cs-container {
    max-width: 80rem;
  }
  #services-1829 .cs-card-group {
    width: 100%;
  }
  #services-1829 .cs-item {
    grid-column: span 3;
  }
}
/* Large Desktop - 1920px */
@media only screen and (min-width: 120rem) {
  #services-1829 .cs-graphic1 {
    margin-right: calc(400 / 16 * 1rem);
    left: auto;
    right: 50%;
  }
  #services-1829 .cs-graphic2 {
    margin-left: calc(420 / 16 * 1rem);
    right: auto;
    left: 50%;
  }
}

/*-- -------------------------- -->
<---          Steps             -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #steps-1893 {
    padding: var(--sectionPadding);
    /* background-color: #f6eddf; */
    background: linear-gradient(90deg, #ffe6e6, #ffffff);
    overflow: hidden;
    position: relative;
    z-index: 1;
  }
  #steps-1893 .cs-container {
    width: 100%;
    /* changes to 1280px at desktop */
    max-width: 44rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2rem;
  }
  #steps-1893 .cs-image-group {
    font-size: min(2.24vw, 0.9rem);
    width: 30.125em;
    height: 38.5em;
    display: block;
    position: relative;
    z-index: 1;
  }
  #steps-1893 .cs-picture {
    width: 25.8125em;
    height: 37.0625em;
    margin-top: 1.5em;
    box-sizing: border-box;
    background-color: #dab692;
    overflow: hidden;
    border: 8px solid #dab692;
    border-radius: 16.25rem;
    position: absolute;
    right: 0;
    z-index: -1;
  }
  #steps-1893 .cs-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    transition: transform 0.7s;
  }
  #steps-1893 .cs-graphic {
    height: auto;
    position: absolute;
  }
  #steps-1893 .cs-brown {
    width: 10.3125em;
    height: auto;
    top: 1.25em;
    left: 1.5em;
    z-index: -2;
    transform: rotate(140deg);
  }
  #steps-1893 .cs-peach {
    width: 4.3125em;
    height: auto;
    top: 1em;
    left: 8.75em;
    transform: rotate(-40deg);
  }
  #steps-1893 .cs-leaf {
    width: 14em;
    height: auto;
    bottom: 0em;
    right: 1em;
    z-index: 1;
  }
  #steps-1893 .cs-dots {
    width: 16.3125em;
    height: auto;
    left: 1em;
    bottom: 1em;
    z-index: -2;
  }
  #steps-1893 .cs-lines {
    width: 15.375em;
    right: 0;
    bottom: 0em;
  }
  #steps-1893 .cs-wrapper {
    display: flex;
    flex-direction: column;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
  }
  #steps-1893 .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;
  }
  #steps-1893 .cs-topper {
    color: var(--secondary);
  }
  #steps-1893 .cs-title {
    margin: 0;
  }
  #steps-1893 .cs-card-group {
    margin: 0;
    padding: 0;
    display: grid;
    align-items: stretch;
    grid-auto-flow: row;
    /* 24px - 32px */
    gap: clamp(1.5rem, 3vw, 2rem);
  }
  #steps-1893 .cs-item {
    list-style: none;
    padding-bottom: 2rem;
    border-bottom: #ded1bd 1px solid;
    display: flex;
    align-items: flex-start;
    /* 16px - 24px */
    gap: clamp(1rem, 2vw, 1.5rem);
    position: relative;
  }
  #steps-1893 .cs-item:last-of-type {
    border-bottom: none;
  }
  #steps-1893 .cs-number {
    /* 49px - 72px */
    font-size: clamp(3.0625rem, 6vw, 4.5rem);
    font-weight: 900;
    line-height: 1.1875em;
    color: var(--primary);
    opacity: 0.2;
    display: block;
  }
  #steps-1893 .cs-h3 {
    /* 20px - 25px */
    font-size: clamp(1.25rem, 2.5vw, 1.5625rem);
    font-weight: 700;
    line-height: 1.125em;
    margin: 0 0 0.75rem 0;
    color: var(--headerColor);
  }
  #steps-1893 .cs-item-text {
    font-size: 1rem;
    line-height: 1.5em;
    text-align: left;
    margin: 0;
    color: var(--bodyTextColor);
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #steps-1893 .cs-container {
    max-width: 80rem;
    flex-direction: row;
    align-items: stretch;
    /* 48px - 60px */
    gap: clamp(3rem, 6vw, 3.75rem);
  }
  #steps-1893 .cs-card-group {
    /* 16px - 32px */
    gap: clamp(1rem, 3vw, 2rem);
  }
  #steps-1893 .cs-item {
    flex-direction: row;
  }
  #steps-1893 .cs-image-group {
    font-size: min(1.5vw, 1rem);
    height: auto;
    min-height: 38.5em;
    flex: none;
    /* sends it to the right in the 2nd position */
    order: 2;
  }
  #steps-1893 .cs-picture {
    height: 96.266234%;
  }
}

/*-- -------------------------- -->
<---       Why Choose Us        -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #why-choose-1882 {
    /* prevents padding from affecting height and  */
    box-sizing: border-box;
    padding: var(--sectionPadding);
    padding-bottom: 0;
    /* background-color: #f4e7d8; */
    background: linear-gradient(90deg, #ffe6e6, #ffffff);
    overflow: hidden;
    position: relative;
    z-index: 1;
  }
  #why-choose-1882 .cs-container {
    width: 100%;
    /* changes to 1280px at desktop */
    max-width: 58.75rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
  }
  #why-choose-1882 .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;
    z-index: 1;
  }
  #why-choose-1882 .cs-title {
    max-width: 20ch;
  }
  #why-choose-1882 .cs-card-group {
    width: 100%;
    margin: 0;
    padding: 0;
    display: grid;
    justify-content: center;
    /* 8px - 20px */
    gap: clamp(0.5rem, 3vw, 1.25rem);
    z-index: 1;
  }
  #why-choose-1882 .cs-item {
    list-style: none;
    width: 100%;
    margin: 0;
    box-sizing: border-box;
    /* 24px - 32px */
    padding: clamp(1.5rem, 1vw, 2rem);
    background-color: #fff;
    border-radius: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  #why-choose-1882 .cs-item-group {
    display: flex;
    align-items: center;
    gap: 1rem;
  }
  #why-choose-1882 .cs-icon {
    width: auto;
    height: 2rem;
    display: block;
  }
  #why-choose-1882 .cs-h3 {
    font-size: 1.25rem;
    line-height: 1.2em;
    margin: 0;
    color: var(--headerColor);
  }
  #why-choose-1882 .cs-item-text {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    line-height: 1.5em;
    text-align: inherit;
    margin: 0;
    color: var(--bodyTextColor);
  }
  #why-choose-1882 .cs-image-group {
    width: 100%;
    max-width: 24.5625rem;
    height: auto;
    display: block;
    position: relative;
    z-index: 1;
  }
  #why-choose-1882 .cs-image {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 1;
  }
  #why-choose-1882 .cs-image img {
    width: 100%;
    height: auto;
  }
  #why-choose-1882 .cs-graphic {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 0;
    transform: translateX(-50%);
  }
  #why-choose-1882 .cs-background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -2;
    display: none; /* Remove Graphic */
  }
  #why-choose-1882 .cs-background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  #why-choose-1882 .cs-background::before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #f6eddf;
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;
  }
  #why-choose-1882 .cs-floater {
    font-size: 1rem;
    width: 34.25em;
    height: 29.8125em;
    display: none;
    position: absolute;
    z-index: 0;
  }
  #why-choose-1882 .cs-floater-top {
    top: 0;
    left: 0;
  }
  #why-choose-1882 .cs-floater-bottom {
    right: 0;
    bottom: 0;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #why-choose-1882 .cs-card-group {
    grid-template-columns: repeat(2, 1fr);
  }
  #why-choose-1882 .cs-floater-bottom {
    display: block;
  }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #why-choose-1882 {
    padding: var(--sectionPadding);
  }
  #why-choose-1882 .cs-container {
    max-width: 80rem;
  }
  #why-choose-1882 .cs-card-group {
    /* makes sure the card group always has a minimum height to keep the section tall enough so the absolutely positioned image group never overlaps the content at the top. */
    min-height: 25rem;
  }
  #why-choose-1882 .cs-image-group {
    height: 78%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    /* 60px - 100px, same as the section padding clamp values */
    bottom: calc(clamp(3.75rem, 7.82vw, 6.25rem) * -1);
    left: 50%;
    z-index: -1;
    transform: translateX(-50%);
  }
  #why-choose-1882 .cs-image-group .cs-image {
    height: 100%;
    width: auto;
  }
  #why-choose-1882 .cs-image-group .cs-image img {
    height: 100%;
    width: auto;
  }
  #why-choose-1882 .cs-card-group {
    justify-content: center;
    align-items: stretch;
  }
  #why-choose-1882 .cs-item {
    width: 31vw;
    max-width: 25.8125rem;
    position: relative;
  }
  #why-choose-1882 .cs-item:nth-of-type(even) {
    justify-self: flex-end;
  }
  #why-choose-1882 .cs-floater-top {
    display: block;
  }
}
/* Large Desktop - 1600px */
@media only screen and (min-width: 100rem) {
  #why-choose-1882 .cs-floater-top {
    margin-right: 26rem;
    right: 50%;
    left: initial;
  }
  #why-choose-1882 .cs-floater-bottom {
    margin-left: 26rem;
    right: initial;
    left: 50%;
  }
}

/*-- -------------------------- -->
<---          Pricing           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #pricing-862 {
    padding: var(--sectionPadding);
  }
  #pricing-862 .cs-container {
    width: 100%;
    /* changes to 1280px at tablet */
    max-width: 31.25rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
    position: relative;
  }
  #pricing-862 .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;
  }

  #pricing-862 .cs-title {
    /* 20 characters wide including spaces */
    max-width: 25ch;
  }
  #pricing-862 .cs-text {
    max-width: 56.25rem;
  }
  #pricing-862 .cs-toggle-group {
    width: auto;
    margin: 2rem auto 0;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #pricing-862 .cs-plan {
    font-size: 1rem;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
    color: var(--headerColor);
  }
  #pricing-862 .cs-plan:hover {
    cursor: pointer;
  }
  #pricing-862 .cs-toggle {
    width: 3.875rem;
    height: 2.25rem;
    border-radius: 2.5rem;
    background-color: var(--primaryLight);
    margin: 0 0.75rem;
    position: relative;
    /* prevent flexbox from squishing it */
    flex: none;
  }
  #pricing-862 .cs-toggle:hover {
    cursor: pointer;
  }
  #pricing-862 .cs-toggle.active:before {
    opacity: 1;
  }
  #pricing-862 .cs-toggle.active .cs-toggle-switch {
    left: 2rem;
  }
  #pricing-862 .cs-toggle:before {
    /* top right box */
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #ffba43 -24.69%, #e12213 126.23%);
    opacity: 0;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    border-radius: 2.5rem;
    transition: opacity 0.3s;
  }
  #pricing-862 .cs-toggle-switch {
    width: 1.5rem;
    height: 1.5rem;
    display: block;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0.375rem;
    transition: left 0.3s;
    background: #fff;
  }
  #pricing-862 .cs-card-group {
    width: 100%;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    /* 16px - 20px */
    gap: clamp(1rem, 1.8vw, 1.25rem);
    perspective: 700px;
    transform-style: preserve-3d;
  }
  #pricing-862 .cs-card-group.active.cs-option1 {
    /* when the active class is on the cs-card-group, run these styles */
    transform: scale(0);
    position: absolute;
    left: 0;
    bottom: 0;
    opacity: 0;
    visibility: hidden;
  }
  #pricing-862 .cs-card-group.active.cs-option1 .cs-item {
    /* when the active class is on the cs-card-group, run these styles */
    opacity: 0;
    transform: translateY(1.25rem) rotateY(90deg);
    transition: opacity 0.3s, transform 0.6s;
  }
  #pricing-862 .cs-card-group.active.cs-option2 {
    /* when the active class is on the cs-card-group, run these styles */
    visibility: visible;
    pointer-events: all;
    opacity: 1;
    position: relative;
    left: auto;
    bottom: auto;
    transform: scale(1);
  }
  #pricing-862 .cs-card-group.active.cs-option2 .cs-item {
    /* when the active class is on the cs-card-group, run these styles */
    opacity: 1;
    transform: translateY(0rem) rotateY(0deg);
  }
  #pricing-862 .cs-option1 {
    /* default styles when there is no active class on the cs-card-group */
    opacity: 1;
    visibility: visible;
    left: left;
    bottom: auto;
    transform: scale(1);
    transform-origin: left top;
    transition: transform 0.6s, opacity 0.3s, visibility 0.3s;
  }
  #pricing-862 .cs-option1 .cs-item {
    /* default styles when there is no active class on the cs-card-group */
    opacity: 1;
    transform: translateY(0rem) rotateY(0deg);
    transition: opacity 0.3s, transform 0.6s;
  }
  #pricing-862 .cs-option1 .cs-item:nth-of-type(2) {
    transition-delay: 0.2s;
  }
  #pricing-862 .cs-option1 .cs-item:nth-of-type(3) {
    transition-delay: 0.4s;
  }
  #pricing-862 .cs-option2 {
    /* default styles when there is no active class on the cs-card-group */
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
    position: absolute;
    left: 0;
    bottom: 0;
    transform: scale(0);
    transform-origin: left top;
    transition: transform 0.6s, opacity 0.3s, visibility 0.3s;
  }
  #pricing-862 .cs-option2 .cs-item {
    /* default styles when there is no active class on the cs-card-group */
    opacity: 0;
    transform: translateY(1.25rem) rotateY(90deg);
    transition: opacity 0.3s, transform 0.6s;
  }
  #pricing-862 .cs-option2 .cs-item:nth-of-type(2) {
    transition-delay: 0.2s;
  }
  #pricing-862 .cs-option2 .cs-item:nth-of-type(3) {
    transition-delay: 0.4s;
  }
  #pricing-862 .cs-item {
    list-style: none;
    width: 100%;
    margin: 0;
    /* 20px - 32px left & right */
    /* 20px - 32px bottom */
    padding: 0 clamp(1.25rem, 3vw, 2rem) clamp(1.25rem, 3vw, 2rem);
    /* prevent padding from affecting height and width */
    box-sizing: border-box;
    background-color: #fff;
    border: 1px solid #f4f4f4;
    /* clips corners */
    overflow: hidden;
    border-radius: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    grid-column: span 12;
  }
  #pricing-862 .cs-item.cs-popular .cs-background {
    background-color: #1a1a1a;
  }
  #pricing-862 .cs-item.cs-popular .cs-background img {
    opacity: 1;
  }
  #pricing-862 .cs-item.cs-popular .cs-package {
    color: var(--primary);
  }
  #pricing-862 .cs-item.cs-popular .cs-price,
  #pricing-862 .cs-item.cs-popular .cs-desc {
    color: var(--bodyTextColorWhite);
  }
  #pricing-862 .cs-item.cs-popular .cs-desc {
    opacity: 0.8;
  }
  #pricing-862 .cs-top {
    padding: 2.5rem 0;
    /* prevents padding and border from affecting height and width */
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
    position: relative;
    z-index: 1;
  }
  #pricing-862 .cs-background {
    background-color: #fef7f4;
    position: absolute;
    top: 0;
    bottom: 0;
    /* same as cs-item padding left and right */
    left: -2rem;
    right: -2rem;
    z-index: -1;
  }
  #pricing-862 .cs-background img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    opacity: 0;
  }
  #pricing-862 .cs-package {
    font-size: 1rem;
    line-height: 1.2em;
    text-align: center;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 700;
    width: 100%;
    margin: 0;
    color: #767676;
    display: block;
  }
  #pricing-862 .cs-price {
    /* 39px - 49px */
    font-size: clamp(2.4375rem, 5vw, 3.0625rem);
    line-height: 1.2em;
    text-align: center;
    font-weight: 900;
    margin: 0;
    color: var(--headerColor);
    display: block;
    /* so it's even with the bottom of the cs-desc */
    transform: translateY(0.5625rem);
  }
  #pricing-862 .cs-desc {
    font-size: 1rem;
    line-height: 1.2em;
    text-align: center;
    margin: 0 0 0 0.5rem;
    color: var(--bodyTextColor);
    opacity: 0.8;
    display: block;
  }
  #pricing-862 .cs-ul {
    /* 24px - 40px */
    margin: clamp(1.5rem, 4vw, 2.5rem) 0 2rem 0;
    padding: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }
  #pricing-862 .cs-li {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    list-style: none;
    line-height: 1.2em;
    width: 100%;
    margin: 0;
    padding: 0;
    color: var(--bodyTextColor);
    display: flex;
    justify-content: space-between;
    /* push everything to the top so if the li goes to two lines the icon stays at the top */
    align-items: flex-start;
    gap: 1rem;
  }
  #pricing-862 .cs-li.cs-disabled {
    opacity: 0.4;
    filter: grayscale(1);
  }
  #pricing-862 .cs-icon {
    width: 1.125rem;
    height: auto;
    display: block;
  }
  #pricing-862 .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;
  }
  #pricing-862 .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;
  }
  #pricing-862 .cs-button-solid:hover:before {
    width: 100%;
  }
  #pricing-862 .cs-price-button {
    /* pushes up against the cs-ul so if there's loess li's in the list, the button always pushes itself to the bottom */
    margin-top: auto;
    width: 100%;
    border-radius: 0;
  }
  #pricing-862 .cs-price-button:before {
    border-radius: 0;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #pricing-862 .cs-container {
    max-width: 80rem;
  }
  #pricing-862 .cs-item {
    grid-column: span 6;
  }
  #pricing-862 .cs-item.cs-popular {
    grid-column: span 12;
    order: -1;
  }
}
/* Tablet - 900px */
@media only screen and (min-width: 59.375rem) {
  #pricing-862 .cs-item {
    grid-column: span 4;
  }
  #pricing-862 .cs-item.cs-popular {
    grid-column: span 4;
    order: initial;
  }
}

/*-- -------------------------- -->
<---          Footer            -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #cs-footer-1862 {
    padding: var(--sectionPadding);
    padding-bottom: 2.5rem;
    background-color: #f6eddf;
  }
  #cs-footer-1862 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #cs-footer-1862 .cs-top {
    width: 100%;
    /* 48px - 64px */
    margin-bottom: clamp(3rem, 6vw, 4rem);
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    /* 64px - 100px */
    column-gap: clamp(4rem, 9vw, 6.25rem);
    row-gap: 2rem;
  }
  #cs-footer-1862 .cs-flex {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /* 32px - 48px */
    gap: clamp(2rem, 4vw, 3rem);
  }
  #cs-footer-1862 .cs-logo {
    width: 100%;
    max-width: 19.8125rem;
    height: auto;
  }
  #cs-footer-1862 .cs-logo img {
    width: 100%;
    height: auto;
  }
  #cs-footer-1862 .cs-social {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
  }
  #cs-footer-1862 .cs-social-li {
    list-style: none;
  }
  #cs-footer-1862 .cs-social-link {
    width: 2.5rem;
    height: auto;
    padding: 0.75rem;
    background-color: #ded1bd;
    border-radius: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color 0.3s;
  }
  #cs-footer-1862 .cs-social-link:hover {
    background-color: var(--primary);
  }
  #cs-footer-1862 .cs-social-link:hover .cs-social-icon {
    filter: grayscale(1) brightness(1000%);
  }
  #cs-footer-1862 .cs-social-icon {
    width: 1rem;
    height: 1rem;
    display: block;
  }
  #cs-footer-1862 .cs-ul {
    width: auto;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  #cs-footer-1862 .cs-contact-ul {
    width: 100%;
    max-width: 100%;
    gap: 0.5rem;
  }
  #cs-footer-1862 .cs-li {
    list-style: none;
    margin: 0;
    display: block;
  }
  #cs-footer-1862 .cs-header {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2em;
    /* 16px - 24px bottom */
    margin: 0 0 clamp(1rem, 3.5vw, 1.5rem) 0;
    color: var(--headerColor);
    display: block;
  }
  #cs-footer-1862 .cs-link,
  #cs-footer-1862 .cs-li {
    font-size: 1rem;
    line-height: 1.5em;
    text-decoration: none;
    margin: 0;
    color: var(--bodyTextColor);
    display: block;
    position: relative;
    z-index: 1;
  }
  #cs-footer-1862 .cs-link:hover:before {
    width: 100%;
  }
  #cs-footer-1862 .cs-link:before {
    /* on hover underline */
    content: "";
    width: 0%;
    height: 1px;
    background: currentColor;
    opacity: 1;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    transition: width 0.3s;
  }
  #cs-footer-1862 .cs-bottom {
    width: 100%;
    margin: 0;
    /* 20px - 40px top */
    padding: clamp(1.25rem, 5vw, 2.5rem) 0 0 0;
    border-top: 1px solid #ded1bd;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
  }
  #cs-footer-1862 .cs-nav {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    /* 20px - 40px */
    column-gap: clamp(1.25rem, 5.3vw, 2.5rem);
  }
  #cs-footer-1862 .cs-nav-li {
    list-style: none;
  }
  #cs-footer-1862 .cs-nav-link {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    line-height: 1.5em;
    text-decoration: none;
    margin: 0;
    color: var(--bodyTextColor);
    position: relative;
  }
  #cs-footer-1862 .cs-nav-link:hover {
    color: #8f5b34;
  }
  #cs-footer-1862 .cs-nav-link:hover:before {
    width: 100%;
  }
  #cs-footer-1862 .cs-nav-link:before {
    /* on hover underline */
    content: "";
    width: 0%;
    height: 1px;
    background: currentColor;
    opacity: 1;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    transition: width 0.3s;
  }
  #cs-footer-1862 .cs-copyright {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    line-height: 1.5em;
    text-align: center;
    margin: 0;
    color: var(--bodyTextColor);
  }
  #cs-footer-1862 .cs-copyright-link {
    font-size: inherit;
    line-height: inherit;
    text-decoration: none;
    margin: 0;
    color: inherit;
    display: inline-block;
  }
  #cs-footer-1862 .cs-copyright-link:hover {
    text-decoration: underline;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #cs-footer-1862 .cs-flex {
    width: auto;
    margin-right: auto;
  }
  #cs-footer-1862 .cs-contact-ul {
    /* 152px - 412px */
    width: clamp(9.5rem, 25vw, 25.75rem);
  }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #cs-footer-1862 .cs-bottom {
    flex-direction: row;
  }
  #cs-footer-1862 .cs-copyright {
    text-align: right;
  }
}

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

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #faq-1885 {
    padding: var(--sectionPadding);
    /* background-color: #faf6f2; */
    background: linear-gradient(90deg, #ffe6e6, #ffffff);
    position: relative;
    /* because the graphics are absolutely positioned, with some overflow above/below the image groups, we can use the em scaling with margins to set the distance on mobile. these get removed on larger screens */
  }
  #faq-1885 .cs-container {
    width: 100%;
    /* changes to 1720px at desktop */
    max-width: 36.5rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
  }
  #faq-1885 .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-1885 .cs-title {
    max-width: 25ch;
    margin: 0;
  }
  #faq-1885 .cs-flex-group {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #faq-1885 .cs-image-group {
    font-size: min(3.82vw, 0.9rem);
    width: 23.8125em;
    height: 34.4375em;
    display: block;
    position: relative;
    z-index: 1;
  }
  #faq-1885 .cs-image-group-left {
    margin-bottom: 4.5em;
  }
  #faq-1885 .cs-image-group-right {
    margin-top: 3.375em;
  }
  #faq-1885 .cs-picture {
    width: 23.8125em;
    height: 34.4375em;
    box-sizing: border-box;
    background-color: #dab692;
    overflow: hidden;
    border: 0.5em solid #dab692;
    border-radius: 16.25rem;
    position: absolute;
    z-index: -1;
  }
  #faq-1885 .cs-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    transition: transform 0.7s;
  }
  #faq-1885 .cs-graphic {
    height: auto;
    position: absolute;
  }
  #faq-1885 .cs-twirl {
    width: 11.0625em;
    height: auto;
    top: 0.9375em;
    right: 0;
    z-index: 1;
  }
  #faq-1885 .cs-peach-left {
    width: 5.375em;
    height: auto;
    top: -0.5625em;
    right: 5.6875em;
  }
  #faq-1885 .cs-beige {
    width: 23.75em;
    height: auto;
    right: 0;
    bottom: -2.9375em;
    z-index: -3;
  }
  #faq-1885 .cs-leaf-left {
    width: 10.9375em;
    height: auto;
    bottom: 0;
    left: 0;
    z-index: 1;
  }
  #faq-1885 .cs-dots {
    width: 8.6875em;
    height: auto;
    top: -1.625em;
    left: 0;
  }
  #faq-1885 .cs-brown {
    width: 12.6875em;
    height: auto;
    top: 0;
    right: 0;
    z-index: -3;
  }
  #faq-1885 .cs-peach-right {
    width: 2.9375em;
    height: auto;
    right: 1.9375em;
    bottom: 1.5em;
  }
  #faq-1885 .cs-leaf-right {
    width: 10.0625em;
    height: auto;
    right: 0;
    bottom: 0;
  }
  #faq-1885 .cs-faq-group {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.75rem;
  }
  #faq-1885 .cs-faq-item {
    list-style: none;
    width: 100%;
    /* clips all corners of the button that overlap the rounded border */
    overflow: hidden;
    transition: border-bottom 0.3s;
  }
  #faq-1885 .cs-faq-item.active .cs-button {
    background-color: #8f5b34;
    color: var(--bodyTextColorWhite);
  }
  #faq-1885 .cs-faq-item.active .cs-button:before {
    background-color: var(--bodyTextColorWhite);
    transform: rotate(315deg);
  }
  #faq-1885 .cs-faq-item.active .cs-button:after {
    background-color: var(--bodyTextColorWhite);
    transform: rotate(-315deg);
  }
  #faq-1885 .cs-faq-item.active .cs-item-text {
    height: auto;
    /* set the margin and paddings only when the item is active so we don't create space when the item is closed */
    margin-top: 0.5rem;
    padding: 1rem 1.5rem;
    opacity: 1;
  }
  #faq-1885 .cs-button {
    /* 16px - 20px */
    font-size: clamp(1rem, 2.5vw, 1.25rem);
    font-weight: bold;
    line-height: 1.2em;
    text-align: left;
    width: 100%;
    padding: 1rem;
    padding-left: 3rem;
    background-color: var(--secondary);
    color: var(--headerColor);
    border: none;
    border-radius: 3.75rem;
    display: block;
    position: relative;
    transition: background-color 0.3s, color 0.3s;
  }
  #faq-1885 .cs-button:hover {
    cursor: pointer;
  }
  #faq-1885 .cs-button:before {
    /* left line */
    content: "";
    width: 0.5rem;
    height: 0.125rem;
    background-color: var(--headerColor);
    opacity: 1;
    display: block;
    position: absolute;
    top: 50%;
    left: 1.5625rem;
    transform: rotate(45deg);
    transition: transform 0.5s;
    /* animate the transform from the left side of the x axis, and the center of the y */
    transform-origin: left center;
  }
  #faq-1885 .cs-button:after {
    /* right line */
    content: "";
    width: 0.5rem;
    height: 0.125rem;
    background-color: var(--headerColor);
    opacity: 1;
    display: block;
    position: absolute;
    top: 50%;
    left: 1.6875rem;
    transform: rotate(-45deg);
    transition: transform 0.5s;
    /* animate the transform from the right side of the x axis, and the center of the y */
    transform-origin: right center;
  }
  #faq-1885 .cs-item-text {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    line-height: 1.5em;
    height: 0;
    margin: 0;
    background-color: #fff;
    /* clips the text so it doesn't show up */
    overflow: hidden;
    color: var(--bodyTextColor);
    opacity: 0;
    border-radius: 1.5rem;
    transition: opacity 0.3s, padding-bottom 0.3s;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #faq-1885 .cs-container {
    max-width: 107.5rem;
  }
  #faq-1885 .cs-flex-group {
    flex-direction: row;
    justify-content: space-between;
    /* 16px - 40px */
    gap: clamp(1rem, 1vw, 2.5rem);
  }
  #faq-1885 .cs-image-group {
    font-size: min(0.9vw, 1em);
    margin: 0;
  }
  #faq-1885 .cs-image-group-left {
    align-self: flex-start;
  }
  #faq-1885 .cs-image-group-right {
    align-self: flex-end;
  }
  #faq-1885 .cs-faq-group {
    width: 47%;
  }
}

/*-- -------------------------- -->
<---            CTA             -->
<--- -------------------------- -*/
/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #cta-262 {
    padding: var(--sectionPadding);
  }
  #cta-262 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    /* 32px - 88px top & bottom */
    /* 24px - 88px left & right */
    padding: clamp(2em, 6.3vw, 5.5em) clamp(1.5em, 5.7vw, 5.5em);
    border-radius: 1rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2rem;
    position: relative;
    /* clips the corners for the border radius to show */
    overflow: hidden;
    z-index: 1;
    /* prevents padding from adding to height and width */
    box-sizing: border-box;
  }
  #cta-262 .cs-background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    z-index: -1;
  }
  #cta-262 .cs-background:before {
    /* black overlay */
    content: "";
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.7;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    z-index: 1;
  }
  #cta-262 .cs-background:after {
    /* brown overlay */
    content: "";
    width: 100%;
    height: 100%;
    background: var(--primaryLight);
    opacity: 0.2;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    z-index: 2;
  }
  #cta-262 .cs-background img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
  }
  #cta-262 .cs-left-section {
    max-width: 27.125rem;
  }
  #cta-262 .cs-title {
    color: var(--bodyTextColorWhite);
    margin-bottom: clamp(1.25rem, 4.2vw, 3rem);
  }
  #cta-262 .cs-button-solid {
    font-size: 1rem;
    /* 46px - 56px */
    line-height: clamp(2.875em, 5.5vw, 3.5em);
    text-decoration: none;
    font-weight: 700;
    text-align: center;
    margin: auto;
    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;
  }
  #cta-262 .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;
  }
  #cta-262 .cs-button-solid:hover:before {
    width: 100%;
  }
  #cta-262 .cs-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    /* 12px - 20px */
    gap: clamp(0.75rem, 1.6vw, 1.25rem);
  }
  #cta-262 .cs-header {
    /* 20px - 25px */
    font-size: clamp(1.25rem, 2.4vw, 1.5625rem);
    font-weight: bold;
    color: var(--primaryLight);
    display: block;
  }
  #cta-262 .cs-p {
    /* 14px - 20px */
    font-size: clamp(0.875rem, 1.5vw, 1.25rem);
    line-height: 1.5em;
    margin: 0;
    color: var(--bodyTextColorWhite);
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #cta-262 .cs-container {
    flex-direction: row;
    justify-content: space-between;
  }
  #cta-262 .cs-content {
    align-items: flex-end;
    text-align: right;
    /* prevents flexbox from squishing it */
    flex: none;
  }
}

/*-- -------------------------- -->
<---          Banner            -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #banner-1400 {
    padding: var(--sectionPadding);
    /* 190px - 268px */
    padding-top: clamp(11.875rem, 25vw, 16.75rem);
    padding-bottom: 6.25rem;
    /* clips the line from causing overflow issues for going off screen */
    overflow: hidden;
    position: relative;
    z-index: 1;
  }
  #banner-1400 .cs-container {
    text-align: center;
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    /* 8px - 12px */
    gap: clamp(0.5rem, 1vw, 0.75rem);
  }
  #banner-1400 .cs-int-title {
    /* 39px - 61px */
    font-size: clamp(2.4375rem, 6.4vw, 3.8125rem);
    font-weight: 900;
    line-height: 1.2em;
    text-align: inherit;
    margin: 0;
    color: var(--bodyTextColorWhite);
    position: relative;
  }
  #banner-1400 .cs-breadcrumbs {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #banner-1400 .cs-link {
    font-size: 1rem;
    line-height: 1.2em;
    text-decoration: none;
    color: var(--bodyTextColorWhite);
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #banner-1400 .cs-link:last-of-type {
    /* remove the chevron on the last list item */
  }
  #banner-1400 .cs-link:last-of-type::after {
    display: none;
  }
  #banner-1400 .cs-link:after {
    /* chevron */
    content: "";
    width: 0.4375rem;
    height: 0.75rem;
    margin: 0 1rem;
    background: url("https://csimg.nyc3.cdn.digitaloceanspaces.com/Icons/white-chev.svg");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    display: block;
  }
  #banner-1400 .cs-link.cs-active {
    color: var(--primary);
  }
  #banner-1400 .cs-background {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
  #banner-1400 .cs-background:before {
    /* gradient overlay */
    content: "";
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.4;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    z-index: 1;
  }
  #banner-1400 .cs-background:after {
    /* gradient overlay */
    content: "";
    width: 100%;
    height: 40%;
    background: -webkit-gradient(
      linear,
      left top,
      left bottom,
      from(#000000),
      to(rgba(0, 0, 0, 0))
    );
    background: -o-linear-gradient(top, #000000 0%, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(to bottom, #000000 0%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    z-index: 2;
  }
  #banner-1400 .cs-background img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    /* Makes img tag act as a background image */
    object-fit: cover;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #banner-1400 .cs-background:before {
    width: 50%;
    height: 100%;
    background: -webkit-gradient(
      linear,
      left top,
      right top,
      from(#000000),
      to(rgba(0, 0, 0, 0))
    );
    background: -o-linear-gradient(left, #000000 0%, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(to right, #000000 0%, rgba(0, 0, 0, 0) 100%);
    opacity: 1;
  }
}

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

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #content-page-713 {
    padding: var(--sectionPadding);
    /* background-color: #fff; */
    background: linear-gradient(90deg, #ffe6e6, #ffffff);
    /* 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%;
  }
}

/*-- -------------------------- -->
<---   Side by Side Reverse     -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #sbs-r-1884 {
    width: 100%;
    padding: var(--sectionPadding);
    /* background-color: #faf6f2; */
    overflow: clip;
    display: flex;
    flex-direction: column;
    /* aligns content to the left, set to center to centrally align */
    align-items: flex-start;
    position: relative;
    z-index: 1;
  }
  #sbs-r-1884 .cs-container {
    width: 100%;
    /* changes to 1280px at desktop */
    max-width: 36.5rem;
    margin: auto;
    display: grid;
    justify-items: center;
    grid-auto-flow: row;
    /* 48px - 80px */
    gap: clamp(3rem, 6vw, 5rem);
  }
  #sbs-r-1884 .cs-content {
    /* set text align to left if content needs to be left aligned */
    text-align: left;
    width: 100%;
    max-width: 40.625rem;
    display: flex;
    flex-direction: column;
    /* centers content horizontally, set to flex-start to left align */
    align-items: flex-start;
    position: relative;
    z-index: 3;
  }
  #sbs-r-1884 .cs-text {
    margin-bottom: 1rem;
  }
  #sbs-r-1884 .cs-text:last-of-type {
    margin-bottom: 2rem;
  }
  #sbs-r-1884 .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;
    background-color: var(--secondary);
    overflow: hidden;
    color: #fff;
    border: none;
    border-radius: 0.25rem;
    display: inline-block;
    position: relative;
    z-index: 1;
    transition: color 0.3s;
  }
  #sbs-r-1884 .cs-button-solid:before {
    content: "";
    width: 0;
    height: 100%;
    background: #000;
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width 0.3s;
  }
  #sbs-r-1884 .cs-button-solid:hover {
    color: #fff;
  }
  #sbs-r-1884 .cs-button-solid:hover:before {
    width: 100%;
  }
  #sbs-r-1884 .cs-image-group {
    font-size: min(2.97vw, 1rem);
    width: 28.875em;
    height: 44.1875em;
    display: block;
    position: relative;
    z-index: 1;
  }
  #sbs-r-1884 .cs-picture {
    box-sizing: border-box;
    background-color: #dab692;
    overflow: hidden;
    border: 0.5em solid #dab692;
    border-radius: 16.25rem;
    position: absolute;
    z-index: -1;
  }
  #sbs-r-1884 .cs-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
  }
  #sbs-r-1884 .cs-picture-large {
    width: 23.8125em;
    height: 34.4375em;
    top: 0;
    left: 3.1875em;
  }
  #sbs-r-1884 .cs-picture-small {
    width: 15.3125em;
    height: 24.25em;
    bottom: 0em;
    left: 0;
  }
  #sbs-r-1884 .cs-graphic {
    height: auto;
    position: absolute;
  }
  #sbs-r-1884 .cs-brown {
    width: 8.25em;
    height: auto;
    top: 0;
    right: 0;
    z-index: -2;
  }
  #sbs-r-1884 .cs-dots {
    width: 8.5625em;
    height: auto;
    top: 2.25em;
    left: 0;
  }
  #sbs-r-1884 .cs-glitter {
    width: 31.75em;
    height: auto;
    /* -48px to -100px */
    right: calc(clamp(3em, 8vw, 6.25em) * -1);
    bottom: -3.75em;
    z-index: -2;
  }
  #sbs-r-1884 .cs-logos {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    /* 40px - 80px */
    column-gap: clamp(2.5rem, 6vw, 5rem);
    /* 32px - 46px */
    row-gap: clamp(2rem, 5vw, 2.875rem);
  }
  #sbs-r-1884 .cs-logo {
    width: auto;
    height: 2.5rem;
    object-fit: contain;
  }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #sbs-r-1884 .cs-container {
    max-width: 80rem;
    justify-items: initial;
    grid-template-columns: repeat(2, auto);
    align-items: stretch;
  }
  #sbs-r-1884 .cs-content {
    /* 48px - 64px */
    padding: clamp(3rem, 5vw, 4rem) 0;
    grid-column: span 1;
    align-self: center;
    order: 1;
  }
  #sbs-r-1884 .cs-image-group {
    min-height: 44.1875rem;
    height: auto;
    grid-column: span 1;
    order: 2;
  }
  #sbs-r-1884 .cs-picture-large {
    height: 77.934939%;
  }
  #sbs-r-1884 .cs-picture-small {
    height: 54.879774%;
  }
  #sbs-r-1884 .cs-brown {
    top: 0;
    right: 0;
  }
  #sbs-r-1884 .cs-glitter {
    width: 31.75em;
    height: 30.6875em;
    /* 34px - 214px */
    right: calc(clamp(2.125em, 10vw, 13.375em) * -1);
  }
  #sbs-r-1884 .cs-logos {
    grid-column: span 2;
    order: 3;
  }
}
/* Large Desktop - 1400px */
@media only screen and (min-width: 87.5rem) {
  #sbs-r-1884 .cs-logos {
    justify-content: space-between;
    gap: 0;
  }
}

/*-- -------------------------- -->
<---          Banner            -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #banner-1403 {
    padding: var(--sectionPadding);
    /* 190px - 268px */
    padding-top: clamp(11.875rem, 25vw, 16.75rem);
    padding-bottom: 6.25rem;
    /* clips the line from causing overflow issues for going off screen */
    overflow: hidden;
    position: relative;
    z-index: 1;
  }
  #banner-1403 .cs-container {
    text-align: center;
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    /* 8px - 12px */
    gap: clamp(0.5rem, 1vw, 0.75rem);
  }
  #banner-1403 .cs-int-title {
    /* 39px - 61px */
    font-size: clamp(2.4375rem, 6.4vw, 3.8125rem);
    font-weight: 900;
    line-height: 1.2em;
    text-align: inherit;
    margin: 0;
    color: var(--bodyTextColorWhite);
    position: relative;
  }
  #banner-1403 .cs-breadcrumbs {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #banner-1403 .cs-link {
    font-size: 1rem;
    line-height: 1.2em;
    text-decoration: none;
    color: var(--bodyTextColorWhite);
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #banner-1403 .cs-link:last-of-type {
    /* remove the chevron on the last list item */
  }
  #banner-1403 .cs-link:last-of-type::after {
    display: none;
  }
  #banner-1403 .cs-link:after {
    /* chevron */
    content: "";
    width: 0.4375rem;
    height: 0.75rem;
    margin: 0 1rem;
    background: url("https://csimg.nyc3.cdn.digitaloceanspaces.com/Icons/white-chev.svg");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    display: block;
  }
  #banner-1403 .cs-link.cs-active {
    color: var(--primary);
  }
  #banner-1403 .cs-background {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
  #banner-1403 .cs-background:before {
    /* gradient overlay */
    content: "";
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.4;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    z-index: 1;
  }
  #banner-1403 .cs-background:after {
    /* gradient overlay */
    content: "";
    width: 100%;
    height: 40%;
    background: -webkit-gradient(
      linear,
      left top,
      left bottom,
      from(#000000),
      to(rgba(0, 0, 0, 0))
    );
    background: -o-linear-gradient(top, #000000 0%, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(to bottom, #000000 0%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    z-index: 2;
  }
  #banner-1403 .cs-background img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    /* Makes img tag act as a background image */
    object-fit: cover;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #banner-1403 .cs-background:before {
    width: 50%;
    height: 100%;
    background: -webkit-gradient(
      linear,
      left top,
      right top,
      from(#000000),
      to(rgba(0, 0, 0, 0))
    );
    background: -o-linear-gradient(left, #000000 0%, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(to right, #000000 0%, rgba(0, 0, 0, 0) 100%);
    opacity: 1;
  }
}

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

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #contact-1403 {
    padding: var(--sectionPadding);
    padding-bottom: 0;
    /* background-color: #f7f7f7; */
    position: relative;
    z-index: 10;
  }
  #contact-1403 .cs-container {
    width: 100%;
    /* changes to 1280px at tablet */
    max-width: 36.5rem;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: stretch;
    flex-direction: column;
    column-gap: auto;
    /* 48px - 64px */
    gap: clamp(2rem, 3vw, 3rem);
    position: relative;
  }
  #contact-1403 .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;
  }

  #contact-1403 .cs-title {
    max-width: 23ch;
  }
  #contact-1403 .cs-text {
    margin-bottom: 1rem;
  }
  #contact-1403 .cs-text:last-of-type {
    margin-bottom: 2rem;
  }
  #contact-1403 .cs-ul {
    text-align: left;
    width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
    position: relative;
  }
  #contact-1403 .cs-li {
    list-style: none;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1.25rem;
  }
  #contact-1403 .cs-li:hover .cs-icon-wrapper {
    transform: scale(1.1);
  }
  #contact-1403 .cs-header {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2em;
    margin-bottom: 0.75rem;
    color: var(--headerColor);
    display: block;
  }
  #contact-1403 .cs-link {
    font-size: 1rem;
    line-height: 1.5em;
    text-decoration: none;
    color: #767676;
    display: block;
    position: relative;
  }
  #contact-1403 .cs-link:hover {
    text-decoration: underline;
  }
  #contact-1403 .cs-icon-wrapper {
    width: 3.75rem;
    height: 3.75rem;
    margin: 0;
    border-radius: 50%;
    border: 1px solid #bababa;
    display: flex;
    justify-content: center;
    align-items: center;
    /* prevents flexbox from squishing it */
    flex: none;
    transition: transform 0.3s;
  }
  #contact-1403 .cs-icon {
    width: 1.5rem;
    height: auto;
    display: block;
  }
  #contact-1403 .cs-form {
    width: 100%;
    max-width: 39.375rem;
    /* -30px to -100px */
    margin-bottom: calc(clamp(1.875rem, 7vw, 6.25rem) * -1);
    /* 24px - 48px top and bottom */
    /* 16px - 48px left and right */
    padding: clamp(1.5rem, 5.18vw, 3rem) clamp(1rem, 4vw, 3rem);
    /* prevents flexbox from affecting height and width */
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 1rem;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
  }
  #contact-1403 .cs-h3 {
    /* 20px - 39px */
    font-size: clamp(1.25rem, 3vw, 2.4375rem);
    line-height: 1.2em;
    font-weight: 700;
    margin: 0 0 0.25rem 0;
    color: var(--headerColor);
  }
  #contact-1403 .cs-label {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    width: 100%;
    color: var(--headerColor);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 0.25rem;
  }
  #contact-1403 .cs-input {
    font-size: 1rem;
    width: 100%;
    height: 3.5rem;
    padding: 0;
    padding-left: 1.5rem;
    color: var(--headerColor);
    background-color: #f7f7f7;
    border-radius: 0.5rem;
    /* border: 2px solid black; */
    /* prevents padding from adding to height and width */
    box-sizing: border-box;
  }
  #contact-1403 .cs-input::placeholder {
    color: #7d799c;
    opacity: 0.6;
  }
  #contact-1403 .cs-textarea {
    min-height: 7.5rem;
    padding-top: 1.5rem;
    margin-bottom: 0.75rem;
    font-family: inherit;
  }
  #contact-1403 .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;
  }
  #contact-1403 .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;
  }
  #contact-1403 .cs-button-solid:hover {
    color: var(--primary);
  }
  #contact-1403 .cs-button-solid:hover:before {
    width: 100%;
  }
  #contact-1403 .cs-submit {
    width: 100%;
    min-width: 12.5rem;
    border: none;
  }
  #contact-1403 .cs-submit:hover {
    color: #fff;
    cursor: pointer;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #contact-1403 .cs-container {
    max-width: 80rem;
    flex-direction: row;
    justify-content: space-between;
  }
  #contact-1403 .cs-content {
    width: 47%;
    /* prevents flexbox from squishing it */
    flex: none;
  }
  #contact-1403 .cs-submit {
    width: auto;
  }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #contact-1403 .cs-form {
    width: 46%;
    max-width: 36.125rem;
  }
  #contact-1403 .cs-submit {
    width: auto;
  }
}
/* Large Desktop - 1500px */
@media only screen and (min-width: 93.75rem) {
  #contact-1403 .cs-graphic {
    display: block;
  }
}

/*-- -------------------------- -->
<---    Google Maps Iframe      -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #map-1403 iframe {
    width: 100%;
    /* 400px - 560px */
    height: clamp(25rem, 42vw, 35rem);
  }
}

/*-- -------------------------- -->
<---          Pricing           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #pricing-975 {
    padding: var(--sectionPadding);
  }
  #pricing-975 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
  }
  #pricing-975 .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;
  }
  #pricing-975 .cs-title {
    margin: 0;
  }
  #pricing-975 .cs-menu {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    column-gap: 1.25rem;
    /* 28px - 40px */
    row-gap: clamp(1.75rem, 3vw, 2.5rem);
  }
  #pricing-975 .cs-menu-group {
    width: 100%;
    max-width: 37.5rem;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* 28px - 40px */
    gap: clamp(1.75rem, 3vw, 2.5rem);
  }
  #pricing-975 .cs-menu-item {
    list-style: none;
    width: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.5rem;
  }
  #pricing-975 .cs-h3 {
    width: 100%;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    position: relative;
  }
  #pricing-975 .cs-h3:before {
    /* grey line */
    content: "";
    width: 100%;
    height: 2px;
    background: #e8e8e8;
    opacity: 1;
    position: absolute;
    display: block;
    top: 0.8125rem;
    left: 0;
    z-index: -1;
  }
  #pricing-975 .cs-header {
    /* 20px - 25px */
    font-size: clamp(1.25rem, 2vw, 1.5625rem);
    line-height: 1.2em;
    text-align: inherit;
    font-weight: 700;
    max-width: 25rem;
    padding-right: 0.5rem;
    background-color: transparent; /* was #fff */
    color: var(--headerColor);
  }
  #pricing-975 .cs-price {
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 400;
    padding-left: 0.5rem;
    background-color: transparent; /* was #fff */
    color: var(--headerColor);
  }
  #pricing-975 .cs-menu-text {
    font-size: 1rem;
    line-height: 1.5em;
    text-align: inherit;
    margin: 0;
    color: var(--bodyTextColor);
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #pricing-975 .cs-menu {
    flex-direction: row;
    justify-content: space-between;
  }
  #pricing-975 .cs-menu-group {
    width: 100%;
  }
}

.btn-style506 {
  position: relative;
  border-color: #dd7e2a;
  color: #dd7e2a;
  overflow: hidden;
}
.btn-style506::before {
  width: 20%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 0;
  background-color: #dd7e2a;
  transform: rotateZ(-45deg) translate(-50%, -50%);
  transition: all 0.3s;
  content: "";
  z-index: -1;
}
.btn-style506:hover {
  color: #fff;
}
.btn-style506:hover::before {
  width: 100%;
  top: 0;
  transform: none;
}

/* Scrolling Logo Bar Animations */

/* Keyframe animations */
@keyframes scrollLeft {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}

@keyframes scrollRight {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(100%);
  }
}

/* Apply scrolling animation */
.scroll-left {
  animation: scrollLeft 30s linear infinite;
}

.scroll-right {
  animation: scrollRight 30s linear infinite;
}

/* Blur effect using pseudo-elements */
/* #logos-1430::before,
#logos-1430::after,
#logos-1431::before,
#logos-1431::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100px;
  pointer-events: none;
  z-index: 2;
} */

/*-- -------------------------- -->
<---           Logos            -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #logos-1430 {
    /* padding: var(--sectionPadding); */
    /* background-color: #f7f7f7; */
    position: relative;
    z-index: 1;
  }
  #logos-1430 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    column-gap: 2.5rem;
  }
  #logos-1430 .cs-picture {
    /* 120px - 150px */
    width: clamp(7.5rem, 12vw, 9.375rem);
    height: clamp(7.5rem, 12vw, 9.375rem);
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #logos-1430 .cs-logo {
    width: 100%;
    height: auto;
    margin: 0;
    display: block;
    object-fit: contain;
  }
  #logos-1430 .cs-background {
    width: 100%;
    height: 100%;
    max-height: 40.625rem;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
  #logos-1430 .cs-background img {
    width: 100%;
    height: 100%;
    opacity: 0.2;
    object-fit: cover;
    top: 0;
    left: 0;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #logos-1430 .cs-container {
    justify-content: space-between;
    flex-wrap: nowrap;
  }
}

/*-- -------------------------- -->
<---         Services           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #services-1663 {
    padding: var(--sectionPadding);
    /* background-color: #f7f7f7; */
    position: relative;
    overflow: hidden;
    z-index: 1;
  }
  #services-1663 .cs-container {
    width: 100%;
    /* changes to 1280px at small desktop */
    max-width: 36.5rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 3.9vw, 4rem);
  }
  #services-1663 .cs-picture {
    display: block;
    position: relative;
    width: 100%;
    max-width: 44rem;
    height: auto;
    /* 328px - 640px */
    min-height: clamp(20.5rem, 45vw, 40rem);
  }
  #services-1663 .cs-picture img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  #services-1663 .cs-content {
    text-align: left;
    width: 100%;
    max-width: 40.625rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  #services-1663 .cs-title {
    /* 25 characters wide including spaces */
    max-width: 25ch;
  }
  #services-1663 .cs-text {
    margin-bottom: 1rem;
  }
  #services-1663 .cs-text:last-of-type {
    margin-bottom: 2rem;
  }
  #services-1663 .cs-card-group {
    width: 100%;
    max-width: 44rem;
    /* 28px - 40px */
    margin: 0 0 2rem;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15.625rem, 1fr));
    align-items: stretch;
    /* 16px - 20px */
    gap: clamp(1rem, 2vw, 1.25rem);
  }
  #services-1663 .cs-item {
    list-style: none;
    padding: 1rem;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    background-color: transparent;
    border: 1px solid #e8e8e8;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
  }
  #services-1663 .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: 1rem;
  }
  #services-1663 .cs-h3-icon {
    width: 2rem;
    height: auto;
    display: block;
  }
  #services-1663 .cs-button-solid {
    font-size: 1rem;
    font-weight: 700;
    line-height: clamp(2.875rem, 5.5vw, 3.5rem);
    text-align: center;
    text-decoration: none;
    min-width: 11.625rem;
    margin: 0;
    /* prevents padding from affecting height and width */
    box-sizing: border-box;
    padding: 0 1.5rem;
    color: #fff;
    background-color: var(--primary);
    display: inline-block;
    position: relative;
    z-index: 1;
  }
  #services-1663 .cs-button-solid:before {
    content: "";
    width: 0%;
    height: 100%;
    background: #000;
    opacity: 1;
    /* add a border radius below this to round corners */
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width 0.3s;
  }
  #services-1663 .cs-button-solid:hover:before {
    width: 100%;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #services-1663 .cs-container {
    max-width: 80rem;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
  }
  #services-1663 .cs-content {
    width: 55%;
    padding: 3rem 0;
    align-self: center;
    flex: none;
  }
  #services-1663 .cs-picture {
    max-width: 33.875rem;
    min-height: 28.125rem;
  }
}

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

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

  #reviews-567 .cs-card-group {
    width: 100%;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    /* 16px - 20px */
    gap: clamp(1rem, 2.5vw, 1.15rem);
  }
  #reviews-567 .cs-item {
    list-style: none;
    width: 100%;
    max-width: 39.375rem;
    /* 32px - 60px top & bottom */
    /* 16px - 48px left & right */
    padding: clamp(2rem, 6.15vw, 3.75rem) clamp(1rem, 4.15vw, 3rem);
    background-color: #f1f1f4;
    /* prevents padding from adding to height and width */
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    position: relative;
    border-radius: 15px;
    /* border: 1px solid violet; */
    box-shadow: 5px 5px 15px #d6d6d6;
    transition: transform 0.3s ease;
    transform: translateY(0);
  }
  #reviews-567 .cs-item:hover {
    transform: translateY(-5px);
  }
  #reviews-567 .cs-stars {
    /* 169px - 189px */
    width: clamp(10.5625rem, 20vw, 11.8125rem);
    height: auto;
    /* 20px - 24px */
    margin-bottom: clamp(1.25rem, 3vw, 1.5rem);
    display: block;
  }
  #reviews-567 .cs-item-text {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    line-height: 1.5em;
    margin: 0;
    /* 40px - 64px */
    margin-bottom: clamp(2.5rem, 8vw, 4rem);
    color: var(--bodyTextColor);
  }
  #reviews-567 .cs-flex-group {
    /* in case one card has more text than the other, this pushes up against the review text so the name and title are always at the bottom. Only works if parent is a flexbox */
    margin-top: auto;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1.25rem;
  }
  #reviews-567 .cs-profile {
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    /* clips image corners to make circle */
    overflow: hidden;
    position: relative;
    display: block;
  }
  #reviews-567 .cs-profile img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    /* makes the image behave like a background image */
    object-fit: cover;
  }
  #reviews-567 .cs-name {
    /* 16px - 20px */
    font-size: clamp(1rem, 2vw, 1.25rem);
    line-height: 1.5em;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    color: var(--headerColor);
    display: block;
  }
  #reviews-567 .cs-job {
    /* 13px - 16px */
    font-size: clamp(0.8125rem, 1.6vw, 1rem);
    line-height: 1.2em;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    margin: 0;
    color: var(--bodyTextColor);
    display: block;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #reviews-567 .cs-container {
    max-width: 80rem;
  }
  #reviews-567 .cs-card-group {
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
  }
  #reviews-567 .cs-item {
    width: clamp(48.5%, 46.5vw, 49.5%);
  }
  #reviews-567 .cs-item:last-of-type {
    width: 100%;
    max-width: 100%;
    align-items: center;
  }
  #reviews-567 .cs-item:last-of-type .cs-item-text {
    text-align: center;
    max-width: 34.375rem;
  }
}
/* Desktop - 1200px */
@media only screen and (min-width: 75rem) {
  #reviews-567 .cs-card-group {
    flex-wrap: nowrap;
  }
  #reviews-567 .cs-item {
    width: 100%;
    align-items: flex-start;
  }
  #reviews-567 .cs-item:last-of-type {
    align-items: flex-start;
  }
  #reviews-567 .cs-item:last-of-type .cs-item-text {
    text-align: left;
  }
}

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

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #meet-team-1831 {
    padding: var(--sectionPadding);
    overflow: hidden;
    position: relative;
  }
  #meet-team-1831:before {
    /* content: "";
    width: 100%;
    height: 100%;
    background: #f6eddf;
    opacity: 0.9;
    display: block;
    position: absolute;
    top: 0;
    left: 0; */
  }
  #meet-team-1831 .cs-container {
    width: 100%;
    max-width: 44rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
    position: relative;
  }
  #meet-team-1831 .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;
    z-index: 1;
  }
  #meet-team-1831 .cs-title {
    max-width: none;
  }
  #meet-team-1831 .cs-card-group {
    width: 100%;
    /* changes to 100% at tablet */
    max-width: 25rem;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    /* 16px - 20px */
    gap: clamp(1rem, 2vw, 1.25rem);
  }
  #meet-team-1831 .cs-item {
    list-style: none;
    width: 100%;
    box-sizing: border-box;
    /* 310px - 428px, changes to a clamp at tablet */
    padding-top: clamp(19.375rem, 60vw, 26.75rem);
    border-radius: 16.25rem;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    justify-content: stretch;
    position: relative;
    z-index: 1;
  }
  #meet-team-1831 .cs-item:before {
    /* color border */
    content: "";
    border-radius: 16.25rem;
    border: 5px solid var(--primary);
    opacity: 0.3;
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    z-index: 2;
    /* prevents mouse from interacting with it */
    pointer-events: none;
  }
  #meet-team-1831 .cs-item:after {
    /* color border white bg */
    content: "";
    border-radius: 16.25rem;
    border: 5px solid #fff;
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    z-index: 1;
    /* prevents mouse from interacting with it */
    pointer-events: none;
  }
  #meet-team-1831 .cs-item:hover .cs-flex:before {
    opacity: 1;
  }
  #meet-team-1831 .cs-item:hover .cs-h3,
  #meet-team-1831 .cs-item:hover .cs-job {
    color: var(--bodyTextColorWhite);
  }
  #meet-team-1831 .cs-item:hover .cs-picture img {
    transform: scale(1.1);
  }
  #meet-team-1831 .cs-flex {
    text-align: center;
    width: 100%;
    padding: 1rem 0 1.5rem 0;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 1;
  }
  #meet-team-1831 .cs-flex:before {
    /* background color */
    content: "";
    width: 100%;
    height: 100%;
    background-color: var(--primary);
    opacity: 0.3;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: opacity 0.3s;
  }
  #meet-team-1831 .cs-h3 {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2em;
    width: 70%;
    margin: 0;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    z-index: 1;
  }
  #meet-team-1831 .cs-job {
    /* 14px - 16px */
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    line-height: 1.5em;
    width: 50%;
    margin: 0;
    color: var(--bodyTextColor);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
  }
  #meet-team-1831 .cs-picture {
    width: auto;
    height: 100%;
    box-sizing: border-box;
    /* clips img tag from overflowing it on hover */
    overflow: hidden;
    object-fit: cover;
    display: block;
    position: absolute;
    top: 1px;
    right: 1px;
    left: 1px;
    z-index: -4;
  }
  #meet-team-1831 .cs-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    transition: transform 0.7s;
  }
  #meet-team-1831 .cs-background {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: none; /* Remove Graphic */
  }
  #meet-team-1831 .cs-background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* makes the top of the image start at the top of the parent */
    object-position: top;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
  }
  #meet-team-1831 .cs-graphic1 {
    /* 200px - 548px */
    width: clamp(12.5rem, 30vw, 34.25rem);
    height: auto;
    opacity: 0.5;
    display: block;
    position: absolute;
    top: calc(0 / 16 * 1rem);
    left: 0;
    z-index: 0;
  }
  #meet-team-1831 .cs-graphic2 {
    width: calc(548 / 16 * 1rem);
    height: auto;
    opacity: 0.5;
    display: block;
    position: absolute;
    right: 0;
    bottom: calc(0 / 16 * 1rem);
    z-index: 0;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #meet-team-1831:before {
    background: linear-gradient(
      89deg,
      rgba(255, 243, 236, 0.9) 44.46%,
      rgba(255, 243, 236, 0) 78.47%
    );
    opacity: 1;
  }
  #meet-team-1831 .cs-container {
    max-width: 80rem;
  }
  #meet-team-1831 .cs-card-group {
    max-width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }
  #meet-team-1831 .cs-item {
    width: 32.2%;
    height: auto;
    /* 210px - 428px */
    padding-top: clamp(12.125rem, 32vw, 26.75rem);
    align-items: stretch;
  }
}
/* Large Desktop - 1920px */
@media only screen and (min-width: 120rem) {
  #meet-team-1831 .cs-graphic1 {
    margin-right: calc(400 / 16 * 1rem);
    left: auto;
    right: 50%;
  }
  #meet-team-1831 .cs-graphic2 {
    margin-left: calc(420 / 16 * 1rem);
    right: auto;
    left: 50%;
  }
}
/*-- -------------------------- -->
<---          Gallery           -->
<--- -------------------------- -*/

/* Mobile */
@media only screen and (min-width: 0rem) {
  #gallery-40 {
    padding: var(--sectionPadding);
    position: relative;
  }
  #gallery-40 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 48px - 64px */
    gap: clamp(3rem, 6vw, 4rem);
  }
  #gallery-40 .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;
  }

  #gallery-40 .cs-title {
    margin: 0;
  }
  #gallery-40 .cs-image-group {
    /* Scales the whole container down and grows with the view width */
    /* increase vw unit to scale bigger, decrease to scale smaller */
    font-size: min(1.4vw, 1em);
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    position: relative;
  }
  #gallery-40 .cs-flex-group {
    display: flex;
    flex-direction: column;
  }
  #gallery-40 .cs-flex-group:first-of-type {
    align-items: flex-end;
    margin-right: 1.5em;
  }
  #gallery-40 .cs-picture {
    display: block;
    position: relative;
  }
  #gallery-40 .cs-picture img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
  }
  #gallery-40 .cs-picture-one {
    width: 33.0625em;
    height: 49.5em;
    margin-bottom: 2.25em;
    margin-top: 7.5em;
  }
  #gallery-40 .cs-picture-two {
    width: 32.8125em;
    height: 44.3125em;
    margin-bottom: 2.25em;
    position: relative;
  }
  #gallery-40 .cs-picture-two:before {
    content: "";
    width: 18.8125em;
    height: 27.6875em;
    position: absolute;
    display: block;
    background: #f1eaff;
    opacity: 1;
    bottom: -1.5625em;
    right: -1.375em;
  }
  #gallery-40 .cs-picture-three {
    width: 27.125em;
    height: 40.6875em;
    position: relative;
  }
  #gallery-40 .cs-picture-three:before {
    content: "";
    width: 21.5em;
    height: 31.8125em;
    position: absolute;
    display: block;
    background: #f1eaff;
    opacity: 1;
    top: -0.8125em;
    left: -1.5625em;
  }
  #gallery-40 .cs-picture-four {
    width: 28em;
    height: 36em;
  }
}
/*-- -------------------------- -->
<---          Gallery           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #gallery-404 {
    padding: var(--sectionPadding);
    overflow: hidden;
    position: relative;
  }
  #gallery-404 .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);
    position: relative;
  }
  #gallery-404 .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;
  }
  #gallery-404 .cs-title {
    max-width: 20ch;
  }
  #gallery-404 .cs-button-group {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 0.5rem;
    column-gap: 2rem;
  }
  #gallery-404 .cs-button {
    font-size: 1rem;
    line-height: 1.5em;
    color: var(--bodyTextColor);
    background-color: transparent;
    border: none;
    transition: color 0.3s;
  }
  #gallery-404 .cs-button:hover {
    color: var(--primary);
    cursor: pointer;
  }
  #gallery-404 .cs-button.cs-active {
    color: var(--primary);
  }
  #gallery-404 .cs-gallery-wrapper {
    width: 100%;
    position: relative;
    z-index: 1;
  }
  #gallery-404 .cs-gallery {
    width: 100%;
    padding: 0;
    margin: 0;
    opacity: 1;
    visibility: visible;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    /* 16px - 20px */
    gap: clamp(1rem, 1.5vw, 1.25rem);
    transition: transform 0.7s, opacity 0.3s, visibility 0.5s, top 0.3s,
      left 0.3s;
    /* makes the transform scaling origin the top left corner, dictates the direction by which the scale transforms animate towards */
    transform-origin: left top;
  }
  #gallery-404 .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 position 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-404 .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);
    opacity: 0;
  }
  #gallery-404 .cs-image {
    border-radius: 1.25rem;
    width: 47%;
    aspect-ratio: 1;
    /* 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);
    opacity: 1;
    transition: opacity 0.6s, transform 0.6s;
  }
  #gallery-404 .cs-image:nth-of-type(1) {
    /* changes transition delays 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.15s;
  }
  #gallery-404 .cs-image:nth-of-type(2) {
    transition-delay: 0.3s;
  }
  #gallery-404 .cs-image:nth-of-type(3) {
    transition-delay: 0.45s;
  }
  #gallery-404 .cs-image:nth-of-type(4) {
    transition-delay: 0.6s;
  }
  #gallery-404 .cs-image:nth-of-type(5) {
    transition-delay: 0.75s;
  }
  #gallery-404 .cs-image:nth-of-type(6) {
    transition-delay: 0.9s;
  }
  #gallery-404 .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-404 .cs-container {
    max-width: 80rem;
  }
  #gallery-404 .cs-content {
    text-align: left;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
  }
  #gallery-404 .cs-title {
    margin: 0;
  }
  #gallery-404 .cs-image {
    width: 31.8%;
    aspect-ratio: 1;
  }
}
/* Desktop - 1300px */
@media only screen and (min-width: 81.25rem) {
  #gallery-404 .cs-flex {
    max-width: 34.375rem;
  }
  #gallery-404 .cs-gallery {
    align-items: stretch;
    justify-content: center;
  }
  #gallery-404 .cs-image {
    width: 39.375rem;
    max-width: 100%;
    height: 25rem;
  }
  #gallery-404 .cs-image:nth-of-type(2),
  #gallery-404 .cs-image:nth-of-type(3),
  #gallery-404 .cs-image:nth-of-type(4),
  #gallery-404 .cs-image:nth-of-type(5) {
    width: 19.0625rem;
  }
  #gallery-404 .cs-image:nth-of-type(1) {
    /* these delays stagger the reveal of each image so they all go one after the other and not all at once */
    transition-delay: 0.15s;
  }
  #gallery-404 .cs-image:nth-of-type(2) {
    transition-delay: 0.3s;
  }
  #gallery-404 .cs-image:nth-of-type(3) {
    transition-delay: 0.45s;
  }
  #gallery-404 .cs-image:nth-of-type(4) {
    transition-delay: 0.15s;
  }
  #gallery-404 .cs-image:nth-of-type(5) {
    transition-delay: 0.3s;
  }
  #gallery-404 .cs-image:nth-of-type(6) {
    transition-delay: 0.45s;
  }
}

/*-- -------------------------- -->
<---          Pricing           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #pricing-995,
  #pricing-r-995 {
    padding: var(--sectionPadding);
  }
  #pricing-995 .cs-container,
  #pricing-r-995 .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);
  }
  #pricing-995 .cs-content,
  #pricing-r-995 .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;
  }
  #pricing-995 .cs-topper,
  #pricing-r-995 .cs-topper {
    font-size: var(--topperFontSize);
    line-height: 1.2em;
    text-transform: uppercase;
    text-align: inherit;
    letter-spacing: 0.1em;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 0.25rem;
    display: block;
  }
  #pricing-995 .cs-title,
  #pricing-r-995 .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;
  }
  #pricing-995 .cs-title,
  #pricing-r-995 .cs-title {
    margin: 0 0 2rem 0;
  }
  #pricing-995 .cs-menu,
  #pricing-r-995 .cs-menu {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    column-gap: 1.25rem;
    /* 28px - 40px */
    row-gap: clamp(1.75rem, 3vw, 2.5rem);
  }
  #pricing-995 .cs-menu-group,
  #pricing-r-995 .cs-menu-group {
    width: 100%;
    max-width: 39.375rem;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* 28px - 40px */
    gap: clamp(1.75rem, 3vw, 2.5rem);
  }
  #pricing-995 .cs-menu-item,
  #pricing-r-995 .cs-menu-item {
    list-style: none;
    width: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.5rem;
  }
  #pricing-995 .cs-h3,
  #pricing-r-995 .cs-h3 {
    width: 100%;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    position: relative;
    z-index: 1;
  }
  #pricing-995 .cs-h3:before,
  #pricing-r-995 .cs-h3:before {
    /* grey line */
    content: "";
    width: 100%;
    height: 2px;
    background: #e8e8e8;
    opacity: 1;
    position: absolute;
    display: block;
    top: 0.8125rem;
    left: 0;
    z-index: -1;
  }
  #pricing-995 .cs-header,
  #pricing-r-995 .cs-header {
    /* 20px - 25px */
    font-size: clamp(1.25rem, 2vw, 1.5625rem);
    line-height: 1.2em;
    text-align: inherit;
    font-weight: 700;
    max-width: 25rem;
    padding-right: 0.5rem;
    background-color: transparent; /* was #fff */
    color: var(--headerColor);
  }
  #pricing-995 .cs-price,
  #pricing-r-995 .cs-price {
    font-size: 1rem;
    line-height: 1.5em;
    font-weight: 400;
    padding-left: 0.5rem;
    background-color: transparent; /* Was #fff */
    color: var(--headerColor);
  }
  #pricing-995 .cs-menu-text,
  #pricing-r-995 .cs-menu-text {
    font-size: 1rem;
    line-height: 1.5em;
    text-align: inherit;
    margin: 0;
    color: var(--bodyTextColor);
  }
  #pricing-995 .cs-picture,
  #pricing-r-995 .cs-picture {
    width: 100%;
    min-height: 23.75rem;
    display: block;
    /* sends it to the top */
    order: -1;
    position: relative;
  }
  #pricing-995 .cs-picture img,
  #pricing-r-995 .cs-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #pricing-995 .cs-container,
  #pricing-r-995 .cs-container {
    max-width: 80rem;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
  }
  #pricing-995 .cs-menu-group,
  #pricing-r-995 .cs-menu-group {
    width: 100%;
  }
  #pricing-995 .cs-picture,
  #pricing-r-995 .cs-picture {
    max-width: 32.5625rem;
  }
}

/*-- -------------------------- -->
<---     Pricing Reverse        -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #pricing-r-995 {
    /* background-color: #f7f7f7; */
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #pricing-r-995 .cs-header,
  #pricing-r-995 .cs-price {
    /* background-color: #f7f7f7; */
  }
  #pricing-r-995 .cs-picture {
    /* sends it to the right in the 2nd position */
    order: 2;
  }
}

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

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #RPsbs-947,
  #RPsbsr-947 {
    padding: var(--sectionPadding);
    /* clips anything overflowing */
    overflow: hidden;
    position: relative;
  }
  #RPsbs-947 .cs-container,
  #RPsbsr-947 .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, 6vw, 4rem);
  }
  #RPsbs-947 .cs-content,
  #RPsbsr-947 .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;
  }

  #RPsbs-947 .cs-text,
  #RPsbsr-947 .cs-text {
    margin-bottom: 1rem;
  }
  #RPsbs-947 .cs-text:last-of-type,
  #RPsbsr-947 .cs-text:last-of-type {
    margin-bottom: 2rem;
  }
  #RPsbs-947 .cs-button-solid,
  #RPsbsr-947 .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 2rem;
    background-color: var(--primary);
    display: inline-block;
    position: relative;
    z-index: 1;
    /* prevents padding from adding to the width */
    box-sizing: border-box;
  }
  #RPsbs-947 .cs-button-solid:before,
  #RPsbsr-947 .cs-button-solid:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 0%;
    background: #000;
    opacity: 1;
    top: 0;
    left: 0;
    z-index: -1;
    transition: width 0.3s;
  }
  #RPsbs-947 .cs-button-solid:hover:before,
  #RPsbsr-947 .cs-button-solid:hover:before {
    width: 100%;
  }
  #RPsbs-947 .cs-contact-group,
  #RPsbsr-947 .cs-contact-group {
    width: 100%;
    margin-bottom: 2rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    z-index: 1;
  }
  #RPsbs-947 .cs-link,
  #RPsbsr-947 .cs-link {
    text-decoration: none;
    padding-right: 1.875rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1rem;
    position: relative;
  }
  #RPsbs-947 .cs-link:hover:before,
  #RPsbsr-947 .cs-link:hover:before {
    width: 100%;
    height: 3.5em;
  }
  #RPsbs-947 .cs-link:hover .cs-wrapper,
  #RPsbsr-947 .cs-link:hover .cs-wrapper {
    transform: scale(1.2);
  }
  #RPsbs-947 .cs-link:hover .cs-icon,
  #RPsbsr-947 .cs-link:hover .cs-icon {
    transform: translateX(0.4375rem);
  }
  #RPsbs-947 .cs-link:before,
  #RPsbsr-947 .cs-link:before {
    /* light green circle that animates on hover */
    content: "";
    width: 3rem;
    height: 3rem;
    background: #fff;
    opacity: 1;
    position: absolute;
    display: block;
    top: 50%;
    left: 0;
    z-index: -1;
    transform: translateY(-50%);
    transition: width 0.3s, height 0.3s, border-radius 0.3s;
  }
  #RPsbs-947 .cs-wrapper,
  #RPsbsr-947 .cs-wrapper {
    width: 3rem;
    height: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    /* prevents flexbox from squishing it */
    flex: none;
    transition: transform 0.3s;
  }
  #RPsbs-947 .cs-icon,
  #RPsbsr-947 .cs-icon {
    width: 1.5rem;
    height: auto;
    display: block;
    transition: transform 0.3s;
  }
  #RPsbs-947 .cs-info,
  #RPsbsr-947 .cs-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
  }
  #RPsbs-947 .cs-header,
  #RPsbsr-947 .cs-header {
    font-size: 1rem;
    line-height: 1.2em;
    font-weight: 700;
    margin: 0;
    color: var(--headerColor);
    display: block;
  }
  #RPsbs-947 .cs-link-content,
  #RPsbsr-947 .cs-link-content {
    font-size: 1rem;
    line-height: 1.2em;
    font-weight: 400;
    margin: 0;
    color: var(--bodyTextColor);
    display: block;
  }
  #RPsbs-947 .cs-image-group,
  #RPsbsr-947 .cs-image-group {
    /* scales the whole section down and ties the font size to the vw and stops at 75% of the vale of 1em, changes at desktop */
    font-size: min(2.24vw, 0.844em);
    /* everything inside this box is in ems so we can scale it all down proportionally with a font size */
    width: 40.625em;
    height: 42.9375em;
    position: relative;
    z-index: 1;
  }
  #RPsbs-947 .cs-picture,
  #RPsbsr-947 .cs-picture {
    /* clips the image to match the border radius of the cs-picture */
    overflow: hidden;
    display: block;
    position: absolute;
  }
  #RPsbs-947 .cs-picture img,
  #RPsbsr-947 .cs-picture img {
    width: 100%;
    height: 100%;
    /* makes it act like a background image */
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
  }
  #RPsbs-947 .cs-picture1,
  #RPsbsr-947 .cs-picture1 {
    width: 21.8125em;
    height: 36.875em;
    top: 3.0625em;
    left: 0;
  }
  #RPsbs-947 .cs-picture2,
  #RPsbsr-947 .cs-picture2 {
    width: 17.5625em;
    height: 24.1875em;
    top: 0;
    right: 0;
  }
  #RPsbs-947 .cs-picture3,
  #RPsbsr-947 .cs-picture3 {
    width: 17.5625em;
    height: 17.5em;
    bottom: 0;
    right: 0;
  }
  #RPsbs-947 .cs-seal,
  #RPsbsr-947 .cs-seal {
    width: 9.375em;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-30%, -40%);
  }
  #RPsbs-947 .cs-floater,
  #RPsbsr-947 .cs-floater {
    display: none;
  }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #RPsbs-947 .cs-container,
  #RPsbsr-947 .cs-container {
    max-width: 80rem;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
  #RPsbs-947 .cs-image-group,
  #RPsbsr-947 .cs-image-group {
    /* set to inherit at Large Desktop */
    font-size: min(1.15vw, 1em);
    margin: 0;
    /* prevents flexbox from squishing it */
    flex: none;
  }
  #RPsbs-947 .cs-content,
  #RPsbsr-947 .cs-content {
    width: 51%;
  }
}
/* Large Desktop - 1800px */
@media only screen and (min-width: 112.5rem) {
  #RPsbs-947 .cs-floater,
  #RPsbsr-947 .cs-floater {
    width: 27.8125rem;
    height: auto;
    display: block;
    position: absolute;
    right: 0;
    top: 1.25rem;
  }
}
/*-- -------------------------- -->
<---   Side By Side Reverse     -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #RPsbsr-947 {
    /* background-color: #f7f7f7; */
  }
}
/* Small Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #RPsbsr-947 .cs-image-group {
    /* sends it to the right in the 2nd position */
    order: 2;
  }
  #RPsbsr-947 .cs-floater {
    right: auto;
    left: -3.125rem;
    transform: scaleX(-1);
  }
}

@keyframes scrollLeft {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}

@keyframes scrollRight {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(100%);
  }
}

/* Scrolling Logo Bar Animations */

/* Apply scrolling animation */
.scroll-left {
  animation: scrollLeft 30s linear infinite;
}

.scroll-right {
  animation: scrollRight 30s linear infinite;
}

/* Blur effect using pseudo-elements */
#logos-1430::before,
#logos-1430::after,
#logos-1431::before,
#logos-1431::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100px;
  pointer-events: none;
  z-index: 2;
}

#logos-1430::before,
#logos-1431::before {
  left: 0;
  width: 50%;
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 1),
    rgba(255, 255, 255, 0)
  );
}

#logos-1430::after,
#logos-1431::after {
  right: 0;
  width: 50%;
  background: linear-gradient(
    to left,
    rgba(255, 255, 255, 1),
    rgba(255, 255, 255, 0)
  );
}